youwen5/blog
1
0
Fork 0
mirror of https://github.com/youwen5/blog.git synced 2024-11-24 18:03:50 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

style: change colorscheme to rose-pine, change link style

Browse source
This commit is contained in:
Youwen Wu 2024-11-02 03:53:43 -07:00
parent 4803c2d68e
commit 7600335b4d
Signed by: youwen5
GPG key ID: 865658ED1FE61EC3
3 changed files with 37 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/css/default.css
View file

@ -13,12 +13,12 @@
@layer utilities { @layer utilities {
.external-link { .external-link {
@apply dark:text-violet-500 text-indigo-600 hover:bg-indigo-200 pr-3 rounded-sm dark:hover:bg-violet-950 transition-colors duration-300 relative; @apply underline decoration-solid decoration-2 underline-offset-2 hover:text-love-light dark:hover:text-love-dark decoration-love-light decoration-love-dark;
} }
.external-link::after { .external-link-muted {
@apply absolute top-1 right-[6px] w-2 h-2 border-2 border-indigo-600 dark:border-violet-600 rounded-full translate-x-1/2 -translate-y-1/2; @apply underline decoration-solid decoration-2 underline-offset-2 hover:text-love-light dark:hover:text-love-dark decoration-accent-light decoration-accent-dark;
content: "";
} }
.small-caps { .small-caps {
font-variant: all-small-caps; font-variant: all-small-caps;
} }

12
src/templates/default.html
View file

@ -126,18 +126,18 @@
<p class="mt-8 mb-3 px-1 italic font-light"> <p class="mt-8 mb-3 px-1 italic font-light">
a web-log about computers, math, hacks, and all the rest. a web-log about computers, math, hacks, and all the rest.
</p> </p>
<a class="text-sm external-link" href="https://youwen.dev" <a class="text-sm text-iris-light dark:text-iris-dark hover:text-love-light dark:hover:text-love-dark" href="https://youwen.dev"
><em>by </em>Youwen Wu</a ><em>by </em>Youwen Wu</a
> >
<span class="ml-2 font-serif">|</span> <span class="ml-2 font-serif">|</span>
<button <button
id="theme-toggle" id="theme-toggle"
class="ml-2 text-sm hover:bg-indigo-200 dark:hover:bg-violet-950 rounded-sm transition-colors p-1 duration-500" class="ml-2 text-sm hover:text-accent-light dark:hover:text-muted-dark"
></button> ></button>
<span class="ml-2 font-serif">|</span> <span class="ml-2 font-serif">|</span>
<button <button
id="font-toggle" id="font-toggle"
class="ml-2 text-sm hover:bg-indigo-200 dark:hover:bg-violet-950 rounded-sm transition-colors p-1 duration-500" class="ml-2 text-sm hover:text-accent-light dark:hover:text-muted-dark"
></button> ></button>
</header> </header>
$body$ $body$
@ -149,14 +149,14 @@
&copy; 2024 Youwen Wu. Generated by &copy; 2024 Youwen Wu. Generated by
<a <a
href="https://jaspervdj.be/hakyll/" href="https://jaspervdj.be/hakyll/"
class="external-link" class="external-link-muted"
target="__blank" target="__blank"
>Hakyll.</a >Hakyll.</a
> >
View the source View the source
<a <a
href="https://github.com/couscousdude/blog" href="https://github.com/couscousdude/blog"
class="external-link" class="external-link-muted"
target="__blank" target="__blank"
>on GitHub.</a >on GitHub.</a
> >
@ -164,7 +164,7 @@
<p class="text-sm leading-relaxed mt-2"> <p class="text-sm leading-relaxed mt-2">
Content freely available under Content freely available under
<a <a
class="external-link" class="external-link-muted"
target="__blank" target="__blank"
href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en" href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en"
><span class="smallcaps">CC BY-NC-SA</span> 4.0</a ><span class="smallcaps">CC BY-NC-SA</span> 4.0</a

36
tailwind.config.js
View file

@ -10,24 +10,42 @@ module.exports = {
}, },
colors: { colors: {
primary: { primary: {
dark: "#e7e5e4", //dark: "#e7e5e4",
light: "#44403c", light: "#44403c",
dark: "#e0def4",
//light: "#575279",
}, },
secondary: { secondary: {
dark: "#4c1d95", //dark: "#4c1d95",
light: "#4338ca", //light: "#4338ca",
dark: "#1f1d2e",
light: "#fffaf3",
}, },
accent: { accent: {
dark: "#9ca3af", //dark: "#9ca3af",
light: "#78716c", //light: "#78716c",
dark: "#908caa",
light: "#797593",
}, },
muted: { muted: {
dark: "#6b7280", //dark: "#6b7280",
light: "#a8a29e", //light: "#a8a29e",
dark: "#6e6a86",
light: "#9893a5",
}, },
background: { background: {
light: "#d6d3d1", //light: "#d6d3d1",
dark: "#101017", //dark: "#101017",
dark: "#191724",
light: "#faf4ed",
},
iris: {
dark: "#c4a7e7",
light: "#907aa9",
},
love: {
dark: "#eb6f92",
light: "#b4637a",
}, },
}, },
}, },