Velká revize stylů (a některých JS) #44
6 changed files with 81 additions and 78 deletions
|
@ -602,42 +602,6 @@ div.odpocet {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/*stránka organizátorů*/
|
|
||||||
|
|
||||||
div.seznam_orgu, div.rozcestnik_temat, div.seznam_archiv {
|
|
||||||
text-align: center;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.org_pole, div.rocnik_pole, div.tema_pole {
|
|
||||||
display: inline-block;
|
|
||||||
width: 30%;
|
|
||||||
min-width: 300px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.tema_pole {
|
|
||||||
display: inline-block;
|
|
||||||
width: 40%;
|
|
||||||
min-width: 350px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.cislo_pole {
|
|
||||||
display: inline-block;
|
|
||||||
width: 15%;
|
|
||||||
min-width: 165px;
|
|
||||||
text-align: center;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.seznam_orgu h3 {
|
|
||||||
text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* aktuální zadání */
|
/* aktuální zadání */
|
||||||
.stranka_aktualni_zadani {
|
.stranka_aktualni_zadani {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
|
@ -51,32 +51,14 @@ li.mam-org-only {
|
||||||
|
|
||||||
/**** OTÁČECÍ KARTY ****/
|
/**** OTÁČECÍ KARTY ****/
|
||||||
/* (orgové, archiv) */
|
/* (orgové, archiv) */
|
||||||
|
|
||||||
|
/** Samotné karty **/
|
||||||
.flip-card {
|
.flip-card {
|
||||||
perspective: 1000px; /* Remove this if you don't want the 3D effect */
|
perspective: 1000px; /* Remove this if you don't want the 3D effect */
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#organizatori.flip-card {
|
|
||||||
width: 200px;
|
|
||||||
height: 250px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#archiv.flip-card {
|
|
||||||
width: 210px;
|
|
||||||
height: 298px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#archiv-rocnik.flip-card {
|
|
||||||
width: 144px;
|
|
||||||
height: 205px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#tema-rozcestnik.flip-card {
|
|
||||||
width: 300px;
|
|
||||||
height: 300px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* This container is needed to position the front and back side */
|
/* This container is needed to position the front and back side */
|
||||||
.flip-card-inner {
|
.flip-card-inner {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -109,21 +91,79 @@ div.flip-card-foto, div.flip-card-foto img {
|
||||||
|
|
||||||
/* Style the back side */
|
/* Style the back side */
|
||||||
.flip-card-back {
|
.flip-card-back {
|
||||||
background-color: var(--svetla-oranzova);
|
|
||||||
color: black;
|
|
||||||
transform: rotateY(180deg);
|
transform: rotateY(180deg);
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#archiv.flip-card-back {
|
|
||||||
background-color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Pokud je na přední straně něco proklikávacího (třeba celá fotka), tak na dotykových zařízeních nemůže proklikávat, aby se dalo otáčet */
|
/* Pokud je na přední straně něco proklikávacího (třeba celá fotka), tak na dotykových zařízeních nemůže proklikávat, aby se dalo otáčet */
|
||||||
@media(hover: none) {
|
@media(hover: none) {
|
||||||
.flip-card-foto a { pointer-events: none; }
|
.flip-card-foto a { pointer-events: none; }
|
||||||
}
|
}
|
||||||
|
/*******************/
|
||||||
|
|
||||||
|
|
||||||
|
.flip-card-back {
|
||||||
|
background-color: var(--svetla-oranzova);
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otaceci_cisla .flip-card-back {
|
||||||
|
background-color: white;
|
||||||
|
color: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Otáčecí karta musí mít kolem sebe nějaké místo a mívá nějaký nadpis */
|
||||||
|
.flip_card_container {
|
||||||
|
display: inline-block;
|
||||||
|
width: 30%;
|
||||||
|
min-width: 300px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/** Jednotlivá použití **/
|
||||||
|
.seznam_orgu .flip-card {
|
||||||
|
width: 200px;
|
||||||
|
height: 250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seznam_orgu .flip_card_container h3 {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.seznam_archiv .flip-card {
|
||||||
|
width: 210px;
|
||||||
|
height: 298px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.cisla-v-rocniku .flip-card {
|
||||||
|
width: 144px;
|
||||||
|
height: 205px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cisla-v-rocniku .flip_card_container {
|
||||||
|
width: 15%;
|
||||||
|
min-width: 165px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.rozcestnik_temat .flip-card {
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rozcestnik_temat .flip_card_container {
|
||||||
|
width: 40%;
|
||||||
|
min-width: 350px;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
/************************/
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* karty archiv */
|
/* karty archiv */
|
||||||
|
|
||||||
|
@ -136,7 +176,7 @@ div.popis_rocniku {
|
||||||
|
|
||||||
div.popis_rocniku a, div.cislo_odkazy a {
|
div.popis_rocniku a, div.cislo_odkazy a {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: black;
|
color: unset;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.popis_rocniku a:hover,
|
div.popis_rocniku a:hover,
|
||||||
|
|
|
@ -7,11 +7,11 @@
|
||||||
Archiv čísel
|
Archiv čísel
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</h2>
|
</h2>
|
||||||
<div class="seznam_archiv">
|
<div class="seznam_archiv otaceci_cisla">
|
||||||
|
|
||||||
{% for rocnik, url_png in object_list.items %}
|
{% for rocnik, url_png in object_list.items %}
|
||||||
|
|
||||||
<div class="rocnik_pole">
|
<div class="flip_card_container">
|
||||||
|
|
||||||
<h3>
|
<h3>
|
||||||
<a href='{{ rocnik.verejne_url }}'>Ročník {{ rocnik }}</a>
|
<a href='{{ rocnik.verejne_url }}'>Ročník {{ rocnik }}</a>
|
||||||
|
@ -20,7 +20,7 @@
|
||||||
|
|
||||||
{# karta ročníku - zepředu obrázek prvního čísla, zezadu odkaz na jednotlivá čísla a výsledkovku #}
|
{# karta ročníku - zepředu obrázek prvního čísla, zezadu odkaz na jednotlivá čísla a výsledkovku #}
|
||||||
|
|
||||||
<div class="flip-card" id="archiv">
|
<div class="flip-card">
|
||||||
|
|
||||||
<div class="flip-card-inner">
|
<div class="flip-card-inner">
|
||||||
<div class="flip-card-front">
|
<div class="flip-card-front">
|
||||||
|
@ -30,7 +30,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="flip-card-back" id="archiv">
|
<div class="flip-card-back">
|
||||||
<div class="popis_rocniku">
|
<div class="popis_rocniku">
|
||||||
Jednotlivá čísla:
|
Jednotlivá čísla:
|
||||||
<ul>
|
<ul>
|
||||||
|
|
|
@ -19,13 +19,13 @@
|
||||||
|
|
||||||
<h2>Čísla</h2>
|
<h2>Čísla</h2>
|
||||||
|
|
||||||
<div class="cisla-v-rocniku">
|
<div class="cisla-v-rocniku otaceci_cisla">
|
||||||
{% for c in rocnik.verejna_cisla %}
|
{% for c in rocnik.verejna_cisla %}
|
||||||
<div class="cislo_pole">
|
<div class="flip_card_container">
|
||||||
|
|
||||||
<h6> Číslo {{ c.kod }}</h6>
|
<h6> Číslo {{ c.kod }}</h6>
|
||||||
|
|
||||||
<div class="flip-card" id="archiv-rocnik">
|
<div class="flip-card">
|
||||||
|
|
||||||
<div class="flip-card-inner">
|
<div class="flip-card-inner">
|
||||||
<div class="flip-card-front">
|
<div class="flip-card-front">
|
||||||
|
@ -65,13 +65,13 @@
|
||||||
|
|
||||||
{% if user.je_org and rocnik.neverejna_cisla %}
|
{% if user.je_org and rocnik.neverejna_cisla %}
|
||||||
<div class="mam-org-only">
|
<div class="mam-org-only">
|
||||||
<div class="cisla-v-rocniku">
|
<div class="cisla-v-rocniku otaceci_cisla">
|
||||||
{% for c in rocnik.neverejna_cisla %}
|
{% for c in rocnik.neverejna_cisla %}
|
||||||
<div class="cislo_pole">
|
<div class="flip_card_container">
|
||||||
|
|
||||||
<h6> Číslo {{ c.kod }}</h6>
|
<h6> Číslo {{ c.kod }}</h6>
|
||||||
|
|
||||||
<div class="flip-card" id="archiv-rocnik">
|
<div class="flip-card">
|
||||||
|
|
||||||
<div class="flip-card-inner">
|
<div class="flip-card-inner">
|
||||||
<div class="flip-card-front">
|
<div class="flip-card-front">
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
|
|
||||||
<div class="seznam_orgu">
|
<div class="seznam_orgu">
|
||||||
{% for org in object_list %}
|
{% for org in object_list %}
|
||||||
<div class="org_pole">
|
<div class="flip_card_container">
|
||||||
|
|
||||||
<h3>
|
<h3>
|
||||||
{{org.osoba.jmeno}}
|
{{org.osoba.jmeno}}
|
||||||
|
@ -37,7 +37,7 @@
|
||||||
|
|
||||||
{# karta organizátora - zepředu fotka, zezadu popis, u neaktivních data kdy organizovali #}
|
{# karta organizátora - zepředu fotka, zezadu popis, u neaktivních data kdy organizovali #}
|
||||||
|
|
||||||
<div class="flip-card" id="organizatori">
|
<div class="flip-card">
|
||||||
|
|
||||||
<div class="flip-card-inner">
|
<div class="flip-card-inner">
|
||||||
<div class="flip-card-front">
|
<div class="flip-card-front">
|
||||||
|
|
|
@ -19,15 +19,14 @@
|
||||||
<div class="rozcestnik_temat">
|
<div class="rozcestnik_temat">
|
||||||
|
|
||||||
{% for tematko in tematka %}
|
{% for tematko in tematka %}
|
||||||
|
|
||||||
{# karta témátka - zepředu ilustrační, zezadu abstrakt #}
|
{# karta témátka - zepředu ilustrační, zezadu abstrakt #}
|
||||||
<div class="tema_pole">
|
<div class="flip_card_container">
|
||||||
|
|
||||||
<h3>
|
<h3>
|
||||||
<a href='{{ tematko.verejne_url }}'>Téma {{ tematko.nazev }}</a>
|
<a href='{{ tematko.verejne_url }}'>Téma {{ tematko.nazev }}</a>
|
||||||
</h3>
|
</h3>
|
||||||
|
|
||||||
<div class="flip-card" id="tema-rozcestnik">
|
<div class="flip-card">
|
||||||
|
|
||||||
<div class="flip-card-inner">
|
<div class="flip-card-inner">
|
||||||
<div class="flip-card-front">
|
<div class="flip-card-front">
|
||||||
|
|
Loading…
Reference in a new issue