added gamer style

This commit is contained in:
Oliver Atkinson 2023-03-16 01:30:11 -06:00 committed by Oliver Atkinson
parent 314b17986d
commit 52db615e2b
2 changed files with 206 additions and 4 deletions

182
static/gamer.style.css Normal file
View File

@ -0,0 +1,182 @@
body {
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
font-size: large;
background: rgb(40, 40, 40);
color: white;
}
main {
max-width: 75%;
margin: auto;
}
h1 {
text-align: center;
}
h2 {
text-align: center;
}
h3 {
text-align: center;
}
h4 {
text-align: center;
}
header h1 {
color: white;
}
header h4 {
/*
The color half-way between the
background color and pure white
*/
color: rgb(163, 163, 163);
}
a:link {
color: white;
}
a:visited{
color: rgb(174, 174, 174);
}
article a:link {
color: white;
}
article a:visited {
color: rgb(211, 211, 211);
}
hr {
border-top: 2px solid black;
border-radius: 4px;
animation: rgb-pulse 4s infinite alternate;
}
br {
clear: both;
}
pre {
/*
This has to be flagged important because somewhere in hugo a style
is being directly applied to pre blocks. Ill have to find it later.
*/
background-color: rgb(59, 59, 59) !important;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 10px;
padding-right: 10px;
border-radius: 8px;
animation: rgb-pulse 4s infinite alternate;
outline: solid 3px;
}
code {
font-size: large;
color: white;
/*
we need to re-define these
for times when a single backtick is used
*/
background-color: rgb(59, 59, 59);
padding-left: 3px;
padding-right: 3px;
padding-top: 1px;
border-radius: 4px;
}
article {
background-color: black;
animation: rgb-pulse 4s infinite alternate;
outline: solid 5px;
padding: 3%;
border-radius: 10px;
}
img {
border-radius: 4px;
max-width: 100%;
max-height: 100%;
animation: rgb-pulse 4s infinite alternate;
outline: solid 3px;
}
figure {
margin: 2%;
}
footer {
padding-top: 2%;
text-align: center;
clear: both;
}
footer a:any-link {
color: white;
}
/* For NEXTPREV.HTML */
#nextprev {
/* The container for both the previous and next articles. */
color: black;
}
#nextprev a:any-link {
color: black;
}
#nextart {
float: left ;
text-align: left ;
}
#prevart {
float: right ;
text-align: right ;
}
#nextart,#prevart {
max-width: 33% ;
}
/* For TAGLIST.HTML */
.taglist {
text-align: center;
clear: both;
color: rgb(64, 64, 64);
}
/* For putting right / left boxes next to each other */
.left {
width: 45%;
padding-right: 5%;
float: left;
clear: both;
}
.right {
width: 45%;
padding-left: 5%;
float: right;
}
.subtext {
color: rgb(151, 151, 151);
font-style: italic;
}
@keyframes rgb-pulse {
0% {outline: solid rgb(245, 78, 78);}
20% {outline: solid rgb(105, 254, 105);}
40% {outline: solid rgb(255, 255, 42);}
60% {outline: solid rgb(111, 248, 255);}
80% {outline: solid rgb(255, 70, 255);}
100% {outline: solid rgb(245, 78, 78);}
}

View File

@ -12,25 +12,32 @@ body {
background: rgb(71, 71, 71); background: rgb(71, 71, 71);
color: black; color: black;
} }
main { main {
max-width: 75%; max-width: 75%;
margin: auto; margin: auto;
} }
h1 { h1 {
text-align: center; text-align: center;
} }
h2 { h2 {
text-align: center; text-align: center;
} }
h3 { h3 {
text-align: center; text-align: center;
} }
h4 { h4 {
text-align: center; text-align: center;
} }
header h1 { header h1 {
color: white; color: white;
} }
header h4 { header h4 {
/* /*
The color half-way between the The color half-way between the
@ -38,31 +45,39 @@ header h4 {
*/ */
color: rgb(163, 163, 163); color: rgb(163, 163, 163);
} }
a:link { a:link {
color: white; color: white;
} }
a:visited{ a:visited{
color: rgb(174, 174, 174); color: rgb(174, 174, 174);
} }
article a:link { article a:link {
color: rgb(0, 0, 0); color: rgb(0, 0, 0);
} }
article a:visited { article a:visited {
color: rgb(64, 64, 64); color: rgb(64, 64, 64);
} }
article { article {
background-color: burlywood; background-color: burlywood;
outline: cadetblue solid 5px; outline: cadetblue solid 5px;
padding: 3%; padding: 3%;
border-radius: 10px; border-radius: 10px;
} }
hr { hr {
border-top: 2px solid cadetblue; border-top: 2px solid cadetblue;
border-radius: 4px; border-radius: 4px;
} }
br { br {
clear: both; clear: both;
} }
pre { pre {
/* /*
This has to be flagged important because somewhere in hugo a style This has to be flagged important because somewhere in hugo a style
@ -76,6 +91,7 @@ pre {
border-radius: 8px; border-radius: 8px;
outline: cadetblue solid 3px; outline: cadetblue solid 3px;
} }
code { code {
font-size: large; font-size: large;
color: white; color: white;
@ -89,22 +105,27 @@ code {
padding-top: 1px; padding-top: 1px;
border-radius: 4px; border-radius: 4px;
} }
img { img {
border-radius: 4px; border-radius: 4px;
} }
article img { article img {
max-width: 100%; max-width: 100%;
max-height: 100%; max-height: 100%;
outline: cadetblue solid 3px; outline: cadetblue solid 3px;
} }
figure { figure {
margin: 2%; margin: 2%;
} }
footer { footer {
padding-top: 2%; padding-top: 2%;
text-align: center; text-align: center;
clear: both; clear: both;
} }
footer a:any-link { footer a:any-link {
color: white; color: white;
} }
@ -123,15 +144,14 @@ footer a:any-link {
float: left ; float: left ;
text-align: left ; text-align: left ;
} }
#prevart { #prevart {
float: right ; float: right ;
text-align: right ; text-align: right ;
} }
@media screen and (max-width: 900px) { #nextart,#prevart {
main { max-width: 33% ;
max-width: 100%;
margin: auto;
} }
/* For TAGLIST.HTML */ /* For TAGLIST.HTML */