From e9a12914134d281438b087115eb90bb0aac2b5e3 Mon Sep 17 00:00:00 2001 From: ktyl Date: Sat, 24 Dec 2022 18:12:13 +0000 Subject: [PATCH] update site colours --- src/inc_css/blog.css | 10 +++------- src/inc_css/gallery.css | 25 ++++++++++--------------- src/inc_css/landing.css | 11 +++++------ src/inc_css/nav.css | 6 ++++-- src/inc_css/planets.css | 25 ++++++------------------- 5 files changed, 28 insertions(+), 49 deletions(-) diff --git a/src/inc_css/blog.css b/src/inc_css/blog.css index 7700f39..7f0f8a4 100644 --- a/src/inc_css/blog.css +++ b/src/inc_css/blog.css @@ -22,14 +22,13 @@ } .page .blog .code-panel { - color: var(--background); - background-color: var(--foreground); + color: var(--lighter); + background-color: var(--darker); font-size 1.5em; line-height: 1.3em; - border-color: var(--accent); - border-width: 2px; + border-color: var(--light); border-radius: 2em; border-style: solid; @@ -56,8 +55,6 @@ height: 0.8em; padding: 0.07em 0.25em; margin: 0 0.1em; - background-color: var(--foreground-inactive); - color: var(--background); border-radius: .3em; } @@ -86,7 +83,6 @@ ul.blog-index li a { padding-right: .3em; left: -1.9em; position: relative; - /*color: var(--dark);*/ } .blog-index .post-date:hover { diff --git a/src/inc_css/gallery.css b/src/inc_css/gallery.css index 45e06a1..29cb08a 100644 --- a/src/inc_css/gallery.css +++ b/src/inc_css/gallery.css @@ -1,11 +1,13 @@ .page.portfolio { - padding-top: 0; + padding-top: 2em; width: 50%; margin-left:auto; margin-right:auto; transform: translate(-50%,0); + + color: var(--darker); } .portfolio p { @@ -17,17 +19,6 @@ background-color: var(--clear); } -.glass { - padding: 0.4em 0.6em; - color: var(--foreground-inactive); - background-color: var(--background); - opacity:0.9; - - border-style:solid; - border-radius:2em; - border-color:var(--clear); -} - /* gallery img */ .wrapper { margin-top: 1em; @@ -35,6 +26,13 @@ height: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr; + + border-color: var(--light); + border-style: solid; + border-radius: 1em; + border-width: 3px; + + overflow: hidden; } .wrapper .imgHolder { position: relative; @@ -106,7 +104,4 @@ .icon-link { display: none; } - .wrapper .imgHolder span i { - /*display: none;*/ - } } diff --git a/src/inc_css/landing.css b/src/inc_css/landing.css index b6e465a..907f545 100644 --- a/src/inc_css/landing.css +++ b/src/inc_css/landing.css @@ -4,14 +4,14 @@ text-align: center; } -.landing .fsText a { +.landing a { color: var(--foreground); font-size: 2em; transform: translate(0,50%); transition: all 0.3s; } -.landing .fsText a:hover { +.landing a:hover { color: var(--accent); } @@ -23,9 +23,9 @@ .landing li a { position: relative; - font-size: 2.5em; + font-size: 3.0em; margin: 0 .2em; - /*color: var(--foreground);*/ + color: var(--darker); } .landing li a:hover { transform: translateY(-10%); @@ -34,7 +34,6 @@ .landing .socials { position: relative; - background-color: var(--clear); top: 1em; left: auto; @@ -44,7 +43,7 @@ } .landing .socials i { - font-size: 3.5em; + font-size: 2.5em; padding: 0 .07em; } diff --git a/src/inc_css/nav.css b/src/inc_css/nav.css index add1a0f..409e0a1 100644 --- a/src/inc_css/nav.css +++ b/src/inc_css/nav.css @@ -7,7 +7,6 @@ padding-top: 2em; padding-left: 2em; - background-color: var(--clear); color: var(--darker); } @@ -59,6 +58,8 @@ ul.nav-links { @media only screen and (max-width: 1000px) { .nav { + background-color: var(--light); + position: fixed; width: 100%; padding: 0; @@ -79,7 +80,8 @@ ul.nav-links { position: absolute; top: 0; right: 0; - padding: .6em .6em 0 0; + padding: 0; + padding-right: 0.8em; float: right; text-align: right; width: auto; diff --git a/src/inc_css/planets.css b/src/inc_css/planets.css index b09e95c..47991c1 100644 --- a/src/inc_css/planets.css +++ b/src/inc_css/planets.css @@ -1,13 +1,12 @@ .planets { overflow: hidden; position: fixed; - height: 80vmax; - width: 80vmax; + height: 100%; + width: 100%; right: 0; bottom: 0; z-index: -1; - /*background-color: var(--background);*/ background-color: transparent; } @media only screen and (max-width: 600px) { @@ -20,6 +19,8 @@ } .planet { + background-color: var(--light); + position: absolute; border-radius: 50%; display: inline-block; @@ -31,7 +32,7 @@ .orbit { position: absolute; - /*border: #orbit_thickness.css solid var(--foreground-inactive);*/ + border: #orbit_thickness.css solid var(--light); border-radius: 100%; background-color: transparent; @@ -54,15 +55,14 @@ from { transform: rotate(360deg) translateX(#or_mercury.css) rotate(360deg); } to { transform: rotate(0deg) translateX(#or_mercury.css) rotate(0deg); } } + #mercury { --period: 4.82s; --radius: 30px; - --color: var(--background-alt); width: var(--radius); height: var(--radius); - background-color: var(--color); right: #solposx.css; bottom: #solposy.css; @@ -83,8 +83,6 @@ width: var(--diameter); height: var(--diameter); - - border: #orbit_thickness.css solid var(--background-alt); } @-webkit-keyframes orbit_venus { @@ -106,12 +104,10 @@ #venus { --period: 12.3s; --radius: #pr_venus.css; - --color: var(--background-alt); width: var(--radius); height: var(--radius); - background-color: var(--color); right: #solposx.css; bottom: #solposy.css; @@ -132,7 +128,6 @@ width: var(--diameter); height: var(--diameter); - border: #orbit_thickness.css solid var(--background-alt); } @-webkit-keyframes orbit_earth { @@ -154,12 +149,10 @@ #earth { --period: 20s; --radius: #pr_earth.css; - --color: var(--background-alt); width: var(--radius); height: var(--radius); - background-color: var(--color); right: #solposx.css; bottom: #solposy.css; @@ -180,8 +173,6 @@ width: var(--diameter); height: var(--diameter); - - border: #orbit_thickness.css solid var(--background-alt); } @-webkit-keyframes orbit_mars { @@ -203,12 +194,10 @@ #mars { --period: 37.6s; --radius: #pr_mars.css; - --color: var(--background-alt); width: var(--radius); height: var(--radius); - background-color: var(--color); right: #solposx.css; bottom: #solposy.css; @@ -229,6 +218,4 @@ width: var(--diameter); height: var(--diameter); - - border: #orbit_thickness.css solid var(--background-alt); }