add: horizontal scroll on mobile

This commit is contained in:
sadorowo 2023-11-24 08:29:25 +00:00
parent 0c9f52cb03
commit 9ab1a74bc1
2 changed files with 25 additions and 4 deletions

View File

@ -14,7 +14,6 @@
<p>Wiedźmy to w dawnych wierzeniach istoty półdemoniczne - istoty pośrednie między demonami a ludźmi, pozostające w ścisłym związku z ludźmi lub ich duszami. Oprócz relacji z diabłami i potworami, które dawały wiedźmą magiczne zdolności - potrafiły one rzucać uroki, zaklęcia, przepowiadać przyszłość, a nawet rozmawiać ze zmarłymi. Potocznie mówimy tak na kobiety niemiłe i/lub brzydkie. Według dawnych wierzeń ludowych wiedźma to kobieta podlegająca wpływom diabła, mająca moc rzucania uroków.</p>
<h2>Dzień wiedźmy obchodzimy 16 listopada. <span id="difference"></span></h2>
</div>
<img src="wiedzma.png" alt="Wiedźma" id="witch">
<div class="info-block">
<h1>Ciekawostki o wiedźmach</h1>
<ol>
@ -30,6 +29,7 @@
<li>Ostatnią spaloną na stosie „czarownicą” w Europie była Barbara Zdunk.</li>
</ol>
</div>
<img src="wiedzma.png" alt="Wiedźma" id="witch">
</div>
<footer>Nie próbuj klikać prawego przycisku myszy! 😈</footer>
</body>

View File

@ -48,14 +48,14 @@ body h1:first-child {
flex-direction: row;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.info-block {
background-color: var(--info-block-bg);
border-radius: var(--info-block-border);
border-bottom-right-radius: 0;
border-top-right-radius: 0;
max-height: 40vw;
height: 50%;
overflow: auto;
padding: 20px;
margin: 10px;
@ -108,3 +108,24 @@ footer {
::-webkit-scrollbar-corner {
background: transparent;
}
@media screen and (max-width: 978px) {
#container {
flex-direction: column;
overflow-y: hidden;
flex-wrap: wrap;
}
.info-block {
max-height: 50%;
}
footer {
display: none;
}
body {
overflow-y: hidden;
overflow-x: auto;
}
}