Browse Source

práce na stránce organizátorů

export_seznamu_prednasek
Kateřina Čížková 5 years ago
parent
commit
e84003b6e7
  1. 49
      mamweb/static/css/mamweb.css
  2. 30
      seminar/templates/seminar/cojemam/organizatori.html

49
mamweb/static/css/mamweb.css

@ -144,7 +144,7 @@ h1 {
font-weight: 400; font-weight: 400;
font-variant: small-caps; font-variant: small-caps;
text-align: center; text-align: center;
text-decoration: bold; text-decoration: none;
padding-top: 8px; padding-top: 8px;
text-shadow: none; text-shadow: none;
} }
@ -554,8 +554,7 @@ ul.submenu {
/*todo pro mobily*/ /*todo pro mobily*/
div.seznam_orgu {
}
div.org_pole { div.org_pole {
display: inline-block; display: inline-block;
@ -574,6 +573,50 @@ div.seznam_orgu h3 {
margin-top: 10px; margin-top: 10px;
} }
/*otáčecí karty organizátorů*/
.flip-card {
width: 300px;
height: 200px;
perspective: 1000px; /* Remove this if you don't want the 3D effect */
}
/* This container is needed to position the front and back side */
.flip-card-inner {
position: relative;
width: 100%;
height: 100%;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}
/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
transform: rotateY(180deg);
}
/* Position the front and back side */
.flip-card-front, .flip-card-back {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden; /* Safari */
backface-visibility: hidden;
}
/* Style the front side (fallback if image is missing) */
.flip-card-front {
background-color: #bbb;
}
/* Style the back side */
.flip-card-back {
background-color: #e84e10;
color: #fffbf6;
transform: rotateY(180deg);
}
/* galerie */ /* galerie */

30
seminar/templates/seminar/cojemam/organizatori.html

@ -36,6 +36,13 @@
{{org.osoba.prijmeni}} {{org.osoba.prijmeni}}
</h3> </h3>
{# karta organizátora - zepředu fotka, zezadu popis, u neaktivních data kdy organizovali #}
<div class="flip-card">
<div class="flip-card-inner">
<div class="flip-card-front">
<div class="foto_org"> <div class="foto_org">
{% if org.osoba.foto %} {% if org.osoba.foto %}
<a href="{{org.osoba.foto.url}}"><img src="{{org.osoba.foto_male.url}}" height="{{org.osoba.foto_male.height}}" alt="{{org.osoba.jmeno}} {{org.osoba.prijmeni}}"></a> <a href="{{org.osoba.foto.url}}"><img src="{{org.osoba.foto_male.url}}" height="{{org.osoba.foto_male.height}}" alt="{{org.osoba.jmeno}} {{org.osoba.prijmeni}}"></a>
@ -44,34 +51,38 @@
{% endif %} {% endif %}
</div> </div>
</div>
<div class="flip-card-back">
<ul> <ul>
{% if aktivni %} {% if aktivni %}
{% if org.organizuje_od %} {% if org.organizuje_od %}
<li> <li>
Organizuje od roku {{org.organizuje_od.year}} {{org.strucny_popis_organizatora}}
{% endif %} {% endif %}
{% else %} {% else %}
<li> <li>
Aktivní v letech {{org.organizuje_od | default:"?" }}&ndash;{{org.organizuje_do | default:"?" }} Aktivní v letech {{org.organizuje_od.year | default:"?" }}&ndash;{{org.organizuje_do.year | default:"?" }}
{% endif %} {% endif %}
{% if org.skola %}
<li>{{org.studuje}} na {{org.skola}}
{% endif %}
{% if org.osoba.email %} {% if org.osoba.email %}
<li>Kontakt: <li>
{# zobrazeni e-mailu (na jednom radku, aby nevznikaly mezery navic) #} {# zobrazeni e-mailu (na jednom radku, aby nevznikaly mezery navic) #}
{% for znak in org.osoba.email %}{% if znak == '@' %} &#60;at&#62; {% elif znak == '.' %} &#60;dot&#62; {% else %}{{znak}}{% endif %}{% endfor %} {#{% for znak in org.osoba.email %}{% if znak == '@' %} &#60;at&#62; {% elif znak == '.' %} &#60;dot&#62; {% else %}{{znak}}{% endif %}{% endfor %}#}
{{org.osoba.email}}
{% endif %} {% endif %}
</ul> </ul>
{# {{org.strucny_popis_organizatora}} #} </div>
</div>
</div>
{# konec karty organizátora #}
<hr> <hr>
</div> </div>
{% endfor %} {% endfor %}
@ -84,4 +95,3 @@
{% endif %} {% endif %}
{% endblock content %} {% endblock content %}

Loading…
Cancel
Save