fix: layout on small screens
This commit is contained in:
parent
1e87f2be84
commit
571237f535
@ -51,15 +51,13 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
<a href="https://gitea.dmz.rs/Decentrala/website"><img src="/img/git-light.svg"
|
||||
alt="SourceCode"></a>
|
||||
<a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
|
||||
</span>
|
||||
</span>
|
||||
</footer>
|
||||
</body>
|
||||
|
@ -40,7 +40,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -33,7 +33,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -38,7 +38,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -81,7 +81,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -33,7 +33,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -89,7 +89,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -34,7 +34,7 @@
|
||||
<a href="/pages/services.html">Servisi</a>
|
||||
<a href="/pages/contact.html">Kontakt</a>
|
||||
</span>
|
||||
<span class="copyleft">
|
||||
<span class="links">
|
||||
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
|
||||
alt="CreativeCommons"></a>
|
||||
<a href="/pages/webring.html"><img src="/img/w-light.svg" alt="Webring"></a>
|
||||
|
@ -33,9 +33,9 @@ body {
|
||||
body {
|
||||
display: grid;
|
||||
grid-template:
|
||||
"header" 10vh
|
||||
"header" 4rem
|
||||
"main" 1fr
|
||||
"footer" 10vh
|
||||
"footer" 4rem
|
||||
/ 1fr;
|
||||
gap: 0;
|
||||
font-family: 'Iosevka';
|
||||
@ -121,6 +121,11 @@ a:focus {
|
||||
|
||||
.links {
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.links > a:hover{
|
||||
background-color: var(--bg);
|
||||
}
|
||||
|
||||
#sections-button {
|
||||
@ -135,29 +140,21 @@ a:focus {
|
||||
border: 2px solid var(--border);
|
||||
background-color: var(--bg);
|
||||
position: absolute;
|
||||
bottom: calc(10vh - 2px);
|
||||
bottom: calc(4rem - 2px);
|
||||
left: calc(0px - 2px);
|
||||
align-items: center;
|
||||
padding: 2rem 3rem;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.copyleft a,
|
||||
.sections, #sections-menu {
|
||||
font-variant: small-caps;
|
||||
}
|
||||
|
||||
.sections a {
|
||||
margin: 0 1rem 0 0;
|
||||
}
|
||||
|
||||
.copyleft a:hover,
|
||||
.copyleft a:focus {
|
||||
background-color: var(--bg);
|
||||
}
|
||||
|
||||
.copyleft {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
button {
|
||||
font-style: italic;
|
||||
font-weight: lighter;
|
||||
@ -195,7 +192,11 @@ screen and (max-width: 1500px) {
|
||||
}
|
||||
|
||||
.links {
|
||||
display: none;
|
||||
gap: 1.2rem;
|
||||
}
|
||||
|
||||
.links a {
|
||||
width: 1.5rem;
|
||||
}
|
||||
|
||||
header,
|
||||
@ -206,4 +207,8 @@ screen and (max-width: 1500px) {
|
||||
#theme-switcher {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
.account {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user