style improvements

This commit is contained in:
2024-12-05 09:03:16 +00:00
parent 547e111852
commit c8d1229fce
2 changed files with 13 additions and 21 deletions
-3
View File
@@ -34,9 +34,6 @@ fn page() -> Html {
<a class="click" target="_blank" href="https://codeberg.org/futile"> { "git" } </a> <a class="click" target="_blank" href="https://codeberg.org/futile"> { "git" } </a>
<a class="click" target="_blank" href="https://steamcommunity.com/id/elituf"> { "steam" } </a> <a class="click" target="_blank" href="https://steamcommunity.com/id/elituf"> { "steam" } </a>
</div> </div>
<div class="footer" style="margin-top: -40px">
<div><p> { '\u{200B}' } </p></div>
</div>
</div> </div>
</> </>
} }
+13 -18
View File
@@ -1,11 +1,14 @@
$font-path: "static/fonts";
$primary-color: white; $primary-color: white;
$background-color: black; $background-color: black;
$overlay: rgba(255, 255, 255, 0.5);
$font-path: "static/fonts";
@font-face { @font-face {
font-family: 'Bokor'; font-family: 'Bokor';
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-display: swap;
src: local('Bokor'), src: local('Bokor'),
url("#{$font-path}/bokor-latin-400-normal.woff2") format('woff2'); url("#{$font-path}/bokor-latin-400-normal.woff2") format('woff2');
} }
@@ -46,7 +49,7 @@ div.footer {
} }
.main-title { .main-title {
font-family: 'Bokor', serif; font-family: 'Bokor', 'Georgia', serif;
font-size: 5em; font-size: 5em;
line-height: 1em; line-height: 1em;
margin: 0.2em 0 0 0; margin: 0.2em 0 0 0;
@@ -60,8 +63,7 @@ div.footer {
.separator { .separator {
color: $primary-color; color: $primary-color;
margin-top: 0.5em; margin: 0.5em auto 0em;
margin-bottom: 0em;
width: 50px; width: 50px;
} }
@@ -81,14 +83,10 @@ div.footer {
.button { .button {
display: inline-block; display: inline-block;
padding: 3px 6px; padding: 3px 6px;
font-size: 16px;
text-align: center;
color: $primary-color; color: $primary-color;
background-color: $background-color; background-color: $background-color;
border: 1px solid $primary-color; border: 1px solid $primary-color;
cursor: pointer; cursor: pointer;
text-decoration: none;
border-radius: 0;
user-select: none; user-select: none;
&.shiny { &.shiny {
@@ -102,7 +100,7 @@ div.footer {
left: -110%; left: -110%;
width: 110%; width: 110%;
height: 100%; height: 100%;
background: rgba(255, 255, 255, 0.5); background: $overlay;
transform: skewX(-30deg); transform: skewX(-30deg);
animation: shine 5s infinite; animation: shine 5s infinite;
animation-delay: 5s; animation-delay: 5s;
@@ -148,29 +146,26 @@ ul.footer {
} }
.footer-container { .footer-container {
margin-top: 64px; margin: 64px auto auto auto;
@media (min-height: 816px) { @media (min-height: 816px) {
position: absolute; position: absolute;
bottom: 0; inset: auto 0 12px;
left: 0; margin: auto auto auto auto;
right: 0;
margin-top: 0;
} }
} }
ul.footer.buttons { ul.footer.buttons {
margin: 0px;
padding: 0; padding: 0;
} }
div.footer.quote { div.footer.quote {
text-align: center; text-align: center;
word-wrap: break-word; word-wrap: break-word;
margin-top: -8px; margin: -24px auto auto auto;
} }
div.footer.links { div.footer.links {
margin-top: -12px; margin: -12px auto auto auto;
gap: 5px; gap: 6px;
} }