style improvements
This commit is contained in:
@@ -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
@@ -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;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user