add accent colour

This commit is contained in:
ktyl 2021-09-19 22:54:55 +01:00
parent 55e2bee73e
commit cb83c44156
2 changed files with 19 additions and 6 deletions

View File

@ -3,6 +3,7 @@
--background: #eee; --background: #eee;
--foreground: #222; --foreground: #222;
--foreground-inactive: #777; --foreground-inactive: #777;
--accent: lightpink;
/* Colors */ /* Colors */
--color0: #0000ff; --color0: #0000ff;

View File

@ -12,10 +12,21 @@ body {
} }
.title { .title {
position: relative;
margin-top: 40px;
margin-left: 80px; margin-left: 80px;
font-size: 1.4em; font-size: 1.4em;
} }
.title a {
transition: color 0.3s;
}
.title a:hover {
color: lightpink;
}
h1 { h1 {
font-size: var(--font-size); font-size: var(--font-size);
color: var(--color1); color: var(--color1);
@ -57,7 +68,7 @@ a.fsText {
a.fsText:hover { a.fsText:hover {
background-color: var(--background); background-color: var(--background);
color: var(--foreground); color: var(--accent);
transform: scale(1.1, 1); transform: scale(1.1, 1);
} }
@ -137,17 +148,18 @@ a.fsText:hover {
.socials i { .socials i {
font-size: 2em; font-size: 2em;
margin-left: 4px; margin-left: 4px;
color: var(--foreground-inactive);
transition: transform 0.3s, color 0.3s;
}
.socials i:hover {
color: var(--accent);
transform: translateY(-20%);
} }
.socials a { .socials a {
color: var(--foreground-inactive);
text-decoration: none; text-decoration: none;
transition: color 0.3s; transition: color 0.3s;
} }
.socials a:hover {
color: var(--foreground);
}
#include planets.css #include planets.css