phantop
/
quatalog-site
mirror of https://github.com/quatalog/site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Refactor common.css

This commit is contained in:
3eef8a28f26fb2bcc514e6f1938929a1f931762 2023-03-31 16:23:56 -04:00 committed by powe97
parent be8c83769d
commit 7251c9a462
1 changed files with 26 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
css/common.css
View File

@ -19,6 +19,18 @@
--blue: #3f6ef5;
font-size: calc(1vmin + 12px);
/* default theme */
--background-color: var(--deep-purple);
--selection-color: var(--mid-light-purple);
--h-text-color: var(--quacs-yellow);
--p-text-color: var(--quacs-white);
--link-text-color: var(--quacs-midtone);
--link-hover-color: var(--quacs-yellow);
--header-color: var(--quacs-yellow);
--input-background-color: var(--quacs-white);
--input-text-color: var(--mid-dark-purple);
--input-selection-color: var(--quacs-yellow);
}
* {
@ -27,14 +39,14 @@
}
body {
background-color: var(--deep-purple);
background-color: var(--background-color);
overflow-x:hidden;
margin: 0;
font-size: 0.9rem; /* default font-size. works well for small-ish thing */
}
::selection{
background: var(--mid-light-purple);
background: var(--selection-color);
}
.hidden{
@ -49,7 +61,7 @@ svg {
/* TEXT */
h1, h1 a {
color: var(--quacs-yellow);
color: var(--h-text-color);
font-family: "proxima-nova";
font-weight: 900;
margin-top: 0vmin;
@ -67,7 +79,7 @@ h2 {
}
p {
color: var(--quacs-white);
color: var(--p-text-color);
font-family: "proxima-nova";
font-size: 1.2rem;
margin-bottom: 0;
@ -75,8 +87,8 @@ p {
}
p a, p svg {
color: var(--quacs-midtone);
fill: var(--quacs-midtone);
color: var(--link-text-color);
fill: var(--link-text-color);
max-height: 4vmin;
width: 4vmin;
vertical-align: bottom;
@ -87,13 +99,13 @@ p svg {
}
p a:hover, p a:hover svg {
color: var(--quacs-yellow);
fill: var(--quacs-yellow);
color: var(--link-hover-color);
fill: var(--link-hover-color);
}
/* HEADER */
#qlog-header {
border-bottom: 0.2vmin solid var(--quacs-yellow);
border-bottom: 0.2vmin solid var(--header-color);
width: 100%;
min-height: 5.25vmin;
left: 0;
@ -127,28 +139,20 @@ p a:hover, p a:hover svg {
}
input[type="text"] {
background: var(--quacs-white);
background: var(--input-background-color);
border-radius: 100vw;
border: none;
outline:none;
font-family: "proxima-nova";
color: var(--mid-dark-purple);
caret-color: var(--mid-dark-purple);
color: var(--input-text-color);
caret-color: var(--input-text-color);
}
input[type="text"]::selection{
background: var(--quacs-yellow);
background: var(--input-selection-color);
}
/*
d88888b .d88b. d8b db d888888b .d8888.
88' .8P Y8. 888o 88 `~~88~~' 88' YP
88ooo 88 88 88V8o 88 88 `8bo.
88~~~ 88 88 88 V8o88 88 `Y8b.
88 `8b d8' 88 V888 88 db 8D
YP `Y88P' VP V8P YP `8888Y'
*/
/* fonts */
@font-face{
font-family: "rivalsans";