Browse Source

Vize, jak by měly vypadat CSSka konkrétních stránek (a možná CSSka obecně)

pull/44/head
Jonas Havelka 7 months ago
parent
commit
ed703b10a1
  1. 157
      mamweb/static/css/layout.css
  2. 14
      seminar/templates/seminar/titulnistrana/titulnistrana.html
  3. 10
      seminar/templates/seminar/zadani/AktualniZadani.html

157
mamweb/static/css/layout.css

@ -460,44 +460,81 @@ body.suprodweb { &:before, &:after { background: red; } }
/**** ZBYTEK ****/ /**** ZBYTEK ****/
/* (konkrétní stránky) */ /* (konkrétní stránky) */
/* titulni stranka */ /* Titulní stránka */
.titulnistrana { .titulnistrana {
display: flex; display: flex;
text-align: justify; text-align: justify;
@media(max-width: 800px){
display: block;
}
h1 { text-align: center; } h1 { text-align: center; }
}
.zjistit_vic{ .TS_zjistit_vic{
text-align: center; text-align: center;
margin-bottom: 30px; margin-bottom: 30px;
hr { display: none; } hr {
} display: none;
.graf-svg { @media(max-width: 800px){
display: flex; display: flex;
} }
}
}
#svg-graf { .TS_graf {
@media(max-width: 800px) {
padding-top: 40px;
}
.TS_graf-svg {
display: flex;
#svg-graf {
width: 100%; width: 100%;
height: auto; height: auto;
margin: 30px; margin: 30px;
}
.titulnistrana_obsah { @media(max-width: 800px){
max-width: 500px;
padding: 10px;
margin: auto;
}
}
}
}
.TS_obsah {
width: 66%; width: 66%;
}
.vitej_titulka, .temata_titulka { @media(max-width: 800px){
width: 100%;
}
}
.TS_vitej_titulka, .TS_temata_titulka {
width: 49%; width: 49%;
padding: 10px; padding: 10px;
display: table-cell; display: table-cell;
}
.titulnistrana_novinky { @media (max-width: 650px) {
width: 100%;
display: block;
}
}
.TS_novinky {
width: 33%; width: 33%;
padding: 10px; padding: 10px;
@media(max-width: 800px){
width: 100%;
max-width: 500px;
margin: auto;
}
}
} }
.novinka { .novinka {
@ -525,96 +562,28 @@ div.odpocet {
text-align: center; text-align: center;
} }
@media(max-width: 800px){ /* Stránky Aktuální ročník */
/* titulni stranka */
.titulnistrana {
display: block;
}
.graf {
padding-top: 40px;
}
.titulnistrana_obsah {
width: 100%;
}
.vitej_titulka, .temata_titulka {
width: 49%;
padding: 10px;
display: table-cell;
}
.titulnistrana_novinky {
width: 100%;
max-width: 500px;
padding: 10px;
margin: auto;
}
#svg-graf {
width: 100%;
max-width: 500px;
padding: 10px;
margin: auto;
}
.zjistit_vic hr {
display: flex;
}
}
@media (max-width: 650px) {
.titulnistrana {
display: block;
}
.graf {
padding-top: 40px;
}
.titulnistrana_obsah {
width: 100%;
}
.vitej_titulka, .temata_titulka {
width: 100%;
padding: 10px;
display: block;
}
.titulnistrana_novinky {
width: 100%;
padding: 10px;
}
}
/* aktuální zadání */
.stranka_aktualni_zadani { .stranka_aktualni_zadani {
text-align: center; text-align: center;
}
#azad_obrazek { #AZAD_obrazek {
margin-top: 15px; margin-top: 15px;
} }
div.zadani_termin { div.AZAD_termin {
text-align: center; text-align: center;
font-size: large; font-size: large;
font-weight: bold; font-weight: bold;
}
@media (max-width: 420px) { @media (max-width: 420px) {
div.zadani_termin {
font-size: small; font-size: small;
} }
}
div.zadani_termin .datum { .AZAD_datum {
color: var(--hlavni-oranzova); color: var(--hlavni-oranzova);
margin: 0; margin: 0;
}
}
} }
#obrazek_cisla_archiv { #obrazek_cisla_archiv {
@ -623,20 +592,16 @@ div.zadani_termin .datum {
} }
/* Jak řešit */ /* Stránka Jak řešit */
.jakresit svg { .jakresit svg {
width: 33%; width: 33%;
padding: 10px; padding: 10px;
filter: none; filter: none;
}
@media(max-width: 860px) { @media(max-width: 860px) {
.jakresit svg {
margin: auto; margin: auto;
display: grid; display: grid;
width: 100%; width: 100%;
max-width: 360px; max-width: 360px;
} }
} }
/****************/

