diff options
| author | Kyren223 <Kyren223@proton.me> | 2024-11-13 00:00:30 +0200 |
|---|---|---|
| committer | Kyren223 <Kyren223@proton.me> | 2024-11-13 00:00:30 +0200 |
| commit | 5f18abf234a80b45ed6d1fd935c2f60b2599b87f (patch) | |
| tree | bb341343cc7b6aec1b71d73e264412bf07029346 /src/components | |
| parent | 6d3da9537200e4029d3c9e1b6140f601642f26da (diff) | |
Finished /blogs yay
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/BlogItem.astro | 33 | ||||
| -rw-r--r-- | src/components/Link.astro | 6 | ||||
| -rw-r--r-- | src/components/TerminalBorder.astro | 10 |
3 files changed, 29 insertions, 20 deletions
diff --git a/src/components/BlogItem.astro b/src/components/BlogItem.astro index 5f6b0e5..1535621 100644 --- a/src/components/BlogItem.astro +++ b/src/components/BlogItem.astro @@ -5,18 +5,33 @@ interface Props { title: string; description: string; date: string; + href: string; } -const { title, description, date } = Astro.props; +const { title, description, date, href } = Astro.props; --- -<TerminalBorder footer={date} margin="0 0 20px"> - <span> - <h1 class="text-[130%] text-[var(--accent)]"> - {title} - </h1> - <p class="text-[var(--secondary)]"> - {description} - </p> +<TerminalBorder footer={date} margin="0 0 20px;"> + <span class="cursor-pointer group block w-full"> + <a href={href} style="all: unset;"> + <h1 class="text-[130%] text-[var(--accent)] group-hover:underline"> + {title} + </h1> + <p class="text-[var(--secondary)]"> + {description} + </p> + </a> </span> </TerminalBorder> + +<style> + .section:hover() { + position: relative; + padding: 10.8rem; + padding-top: 0.85rem; + display: flex; + border-style: solid; + border-width: 1px; + border-color: var(--alt); + } +</style> diff --git a/src/components/Link.astro b/src/components/Link.astro index 72a0e0a..e8396ec 100644 --- a/src/components/Link.astro +++ b/src/components/Link.astro @@ -1,12 +1,12 @@ --- interface Props { - href: string; - newTab?: boolean; + href: string; + newTab?: boolean; } const { href, newTab = true } = Astro.props; --- <a href={href} {...newTab && { target: "_blank", rel: "noopener noreferrer" }}> - <slot /> + <slot /> </a> diff --git a/src/components/TerminalBorder.astro b/src/components/TerminalBorder.astro index 0d9a75d..a6af7dc 100644 --- a/src/components/TerminalBorder.astro +++ b/src/components/TerminalBorder.astro @@ -3,18 +3,12 @@ interface Props { header?: string; footer?: string; margin?: string; - class?: string; } -const { - header = "", - footer = "", - margin = "-1px", - class: htmlClass, -} = Astro.props; +const { header = "", footer = "", margin = "-1px" } = Astro.props; --- -<div class="section" style={`margin: ${margin};`} class={htmlClass}> +<div class="section" style={`margin: ${margin};`}> <span class="tag-top">{header}</span> <span class="tag-bottom">{footer}</span> <slot /> |
