colors

ezrizhu · Jul 2, 2024 · 9d2c5ea · 9d2c5ea
1 parent 357b74c
commit 9d2c5ea
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 25 deletions.
diff --git a/css/home.css b/css/home.css
@@ -5,7 +5,7 @@
 
 .hero h1 {
     margin-top: 0;
-    color: var(--nord6);
+    color: var(--light);
     font-size: 1.5rem;
 }
 
@@ -22,23 +22,23 @@
 }
 
 .hero strong {
-    color: var(--nord14);
+    color: var(--pink);
 }
 
 .hero p {
-    color: var(--nord4);
+    color: var(--light);
 }
 
 .separator {
-    color: var(--nord7);
+    color: var(--blue);
     margin-bottom: 0.5rem;
 }
 
 /* recent list */
 .recent-list {
     padding: 0.5rem 0.3rem 1rem 1rem;
     border-radius: 1vh;
-    background: var(--nord1);
+    background: var(--dark2);
     overflow: hidden;
 }
 
@@ -47,7 +47,7 @@
 }
 
 .recent-blog a {
-    color: var(--nord4);
+    color: var(--pink2);
 }
 
 @media screen and (min-width:768px) {
@@ -69,12 +69,12 @@
 
 /* featured projects */
 .featured-projects a {
-    color: var(--nord4);
+    /*color: var(--pink);*/
 }
 
 .home-box {
     border-radius: 1vh;
-    background: var(--nord1);
+    background: var(--dark2);
     padding: 1rem;
     margin-bottom: 1rem;
     overflow: hidden;

diff --git a/css/main.css b/css/main.css
@@ -1,9 +1,21 @@
+:root {
+    --dark: oklch(21.56% 0.01 285.56);
+    --dark2: oklch(27.15% 0.009 293.7);
+    --light: oklch(98.52% 0.0076 1.58);
+    --pink: oklch(78.23% 0.1513 336.5);
+    --pink2: oklch(70.77% 0.1548 355.76);
+    --pink3: oklch(76.52% 0.124 316.74);
+    --purple: oklch(76.41% 0.1234 299.64);
+    --blue: oklch(80.58% 0.0962 265.46);
+    --green: oklch(79.67% 0.1409 167.72);
+}
+
 body {
-    background-color: var(--nord0);
+    background-color: var(--dark);
     display: flex;
     flex-direction: column;
     font-size: 1rem;
-    color: var(--nord4);
+    color: var(--light);
     font-family: "Helvetica Neue", -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
     margin-left: auto;
     margin-right: auto;
@@ -15,23 +27,19 @@ p {
 }
 
 a {
-    color: var(--nord8);
+    color: var(--purple);
 }
 
 a:hover {
-    color: var(--nord7);
+    color: var(--pink3);
 }
 
 a:visited {
-    color: var(--nord9);
-}
-
-a:hover {
-    color: var(--nord7);
+    color: var(--pink2);
 }
 
 hr {
-    color: var(--nord3);
+    color: var(--pink);
 }
 
 li {
@@ -113,7 +121,7 @@ ul {
 }
 
 .pure-menu-link {
-    color: var(--nord6) !important;
+    color: var(--light) !important;
     padding: 3vw 5vw 3vw 0;
 }
 
@@ -129,7 +137,7 @@ ul {
 
 /* banner */
 .banner {
-    color: var(--nord15);
+    color: var(--green);
     text-align: center;
     font-style: italic;
     margin: 0 0 1vw 0;
@@ -150,7 +158,7 @@ ul {
 .footer {
     padding: 1rem;
     font-size: 0.75rem;
-    color: var(--nord4);
+    color: var(light);
     text-align: center;
 }
 

diff --git a/css/news.css b/css/news.css
@@ -7,8 +7,8 @@ ul {
 }
 
 .news {
+    background: var(--dark2)
     padding: 1rem;
-    background: var(--nord1);
     border-radius: 1vh;
     max-width: 100ch;
     margin: auto;

diff --git a/css/post-index.css b/css/post-index.css
@@ -4,7 +4,6 @@ h1 {
 
 .box {
     padding: 1rem;
-    background: var(--nord1);
     border-radius: 1vh;
     max-width: 100ch;
     margin: auto;

diff --git a/css/post.css b/css/post.css
@@ -3,11 +3,11 @@
 }
 
 pre {
-    background: var(--nord1);
+    background: var(--dark2);
     padding: 1rem;
     white-space: pre-wrap;
     border-radius: 1%;
-    border: solid var(--nord2);
+    border: solid var(--pink);
     border-width: thin;
 }