]> git.otsuka.systems Git - cotsuka.github.io/commitdiff
finalize color scheme
authorCameron Otsuka <cameron@otsuka.haus>
Thu, 11 Dec 2025 01:28:57 +0000 (17:28 -0800)
committerCameron Otsuka <cameron@otsuka.haus>
Thu, 11 Dec 2025 01:28:57 +0000 (17:28 -0800)
src/components/footer.astro
src/components/heading.astro
src/components/ratingdistribution/chart.tsx
src/components/ui/spoiler.astro
src/styles/style.css

index 80ea83197f13ce5748a5a7f98dd2afb67ef93ec2..3802be915bacf752c7104f0a10273ab10b585adc 100644 (file)
@@ -40,5 +40,6 @@ const currentYear = new Date().getFullYear();
     }
     [data-icon="mdi:rss"] {
         display: inline-block;
+        vertical-align: middle;
     }
 </style>
\ No newline at end of file
index 47ccdad3bb4198d3266d14c8af2576a09524021b..6ec9bd057a9809bac568bef1d6972dba375d2c79 100644 (file)
@@ -6,7 +6,7 @@ import Navigation from '@components/navigation.astro';
 
 <style>
     a {
-        color: light-dark(#000000, #ffffff);
+        color: light-dark(#000000, #e6e2d6);
     }
     a:hover {
         text-decoration: none;
index 49764b390bd549cf49815523114d9c492adf7bb0..21b50fe2597ca8e4b3091385218d9f0c909d08de 100644 (file)
@@ -1,19 +1,23 @@
-import { BarChart, Bar, XAxis, YAxis, CartesianGrid, ResponsiveContainer, Tooltip } from 'recharts';
+import { BarChart, Bar, XAxis, YAxis, ResponsiveContainer, Tooltip } from 'recharts';
 
 export default function Chart({ chartData }: { chartData: { name: string, count: number }[] }) {
     return (
         <ResponsiveContainer width="100%" height={150}>
             <BarChart data={chartData}>
-                <CartesianGrid strokeDasharray="3 3" />
-                <XAxis dataKey="name" />
-                <YAxis width="auto"/>
+                <XAxis
+                    dataKey="name"
+                    tick={{ fill: "light-dark(#000000, #e6e2d6)" }}
+                />
+                <YAxis
+                    width="auto"
+                    tick={{ fill: "light-dark(#000000, #e6e2d6)" }}
+                />
                 <Tooltip          
-                    contentStyle={{ color: "light-dark(#000000, #000000)" }}
-                    itemStyle={{ color: "light-dark(#000000, #000000)" }}
-                    labelStyle={{ color: "light-dark(#000000, #000000)" }}
-                    wrapperStyle={{ color: "light-dark(#000000, #000000)" }}
+                    contentStyle={{ backgroundColor: "light-dark(#000000, #e6e2d6)" }}
+                    itemStyle={{ color: "light-dark(#e6e2d6, #000000)" }}
+                    labelStyle={{ color: "light-dark(#e6e2d6, #000000)" }}
                 />
-                <Bar dataKey="count" fill="light-dark(#000000, #ffffff)" />
+                <Bar dataKey="count" fill="light-dark(#000000, #e6e2d6)" />
             </BarChart>
         </ResponsiveContainer>
     )
index eae7fc644a542b503ddb9d76d618cb2061f3c03a..6fccce934f34873b9ecafbc2b540767299b08ff2 100644 (file)
@@ -5,8 +5,8 @@
 
 <style>
     details.spoiler {
-        color: light-dark(#ffffff, #000000);
-        background-color: light-dark(#000000, #ffffff);
+        color: light-dark(#e6e2d6, #000000);
+        background-color: light-dark(#000000, #e6e2d6);
         margin-bottom: 1rem;
         padding: 0.5rem;
         &[open] {
index d04206d09fe7f5ada5745e285c8430aebccc9ff4..3a60f50177e9d7e1173644af285cd8b15a877bae 100644 (file)
@@ -7,8 +7,8 @@
 }
 
 html {
-  background-color: light-dark(#ffffff, #000000);
-  color: light-dark(#000000, #ffffff);
+  background-color: light-dark(#e6e2d6, #000000);
+  color: light-dark(#000000, #e6e2d6);
   font-family: "Source Serif 4 Variable", serif;
   font-kerning: normal;
   font-weight: 400;
@@ -35,7 +35,7 @@ p {
 }
 a {
   text-decoration: none;
-  color: light-dark(#086ddd, #398ae3);
+  color: light-dark(#8b2942, #d4637a);
 }
 a:hover {
   text-decoration: underline;
@@ -76,7 +76,7 @@ table {
   border-collapse: collapse;
 }
 th, td {
-  border: 0.1rem solid light-dark(#000000, #2F3336);
+  border: 0.1rem solid light-dark(#000000, #e6e2d6);
   text-align: center;
   vertical-align: middle;
   padding: 0.5rem;
@@ -92,7 +92,7 @@ code {
 }
 .footnotes {
   font-size: 0.9rem;
-  border-top: 1px dashed light-dark(#000000, #ffffff);
+  border-top: 1px dashed light-dark(#000000, #e6e2d6);
   margin-top: 1rem;
   padding-top: 1rem;
 }