pedf
/
oli
Archived
2
0
Fork 0

Tlačítko 'messenger' má vlastní třídu

master
Emil Miler 4 years ago
parent 98f34a4249
commit ef79cb8479

@ -23,6 +23,13 @@ p { text-align: justify; }
padding: 0 1em; padding: 0 1em;
} }
.messenger {
max-width: 100%;
display: block;
margin-top: 2em;
}
.messenger img { max-width: 12em; }
h1 { color: #d63647; margin-bottom: 0; clear: both; } h1 { color: #d63647; margin-bottom: 0; clear: both; }
h2, h3 { color: #68c7d2; } h2, h3 { color: #68c7d2; }
@ -41,7 +48,7 @@ main {
} }
.row { height: auto; width: 100%; display: flex; justify-content: space-between; align-items: center; flex-direction: row; margin: 5em 0; } .row { height: auto; width: 100%; display: flex; justify-content: space-between; align-items: center; flex-direction: row; margin: 5em 0; }
.row img { max-height: 130%; max-width: 40%; } .row>img { max-height: 130%; max-width: 40%; }
article { article {
background-color: #eee; background-color: #eee;
@ -74,6 +81,8 @@ article: nth-child(1)::before {
@media screen and (max-width: 699px) { @media screen and (max-width: 699px) {
body { background: none; font-size: 1em; } body { background: none; font-size: 1em; }
.messenger { text-align: center; }
header { width: 100%; } header { width: 100%; }
header .logo { padding-top: 30px; width: 100%; float: none; margin: 0 auto; } header .logo { padding-top: 30px; width: 100%; float: none; margin: 0 auto; }
header .row p { max-width: 100%; } header .row p { max-width: 100%; }
@ -82,7 +91,7 @@ article: nth-child(1)::before {
.row { flex-direction: column; margin: 4em 0; } .row { flex-direction: column; margin: 4em 0; }
.row:nth-child(even) { flex-direction: column-reverse; } .row:nth-child(even) { flex-direction: column-reverse; }
.row img { max-height: 80%; max-width: 80%; margin: 1em 0; } .row>img { max-height: 80%; max-width: 80%; margin: 1em 0; }
article { max-width: 100%; align-self: center !important; padding: 1em; } article { max-width: 100%; align-self: center !important; padding: 1em; }
article h2 { margin-top: auto; font-size: 2em; } article h2 { margin-top: auto; font-size: 2em; }

@ -17,7 +17,7 @@
<div class="row"> <div class="row">
<p style="align-self:flex-start;"> <p style="align-self:flex-start;">
Můj člověk se jmenuje Kuba. Touží být učitelem, inspirovat, nadchnout studenty, ale neumí tak docela mluvit s lidmi. Říkáte si, že to nejde moc dohromady? Jo, to máte pravdu, a proto jsem tu já. Ale to bych vám měl asi vysvětlit.<br> Můj člověk se jmenuje Kuba. Touží být učitelem, inspirovat, nadchnout studenty, ale neumí tak docela mluvit s lidmi. Říkáte si, že to nejde moc dohromady? Jo, to máte pravdu, a proto jsem tu já. Ale to bych vám měl asi vysvětlit.<br>
<a href="https://m.me/pedf.cuni"><img src="img/messenger.png" alt="messenger" style="margin-top:2em;"></a> <a href="https://m.me/pedf.cuni" class="messenger"><img src="img/messenger.png" alt="messenger"></a>
</p> </p>
<img src="img/fitemebro.png" alt="oli"> <img src="img/fitemebro.png" alt="oli">
</div> </div>
@ -99,7 +99,7 @@
<article> <article>
<h2>A teď jsem tu pro tebe!</h2> <h2>A teď jsem tu pro tebe!</h2>
<p>Na promoci už šli ruku v ruce a já jsem si byl najednou jistý něčím, co jsem už dlouho tušil. Kuba to zvládl, splnil si svůj sen a jde učit. Mě už nepotřebuje. Díky našemu studiu jsem se ale naučil hromadu věcí o peďáku, které si nechci nechat pro sebe a budu je rád dál předávat. Být tu pro všechny bezradné studenty mi totiž dělá radost. Tak jsem zůstal na fakultě, plný informací a natěšený odpovídat. Stačí se jen zeptat.</p> <p>Na promoci už šli ruku v ruce a já jsem si byl najednou jistý něčím, co jsem už dlouho tušil. Kuba to zvládl, splnil si svůj sen a jde učit. Mě už nepotřebuje. Díky našemu studiu jsem se ale naučil hromadu věcí o peďáku, které si nechci nechat pro sebe a budu je rád dál předávat. Být tu pro všechny bezradné studenty mi totiž dělá radost. Tak jsem zůstal na fakultě, plný informací a natěšený odpovídat. Stačí se jen zeptat.</p>
<a href="https://m.me/pedf.cuni"><img src="img/messenger.png" alt="messenger" style="margin-top:1em;"></a> <a href="https://m.me/pedf.cuni" class="messenger"><img src="img/messenger.png" alt="messenger"></a>
</article> </article>
</div> </div>