miawinter/winter-software.com
miawinter/winter-software.com
1
0
Fork 0
Code Actions Activity

added pattern to card background
Some checks failed
hugo-deploy / deploy (push) Has been cancelled
Details

Browse source
This commit is contained in:
Mia Rose Winter 2025-12-15 15:50:54 +01:00
parent 29ba3d9f46
commit 3db4afb24f
Signed by: miawinter
GPG key ID: 4B6F6A83178F595E
2 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/Card.astro
View file

@ -6,7 +6,7 @@ interface Props {
const { title } = Astro.props;
---
<article class="flex flex-col bg-base-200 p-8 rounded-sm border border-neutral shadow-neutral shadow-[6px_6px_0_0] min-h-72 break-inside-avoid-column">
<article class="flex flex-col bg-base-200 p-8 rounded-sm border border-neutral shadow-neutral shadow-[6px_6px_0_0] min-h-72 break-inside-avoid-column cool-background">
<h3 class="text-2xl font-medium mb-4">{title}</h3>
<slot />
</article>

8
src/styles/style.css
View file

@ -65,6 +65,14 @@ neutral: 'rgb(var(--color-neutral) / <alpha-value>)',
}
}
@utility cool-background {
@apply bg-base-100 bg-blend-lighten;
background-image: linear-gradient(135deg, var(--color-base-300) 25%, transparent 25%), linear-gradient(225deg, var(--color-base-300) 25%, transparent 25%), linear-gradient(45deg, var(--color-base-300) 25%, transparent 25%), linear-gradient(315deg, var(--color-base-300) 25%, var(--color-base-100) 25%);
background-position: 4px 0, 4px 0, 0 0, 0 0;
background-size: 4px 4px;
background-repeat: repeat;
}
@layer base {
html, body {
@apply bg-base-100 text-base-content;