mirror of
https://github.com/kogakure/website-astro-stefanimhoff.de.git
synced 2026-02-03 20:15:27 +00:00
chore: replace MoreLink with preact component
This commit is contained in:
@@ -1,23 +0,0 @@
|
||||
---
|
||||
import { Sprite } from 'astro-icon';
|
||||
|
||||
import { TextLink } from '../components';
|
||||
|
||||
export interface Props {
|
||||
href: string;
|
||||
text: string;
|
||||
}
|
||||
|
||||
const { href, text, ...props } = Astro.props;
|
||||
---
|
||||
|
||||
<TextLink class="group" href={href} {...props}>
|
||||
{text}
|
||||
<span class="more-icon relative inline-flex mis-[0.2em] block-start-[0.2em]">
|
||||
<Sprite
|
||||
name="ri:arrow-right-line"
|
||||
aria-hidden="true"
|
||||
class="h-icon w-icon transition-transform duration-500 ease-in-out group-hover:translate-x-1 group-focus:translate-x-1"
|
||||
/>
|
||||
</span>
|
||||
</TextLink>
|
||||
21
src/components/MoreLink.tsx
Normal file
21
src/components/MoreLink.tsx
Normal file
@@ -0,0 +1,21 @@
|
||||
import type { FunctionalComponent, JSX } from 'preact';
|
||||
|
||||
import { TextLink } from '.';
|
||||
import { ArrowRight } from './icons';
|
||||
|
||||
interface Props extends JSX.HTMLAttributes<HTMLAnchorElement> {
|
||||
href: string;
|
||||
text: string;
|
||||
}
|
||||
|
||||
export const MoreLink: FunctionalComponent<Props> = ({ href, text, ...props }) => (
|
||||
<TextLink class="group" href={href} {...props}>
|
||||
{text}
|
||||
<span class="more-icon relative inline-flex mis-[0.2em] block-start-[0.2em]">
|
||||
<ArrowRight
|
||||
aria-hidden="true"
|
||||
class="icon h-icon w-icon transition-transform duration-500 ease-in-out group-hover:translate-x-1 group-focus:translate-x-1"
|
||||
/>
|
||||
</span>
|
||||
</TextLink>
|
||||
);
|
||||
@@ -1,8 +1,7 @@
|
||||
---
|
||||
import type { CollectionEntry } from 'astro:content';
|
||||
|
||||
import MoreLink from '../components/MoreLink.astro';
|
||||
import { Headline, Text } from '../components';
|
||||
import { Headline, Text, MoreLink } from '../components';
|
||||
|
||||
interface Props {
|
||||
project: CollectionEntry<'projects'>;
|
||||
|
||||
@@ -17,6 +17,7 @@ export * from './Headline';
|
||||
export * from './LegalDate';
|
||||
export * from './Link';
|
||||
export * from './ListItem';
|
||||
export * from './MoreLink';
|
||||
export * from './NetflixFlag';
|
||||
export * from './OdyseeVideo';
|
||||
export * from './OrderedList';
|
||||
|
||||
@@ -3,7 +3,6 @@ import { YouTube } from '@astro-community/astro-embed-youtube';
|
||||
import EmailLink from './components/EmailLink.astro';
|
||||
import Image from './components/Image.astro';
|
||||
import MarkdownImage from './components/MarkdownImage.astro';
|
||||
import MoreLink from './components/MoreLink.astro';
|
||||
import Picture from './components/Picture.astro';
|
||||
import ThemeBox from './components/ThemeBox.astro';
|
||||
|
||||
@@ -23,6 +22,7 @@ import {
|
||||
Flag,
|
||||
Headline,
|
||||
ListItem,
|
||||
MoreLink,
|
||||
NetflixFlag,
|
||||
OdyseeVideo,
|
||||
OrderedList,
|
||||
|
||||
@@ -7,7 +7,6 @@ import { site, animation, animationDelay } from '../data/site';
|
||||
|
||||
import GridLayout from '../layouts/GridLayout.astro';
|
||||
|
||||
import MoreLink from '../components/MoreLink.astro';
|
||||
import PageTitle from '../components/PageTitle.astro';
|
||||
import Picture from '../components/Picture.astro';
|
||||
import JournalList from '../components/JournalList.astro';
|
||||
@@ -19,7 +18,7 @@ import JournalList from '../components/JournalList.astro';
|
||||
import WriteFile from '../components/WriteFile.astro';
|
||||
import RssXml from '../components/RssXml.astro';
|
||||
|
||||
import { Headline } from '../components';
|
||||
import { Headline, MoreLink } from '../components';
|
||||
|
||||
import { Content as AboutMe } from '../text/homepage/about-me.mdx';
|
||||
import { Content as WhatIDo } from '../text/homepage/what-i-do.mdx';
|
||||
|
||||
Reference in New Issue
Block a user