Update CSS Colors to vars

This commit is contained in:
Fred Boniface 2022-10-30 20:51:06 +00:00
parent 8225f8eae2
commit e409ff190a

View File

@ -1,6 +1,15 @@
/* COLOR VARS */
:root {
--main-bg-color: #aac4ee;
--accent-color: none;
--overlay-color: #027fe59d;
--main-text-color: #016ec7;
--link-color: azure;
--link-visited-color: azure;
}
body { body {
background-color: #aac4ee; background-color: var(--main-bg-color);
color: #0280e5; color: var(--main-text-color);
font-family: sans-serif; font-family: sans-serif;
text-align: center; text-align: center;
padding-bottom: 60px; /*Footer height*/ padding-bottom: 60px; /*Footer height*/
@ -60,7 +69,7 @@ body {
} }
.form-info { .form-info {
color: #0280e5; color: var(--main-text-color);
font-size: 17px; font-size: 17px;
font-weight: bolder; font-weight: bolder;
margin-bottom: 4px; margin-bottom: 4px;
@ -69,7 +78,7 @@ body {
.text-description { .text-description {
display: inline-block; display: inline-block;
width: 80%; width: 80%;
color: #0280e5; color: var(--main-text-color);
padding-top: 5px; padding-top: 5px;
padding-bottom: 5px; padding-bottom: 5px;
margin-left: auto; margin-left: auto;
@ -85,7 +94,7 @@ body {
.lookup-button { .lookup-button {
background-color: #3c78d8; background-color: #3c78d8;
color: #f6f5f4; color: var(--link-color);
border: none; border: none;
border-radius: 18px; border-radius: 18px;
font-size: 16px; font-size: 16px;
@ -104,7 +113,7 @@ body {
background-color: #3c78d8; background-color: #3c78d8;
border: none; border: none;
border-radius: 10px; border-radius: 10px;
color: #f6f5f4; color: var(--link-color);
padding: 7px; padding: 7px;
margin-bottom: 10px; margin-bottom: 10px;
font-size: 16px; font-size: 16px;
@ -112,7 +121,7 @@ body {
.inlinelink { .inlinelink {
text-decoration: underline; text-decoration: underline;
color: #3c78d8; color: var(--link-color);
cursor: pointer; cursor: pointer;
} }
@ -125,7 +134,7 @@ body {
} }
.sidebar_control { .sidebar_control {
background-color: transparent; background-color: transparent;
color: whitesmoke; color: var(--link-color);
border: none; border: none;
font-family: sans-serif; font-family: sans-serif;
font-size: larger; font-size: larger;
@ -144,7 +153,7 @@ body {
display: block; display: block;
max-width: 250px; max-width: 250px;
width: 0; width: 0;
background-color: navy; background-color: var(--overlay-color);
transition: 0.4s; transition: 0.4s;
} }
#sidebar a { #sidebar a {
@ -155,7 +164,7 @@ body {
text-decoration: none; text-decoration: none;
text-align: center; text-align: center;
font-size: 25px; font-size: 25px;
color: white; color: var(--link-color);
display: block; display: block;
white-space: nowrap; white-space: nowrap;
transition: 0.5s; transition: 0.5s;