Made a neater adaptive delimeter for services section. Now on narrow screens delimeter will become horizontal.

This commit is contained in:
Alexander Andreev 2021-11-16 01:49:11 +04:00
parent da970a3cd6
commit 3fe0783f9e
Signed by: Arav
GPG Key ID: 610DF2574456329F
2 changed files with 11 additions and 8 deletions

View File

@ -4,18 +4,21 @@ header { position: relative; }
#logo { width: 100%; }
nav a:last-child {
margin-left: .6rem; }
nav a:last-child { margin-left: .6rem; }
nav,
#services {
text-align: center;
width: 100%; }
#services { text-align: center; width: 100%; }
#services a,
#services span { margin: .3rem; }
#services span a { margin: 0; }
#services span.delimeter { margin: 0; width: 0; }
#services span.delimeter::after { content: '⋮'; }
@media screen and (max-width: 640px) {
#services { display: flex; flex-direction: column; } }
#services { display: flex; flex-direction: column; }
#services span.delimeter { margin: 0 auto;}
#services span.delimeter::after { content: '⋯'; } }

View File

@ -19,7 +19,7 @@ block content
| .
a(href='http://arav.i2p') i2p
sup #[a(href="http://arav.i2p/?i2paddresshelper=5Kl-DiWbbk6wf7m0v6zBSNHYq3sXlnrWLIWVeGdpPbPyc9CBS~zrzDYpP43rv1fRiIkbVCD5hTEpY6joQGlk-dFkWWD6201qa6ecsDVQMaE3Q7UTYICd0VEBRoqDUSrvsM-P2y5oG4Z-77RmoGKpbcRgNuMVbQ7AGJNqVSGej-lSyscDWTIZT5dCT505lfRwprdD~emZqkwnn22X16Wpj-X4A4ifph4idrThGioz4UW6PrCpa-oebMCo217s0Zyl9VKaU-o9cx5eFUEwnshoUjqwh7VE-S45NDz854J08xldCATM3wwTRVXhc2NUypsJLKFKiV0z3EXN-ApCdxsV60C-eiXUTX5vYcHHH~imA79v8WKFybjnsyUBst5BBEPQIUifTceLUrTmQ9TUpaMV90EsD5SCshmCfOs8R5y2dK6EfQu8iyYAB5VFSH4M1CLiBZUsDTEFiOomn2JGMDnbPho8lMB8ss4SMuwZShb2LlGqLxJ38kRHlvC68VmJO7InBQAEAAcAAA==" title="address helper") ah]
||
span.delimeter
span
a(href='https://radio.arav.top') radio.arav.top
| .
@ -41,7 +41,7 @@ block content
| .
a(href='http://git.arav.i2p') i2p
sup #[a(href="http://git.arav.i2p/?i2paddresshelper=eFIfcBUv3lHFSnglHfncs5XXtYwm9gCpmAYuio~9CeENBAXKRggPiY1tQC-otCon2hCSpr56WlVBeZk1txKuUnbjHTN7GBFaKW5wJEO2WmKEWPKdcjUDOYZN0D3TwXaYfiBuELD3200lBfDmPEJ01iC2o7B5yvpOqtEKDcaqkIp4vafDuPPumJ~XiCGdUAe~vr52w3Tbuz5x7wbltk-gUELY0-ZAQBos4jOJ6QT1W1lhycHPhAK8qslgwfk94opyIl2pkRyuJhU-2VHc6Fsd621VXC86YAMT1SIfTZlFpoGVCFXDM~BXaLvygFaKf62qardAe0T48Ax6GxosAKXe-yLCVRaiD3KErULfwZXl23kQzRfxM4odG4DWeXawtuvypOmTjHT1skQHU0h52ujye5nT~2bOy14HkCoCnxJ7gSj3MjkmWLd1JhBsPH4ymRmI7jFJR1GYl8Wp5IigMBBzWfJUEEjS7QDHaRo5TCZJ9SXz6sgkGdfh74~r8FWL559gBQAEAAcAAA==" title="address helper") ah]
||
span.delimeter
a(href='https://arav.neocities.org') arav.neocities.org
section
p Welcome, Anon. I'm Arav, I self-host some services for myself, friends and you. Not much I have to offer, but maybe you'll find something useful for yourself. :)