feat(Components): Add pagination component
This component accept a Page<T> type from [astro](https://docs.astro.build/en/guides/routing/#complete-api-reference)
This commit is contained in:
parent
642e15656e
commit
944b553e73
9 changed files with 258 additions and 83 deletions
|
|
@ -1,24 +1,36 @@
|
|||
---
|
||||
interface Props {
|
||||
className?: string;
|
||||
href?: string;
|
||||
}
|
||||
|
||||
const { className = '' } = Astro.props;
|
||||
const { className = '', href } = Astro.props;
|
||||
---
|
||||
|
||||
<button class:list={className}>
|
||||
<slot />
|
||||
</button>
|
||||
{
|
||||
href !== undefined ? (
|
||||
<a href={href} class:list={['clean', 'btn', className]}>
|
||||
<slot />
|
||||
</a>
|
||||
) : (
|
||||
<button class:list={className}>
|
||||
<slot />
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
<style lang="scss">
|
||||
button {
|
||||
button,
|
||||
.btn {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
font-size: 1rem;
|
||||
padding: var(--prj-spacing-1) var(--prj-spacing-3);
|
||||
background-color: var(--prj-accent-bg);
|
||||
color: var(--prj-accent-text);
|
||||
|
||||
border-radius: 6px;
|
||||
border-color: var(--prj-accent-bg);
|
||||
border: 1px solid var(--prj-accent-bg);
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue