Improve the CSS a lot

This commit is contained in:
Joshua Goins 2025-01-12 18:58:13 -05:00
parent fdaf74521c
commit ac19294ff3
3 changed files with 23 additions and 19 deletions

View file

@ -1,8 +1,4 @@
@media screen and (min-width: 900px) { @media screen and (min-width: 900px) {
#wrapper {
display: flex;
}
#center-wrapper { #center-wrapper {
width: 900px; width: 900px;
margin: auto; margin: auto;
@ -13,8 +9,8 @@
html { html {
font-family: sans-serif; font-family: sans-serif;
--content-color: white; --content-color: white;
--link-color: rgb(199, 26, 26); --link-color: rgb(187, 161, 81);
--link-color-visited: rgb(128, 0, 0); --link-color-visited: rgb(140, 121, 60);
--content-border: 1px solid; --content-border: 1px solid;
--border-color: white; --border-color: white;
overflow-y: scroll; overflow-y: scroll;
@ -22,10 +18,19 @@ html {
background-color: #495259; background-color: #495259;
} }
a {
color: var(--link-color);
}
a:visited {
color: var(--link-color-visited);
}
hr { hr {
height: 0px; height: 0px;
border: none; border: none;
border-top: 1px solid black; border-top: 1px solid black;
border-color: #9b8762;
} }
body { body {
@ -53,13 +58,12 @@ td {
padding: 4px padding: 4px
} }
main { .fancy-container {
background-color: #313031; background-color: #313031;
border: 2px solid #9b8762; border: 2px solid #9b8762;
border-radius: 10px; border-radius: 10px;
margin: 2px; margin: 2px;
padding: 10px; padding: 10px;
width: 100%;
box-shadow: 0px 3px 5px 2px #00000054; box-shadow: 0px 3px 5px 2px #00000054;
color: lightgray; color: lightgray;
} }
@ -98,6 +102,8 @@ main > h2 {
footer { footer {
font-size: .9rem; font-size: .9rem;
margin-top: 10px !important;
margin-bottom: 10px !important;
} }
.blurb { .blurb {
@ -111,8 +117,12 @@ footer {
padding: 1em; padding: 1em;
border-radius: 7px; border-radius: 7px;
margin: 0.5em; margin: 0.5em;
text-decoration: none;
color: lightgray !important; color: lightgray !important;
text-decoration: none;
}
.blurb-button h4 {
text-decoration: underline;
} }
.blurb-button:hover { .blurb-button:hover {

View file

@ -1,19 +1,13 @@
{{ partial "head.html" . }} {{ partial "head.html" . }}
<div id="center-wrapper"> <div id="center-wrapper">
{{ partial "header.html" . }} {{ partial "header.html" . }}
<div id="wrapper"> <main class="fancy-container">
<main>
{{- block "main" . }}{{- end }} {{- block "main" . }}{{- end }}
</main> </main>
</div>
{{ partial "footer.html" . }} {{ partial "footer.html" . }}
</div> </div>
</html> </html>

View file

@ -1,3 +1,3 @@
<footer> <footer class="fancy-container">
<a href="/copyright">Copyright Notice</a> <a href="/copyright">Copyright Notice</a>
</footer> </footer>