mirror of
https://github.com/kremalicious/blog.git
synced 2024-06-28 08:37:57 +02:00
43 lines
791 B
Plaintext
43 lines
791 B
Plaintext
|
---
|
||
|
import { ChevronRight } from '@images/components'
|
||
|
|
||
|
type Props = {
|
||
|
href: string
|
||
|
}
|
||
|
|
||
|
const { href } = Astro.props
|
||
|
---
|
||
|
|
||
|
<style>
|
||
|
.postMore {
|
||
|
display: inline-block;
|
||
|
font-family: var(--font-family-headings);
|
||
|
font-weight: var(--font-weight-headings);
|
||
|
font-size: calc(var(--font-size-base) * 0.9);
|
||
|
color: var(--link-color);
|
||
|
text-transform: uppercase;
|
||
|
margin-top: var(--spacer);
|
||
|
}
|
||
|
|
||
|
.postMore svg {
|
||
|
display: inline-block;
|
||
|
margin: 0;
|
||
|
top: 0.25rem;
|
||
|
position: relative;
|
||
|
stroke: var(--text-color-light);
|
||
|
transition: 0.2s ease-out;
|
||
|
width: 20px;
|
||
|
height: 20px;
|
||
|
}
|
||
|
|
||
|
.postMore:hover svg,
|
||
|
.postMore:focus svg {
|
||
|
transform: translate3d(0.2rem, 0, 0);
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
<a class="postMore" href={href}>
|
||
|
<slot />
|
||
|
<ChevronRight />
|
||
|
</a>
|