wip start improving colours
continuous-integration/drone/push Build is passing Details

This commit is contained in:
ktyl 2022-12-23 02:16:44 +00:00
parent 8d0a5376c3
commit 03c2cec511
9 changed files with 46 additions and 70 deletions

View File

@ -68,25 +68,29 @@ ul.blog-index li {
} }
ul.blog-index li a { ul.blog-index li a {
color: var(--foreground-inactive); color: var(--darker);
transition: none; transition: none;
text-decoration: none; text-decoration: none;
} }
.blog-index li a:visited {
color: var(--light);
}
.blog-index li a:hover { .blog-index li a:hover {
color: var(--accent); color: var(--accent);
} }
.blog-index li a:visited {
color: var(--foreground);
}
.page ul.blog-index li a::before {
content: "• "
}
.blog-index .post-date { .blog-index .post-date {
padding-right: 1em; padding-right: .3em;
left: -1.9em;
position: relative;
/*color: var(--dark);*/
}
.blog-index .post-date:hover {
color: var(--accent);
} }
.page .blog .img-panel .page .blog .img-panel

View File

@ -6,6 +6,6 @@
position: absolute; position: absolute;
left: 50%; left: 50%;
transform: translate(-50%, 0); transform: translate(-50%, 0);
color: var(--foreground-inactive); color: var(--clear);
padding: 2em; padding: 2em;
} }

View File

@ -5,7 +5,7 @@
} }
.landing .fsText a { .landing .fsText a {
color: var(--foreground-inactive); color: var(--foreground);
font-size: 2em; font-size: 2em;
transform: translate(0,50%); transform: translate(0,50%);
@ -25,7 +25,7 @@
position: relative; position: relative;
font-size: 2.5em; font-size: 2.5em;
margin: 0 .2em; margin: 0 .2em;
color: var(--foreground-inactive); /*color: var(--foreground);*/
} }
.landing li a:hover { .landing li a:hover {
transform: translateY(-10%); transform: translateY(-10%);
@ -44,7 +44,6 @@
} }
.landing .socials i { .landing .socials i {
color: var(--foreground-inactive);
font-size: 3.5em; font-size: 3.5em;
padding: 0 .07em; padding: 0 .07em;
} }

View File

@ -1,20 +1,20 @@
.nav { .nav {
position: fixed; position: fixed;
width: max(11vmax, 200px); width: max(11vmax, 300px);
top: 0; top: 0;
bottom:0; bottom:0;
padding-top: 2em; padding-top: 2em;
padding-left: 2em; padding-left: 2em;
background-color: var(--background); background-color: var(--clear);
color: var(--foreground); color: var(--darker);
} }
.nav-links { .nav-links {
position: relative; position: relative;
padding-top: 2em; padding-top: 1.8em;
padding-bottom: 1em; padding-bottom: 1em;
padding-left:0; padding-left:0;
@ -27,12 +27,15 @@ ul.nav-links {
.nav .nav-links li { .nav .nav-links li {
display: block; display: block;
margin-bottom: 0.8em; font-size: 1.6em;
line-height: 2em;
} }
/*
.nav li a::before { .nav li a::before {
content: "/"; content: "/";
} }
*/
.nav li a { .nav li a {
display: block; display: block;
@ -63,7 +66,7 @@ ul.nav-links {
top: 0; top: 0;
height: 3em; height: 3em;
border-bottom: 3px solid var(--background-alt); border-bottom: 3px solid var(--darker);
} }
.nav .title { .nav .title {

View File

@ -11,7 +11,7 @@
.page .separator { .page .separator {
position: relative; position: relative;
background-color: var(--foreground-inactive); background-color: var(--dark);
width: .35em; width: .35em;
height: .35em; height: .35em;
@ -28,32 +28,31 @@
transition: all 0.1s; transition: all 0.1s;
} }
.page a:hover { .page a:hover {
color: var(--foreground); color: var(--light);
} }
.page .text-panel { .page .text-panel {
margin: 0; margin: 0;
margin-left: -1.5em; margin-left: -1.5em;
padding: .2em 1.3em; padding: .2em 1.3em;
color: var(--foreground-inactive); color: var(--darker);
font-size: 1.1em; font-size: 1.1em;
/*font-weight: bold;*/
line-height: 1.25em; line-height: 1.25em;
background-color: var(--background); background-color: var(--lighter);
border-radius: 1.5em; border-radius: 1.5em;
width: 100%; width: 100%;
border-color: var(--background-alt); border-color: var(--darker);
border-width: 3px; border-width: 3px;
border-style: solid; border-style: solid;
} }
.page h1, h2 { .page h1, h2 {
color: var(--foreground-inactive); color: var(--darker);
font-size: 1.7em; font-size: 1.7em;

View File

@ -1,7 +1,7 @@
.socials { .socials {
position: absolute; position: absolute;
background-color:var(--background); background-color: var(--clear);
bottom: 1.6em; bottom: 1.6em;
} }
@ -9,11 +9,10 @@
.socials i { .socials i {
font-size: 2.0em; font-size: 2.0em;
padding-right: .1em; padding-right: .1em;
color: var(--foreground-inactive); color: var(--darker);
transition: color 0.3s; transition: color 0.3s;
} }
.socials i:hover { .socials i:hover {
color: var(--accent); color: var(--accent);
} }
@ -22,4 +21,3 @@
transition: color 0.3s; transition: color 0.3s;
} }

View File

@ -1,24 +1,19 @@
.title { .title {
font-size: 1em; font-size: 1em;
position: relative;
bottom: 0.25em;
} }
.title h1 { .title h1 {
padding-bottom: 0; margin: 0;
margin-bottom:0;
margin-top:0;
} }
.title a { .title a {
transition: all 0.1s ease-in; transition: all 0.1s ease-in;
color: var(--foreground-active); color: var(--darker);
} }
.title a:hover { .title a:hover {
color: var(--accent); color: var(--accent);
transform: translateY(50%);
} }
.pageTitle {
margin-left: -0.15em;
color: var(--foreground-inactive);
}

View File

@ -1,17 +1,8 @@
:root { :root {
/* Special */ --lighter: #eee;
--background: #eee; --light: #aaa;
--background-alt: #b8b8b8; --dark: #888;
--foreground: #444; --darker: #383838;
--foreground-inactive: #777; --accent: #d522ae;
--accent: #ff369a;
--clear: rgba(0,0,0,0); --clear: rgba(0,0,0,0);
/* Colors */
--color0: #0000ff;
--color1: #00ff00;
--color2: #ff0000;
--color3: #ff00ff;
--color4: #ffff00;
--color5: #00ffff;
} }

View File

@ -8,7 +8,7 @@ body {
font-family: sans-serif; font-family: sans-serif;
margin: 0; margin: 0;
background-color: var(--background); background-color: var(--dark);
} }
#include title.css #include title.css
@ -22,25 +22,12 @@ li {
display:inline; display:inline;
} }
a.fsText { a {
text-decoration: none; text-decoration: none;
color: var(--foreground-inactive); color: var(--darker);
transform: scale(1); transition: color 0.2s;
transition: background-color 0.2s, color 0.2s, transform 0.2s;
} }
.fsText a {
text-decoration: none;
color: var(--foreground);
}
.fsText {
--font-size: 1.4em;
font-size: var(--font-size);
color: var(--foreground);
}
#include socials.css #include socials.css
#include gallery.css #include gallery.css
#include planets.css #include planets.css