autonomic-cooperative/astro-payload-test
0
0
Fork 0
generated from autonomic-cooperative/astro-payload-template
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: autonomic-cooperative:ad7480d13ade66132060c038c592b141eb3d9042
Branches Tags
autonomic-cooperative:main
autonomic-cooperative:deploy-experiments
autonomic-cooperative:t-work
...
compare: autonomic-cooperative:e3f725bf5c09ddeeb07f4d8821574760622524d2
Branches Tags
autonomic-cooperative:main
autonomic-cooperative:deploy-experiments
autonomic-cooperative:t-work

3 Commits
ad7480d13a ... e3f725bf5c

Author SHA1 Message Date
tobias
e3f725bf5c Tiny footer CSS enhancements
All checks were successful
continuous-integration/drone/push Build is passing
Details
2024-05-19 20:58:07 +02:00
tobias
526bd24742 Reasonabler CSS defaults 2024-05-19 20:46:41 +02:00
tobias
2cbd830255 Add light & dark theme 2024-05-19 20:45:22 +02:00
3 changed files with 46 additions and 3 deletions
Show Stats Expand all files Collapse all files

4
astro/src/components/Footer.astro
View File

@ -3,9 +3,9 @@ import { getCurrentYear } from "@/utils/date";
import ThemeSwitcher from "./ThemeSwitcher.astro";
---
<footer class="flex justify-between">
<footer class="flex justify-between items-center py-4">
<p class="text-lg font-semibold">
&copy; {getCurrentYear()} Example Website. All rights reserved.
&copy; {getCurrentYear()} Autonomic. Template distributed under AGPL 3.0.
</p>
<ThemeSwitcher/>
</footer>

43
astro/src/global.css
View File

@ -2,6 +2,45 @@
@tailwind components;
@tailwind utilities;
.light {
--black: 10, 16, 19;
--white: 243, 252, 248;
--absolute-black: 0, 0, 0;
--absolute-white: 255, 255, 255;
/* Use these in tailwind.config.cjs */
--primary: var(--black);
--secondary: var(--black);
--tertiary: var(--black);
--text: var(--black);
--textInverted: var(--absolute-white);
--link: var(--black);
--background: var(--white);
}
.dark {
--black: 10, 16, 19;:root {
}
--white: 243, 252, 248;
--absolute-black: 0, 0, 0;
--absolute-white: 255, 255, 255;
/* Use these in tailwind.config.cjs */
--primary: var(--white);
--secondary: var(--white);
--tertiary: var(--white);
--text: var(--white);
--textInverted: var(--absolute-black);
--link: var(--white);
--background: var(--black);
}
.autonomic {
/* Palette */
/* RGBA instead of hex so that opacity will work */
@ -60,4 +99,8 @@
ul {
@apply list-disc;
}
select {
@apply bg-background border-primary border px-2 py-1 text-lg;
}
}

2
astro/src/layouts/BaseLayout.astro
View File

@ -31,7 +31,7 @@ import "@/global.css"
}
</style>
</head>
<body class="autonomic min-h-screen flex flex-col mx-auto max-w-7xl px-4 text-primary bg-background">
<body class="autonomic min-h-screen flex flex-col mx-auto max-w-7xl px-6 text-primary bg-background">
<slot />
</body>
</html>