14
seminar/templates/seminar/titulnistrana/titulnistrana.html

@ -36,9 +36,9 @@ function sousdeadline() {
<div class=titulnistrana> <div class=titulnistrana>
<div class="titulnistrana_obsah"> <div class="TS_obsah">
<div class="vitej_titulka"> <div class="TS_vitej_titulka">
<h1> <h1>
{% block nadpis1a %} {% block nadpis1a %}
@ -54,7 +54,7 @@ function sousdeadline() {
</div> </div>
<div class="temata_titulka"> <div class="TS_temata_titulka">
<h1> <h1>
Vyřeš to! Vyřeš to!
@ -76,13 +76,13 @@ function sousdeadline() {
</div> </div>
<div class="graf"> <div class="TS_graf">
<div class="graf-svg"> <div class="TS_graf-svg">
{% include 'seminar/titulnistrana/graph.svg' %} <!-- TODO: aby to nemuselo být v templates --> {% include 'seminar/titulnistrana/graph.svg' %} <!-- TODO: aby to nemuselo být v templates -->
</div> </div>
<span class="zjistit_vic"> <span class="TS_zjistit_vic">
<h2><a href="/o-nas/uvod/">Zjisti víc!</a></h2> <h2><a href="/o-nas/uvod/">Zjisti víc!</a></h2>
<hr> <hr>
</span> </span>
@ -91,7 +91,7 @@ function sousdeadline() {
</div> </div>
<div class="titulnistrana_novinky"> <div class="TS_novinky">
{# Novinky #} {# Novinky #}
<h1>Co je nového?</h1> <h1>Co je nového?</h1>

10
seminar/templates/seminar/zadani/AktualniZadani.html

@ -14,20 +14,20 @@
{% if user.je_org and not verejne %}<div class="mam-org-only">{% endif %} {% if user.je_org and not verejne %}<div class="mam-org-only">{% endif %}
<hr> <hr>
<div class="zadani_termin"> <div class="AZAD_termin">
Termíny pro odeslání řešení {{ac.poradi}}. série:<br> Termíny pro odeslání řešení {{ac.poradi}}. série:<br>
{% for deadline in ac.deadline_v_cisle.all %} {% for deadline in ac.deadline_v_cisle.all %}
{% if deadline.typ == deadline.TYP_SOUS or deadline.typ == deadline.TYP_PRVNI_A_SOUS %} {% if deadline.typ == deadline.TYP_SOUS or deadline.typ == deadline.TYP_PRVNI_A_SOUS %}
<span class="datum">{{deadline.deadline.date}}</span> pro účast na soustředění<br> <span class="AZAD_datum">{{deadline.deadline.date}}</span> pro účast na soustředění<br>
{% endif %} {% endif %}
{% if deadline.typ == deadline.TYP_PRVNI or deadline.typ == deadline.TYP_PRVNI_A_SOUS %} {% if deadline.typ == deadline.TYP_PRVNI or deadline.typ == deadline.TYP_PRVNI_A_SOUS %}
<span class="datum">{{deadline.deadline.date}}</span> pro otištění v dalším čísle<br> <span class="AZAD_datum">{{deadline.deadline.date}}</span> pro otištění v dalším čísle<br>
{% endif %} {% endif %}
{% if deadline.typ == deadline.TYP_CISLA %} {% if deadline.typ == deadline.TYP_CISLA %}
<span class="datum">{{deadline.deadline.date}}</span> definitivní deadline<br> <span class="AZAD_datum">{{deadline.deadline.date}}</span> definitivní deadline<br>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
@ -35,7 +35,7 @@
<hr> <hr>
{% if ac.titulka_nahled and ac.pdf %} {% if ac.titulka_nahled and ac.pdf %}
<a href="{{ac.pdf.url}}"><img id="azad_obrazek" src="{{ac.titulka_nahled.url}}" alt="Titulní strana {{ac.poradi}}. čísla" title="Klikni pro stažení!"></a> <a href="{{ac.pdf.url}}"><img id="AZAD_obrazek" src="{{ac.titulka_nahled.url}}" alt="Titulní strana {{ac.poradi}}. čísla" title="Klikni pro stažení!"></a>
{% endif %} {% endif %}
{% if ac.pdf %} {% if ac.pdf %}

Loading…
Cancel
Save