dark mode and light mode support

This commit is contained in:
rei
2022-12-30 15:01:25 +01:00
parent d397503c66
commit 4d9092ae3d
10 changed files with 148 additions and 146 deletions

View File

@@ -3,7 +3,7 @@
@import "tailwindcss/utilities";
body {
@apply dark:bg-gradient-dark dark:text-primary-text bg-white text-gradient-dark xl:w-2/3 w-11/12 mx-auto;
@apply dark:bg-gradient-dark dark:text-primary-text bg-slate-100 text-gradient-dark xl:w-2/3 w-11/12 mx-auto;
}
.prose {
@@ -11,9 +11,12 @@ body {
min-width: 100%;
}
pre {
@apply dark:bg-slate-800 bg-slate-200 text-slate-800 !important;
}
pre > code {
background: transparent !important;
color: white !important;
@apply bg-transparent text-gray-700 dark:text-slate-300 !important;
}
.codeStyle > code {
@@ -25,9 +28,9 @@ pre > div > div > button > svg:hover {
}
h3 > a {
@apply cursor-pointer relative xl:text-4xl text-2xl text-primary-text decoration-transparent font-black uppercase !important;
@apply cursor-pointer relative xl:text-4xl text-2xl text-gray-800 dark:text-primary-text decoration-transparent font-black uppercase !important;
}
h3 > a:hover::before {
@apply content-['#'] absolute -left-8 text-gray-600;
@apply content-['#'] absolute -left-8 text-gray-300 dark:text-gray-600;
}