Nástřel mobilní verze.
This commit is contained in:
Honza "Stínovlas" Musílek
parent
59d15d148e
commit
3e2e865b48
4 changed files with 116 additions and 16 deletions
|
|
@ -71,8 +71,8 @@ h2 {
|
|||
|
||||
#header img.logo {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 45px;
|
||||
top: 40px;
|
||||
left: 55px;
|
||||
}
|
||||
#header h1 {
|
||||
font-size: 130%;
|
||||
|
|
@ -90,18 +90,24 @@ h2 {
|
|||
|
||||
/* Menu */
|
||||
|
||||
#menu {
|
||||
div.menu.mobile {
|
||||
display: none;
|
||||
}
|
||||
div.menu.desktop {
|
||||
display: block;
|
||||
}
|
||||
div.menu {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
z-index: 10;
|
||||
background: url("../images/menu-bg.png") no-repeat left top;
|
||||
height: 60px;
|
||||
}
|
||||
#menu ul {
|
||||
div.menu ul {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
#menu li {
|
||||
div.menu li {
|
||||
display: inline-block;
|
||||
border-radius: 0px;
|
||||
|
||||
|
|
@ -116,19 +122,19 @@ h2 {
|
|||
border-bottom-left-radius: 8px;
|
||||
border-bottom-right-radius: 8px;
|
||||
}
|
||||
#menu a {
|
||||
div.menu a {
|
||||
display: block;
|
||||
padding: 8px 10px;
|
||||
color: #006400;
|
||||
height: 48px;
|
||||
}
|
||||
#menu a:hover {
|
||||
div.menu a:hover {
|
||||
background: url("../images/menu-bg-selected.png") no-repeat left -7px;
|
||||
background-size: 100% 68px;
|
||||
text-decoration: none;
|
||||
color: #003c00;
|
||||
}
|
||||
#menu li.selected a {
|
||||
div.menu li.selected a {
|
||||
background: url("../images/menu-bg-selected.png") no-repeat left -7px;
|
||||
background-size: 100% 68px;
|
||||
text-decoration: none;
|
||||
|
|
@ -234,11 +240,11 @@ div.zadani_azad_termin {
|
|||
background-size: 100% 100%;
|
||||
}
|
||||
#header img.logo {
|
||||
top: 15px;
|
||||
left: 25px;
|
||||
height: 170px;
|
||||
top: 27px;
|
||||
left: 35px;
|
||||
height: 140px;
|
||||
}
|
||||
#menu li {
|
||||
div.menu li {
|
||||
min-width: 120px;
|
||||
font-size: 130%;
|
||||
}
|
||||
|
|
@ -274,3 +280,81 @@ div.zadani_azad_termin {
|
|||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
#header {
|
||||
width: 100%;
|
||||
height: 196px;
|
||||
height: 0px;
|
||||
background-size: 100%;
|
||||
padding-bottom: 25%;
|
||||
}
|
||||
#header img.logo {
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
height: 100%;
|
||||
}
|
||||
div.menu {
|
||||
height: auto;
|
||||
}
|
||||
div.menu li {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
font-size: 130%;
|
||||
}
|
||||
#submenu {
|
||||
background: none;
|
||||
height: auto;
|
||||
margin-left: 90px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
#submenu ul {
|
||||
font-size: 110%;
|
||||
}
|
||||
#submenu li {
|
||||
display: inline-block;
|
||||
margin: 5px 8px;
|
||||
border-radius: 30px;
|
||||
background: #ffd546;
|
||||
height: auto;
|
||||
}
|
||||
#submenu li a:hover, #submenu li.selected {
|
||||
background: #ffd546;
|
||||
}
|
||||
div.menu.mobile {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
background: none;
|
||||
}
|
||||
div.menu.mobile > div.dropdown > button {
|
||||
font-size: 20px;
|
||||
}
|
||||
div.menu.mobile > div.dropdown > ul {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
div.menu.mobile > div.dropdown > ul > li {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
background: none;
|
||||
font-variant: normal;
|
||||
height: auto;
|
||||
}
|
||||
div.menu.mobile > div.dropdown > ul > li > a {
|
||||
margin: 0px;
|
||||
padding: 5px 30px;
|
||||
height: auto;
|
||||
}
|
||||
div.menu.mobile > div.dropdown > ul > li > a:hover {
|
||||
background: #ffa500;
|
||||
}
|
||||
|
||||
div.menu.desktop {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 35 KiB |
|
|
@ -56,9 +56,24 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class='row'>
|
||||
<div class='col-md-12' style=''>
|
||||
<div id='menu'>
|
||||
<div class='col-md-12'>
|
||||
{# ========= MOBILE MENU ========== #}
|
||||
<div class="menu mobile">
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Menu
|
||||
<span class="glyphicon glyphicon-th-list"></span></button>
|
||||
<ul class="dropdown-menu">
|
||||
<li class=""><a href="/co-je-MaM/uvod/">Co je M&M</a>
|
||||
<li class=""><a href="/soustredeni/">Soustředění</a>
|
||||
<li class=""><a href="/zadani/aktualni/">Zadání</a>
|
||||
<li class=""><a href="/clanky/uvod/">Články</a>
|
||||
<li class=""><a href="/archiv/cisla/">Archiv</a>
|
||||
<li class=""><a href="/co-je-MaM/kontakt/">Kontakt</a>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{# ============= MENU ============== #}
|
||||
<div class="menu desktop">
|
||||
<ul>
|
||||
<li class="{% block menu_uvod %}{% endblock %}"><a href="/co-je-MaM/uvod/">Co je M&M</a>
|
||||
{# ukazka jak pouzit tag url <li class="{% block menu_soustredeni %}{% endblock %}"><a href="{% url 'seminar_seznam_soustredeni' %}">Soustředění</a> #}
|
||||
|
|
@ -68,8 +83,8 @@
|
|||
<li class="{% block menu_archiv %}{% endblock %}"><a href="/archiv/cisla/">Archiv</a>
|
||||
<li class="{% block menu_odevzdat %}{% endblock %}"><a href="/co-je-MaM/kontakt/">Kontakt</a>
|
||||
</ul>
|
||||
{# ======== KONEC MENU =============#}
|
||||
</div>
|
||||
{# ======== KONEC MENU =============#}
|
||||
</div>
|
||||
</div>
|
||||
<div class='row'>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@
|
|||
|
||||
|
||||
{% block content %}
|
||||
|
||||
<br />
|
||||
<br />
|
||||
{# Uvitaci text #}
|
||||
<h2>
|
||||
{% block nadpis1a %}{% block nadpis1b %}
|
||||
|
|
|
|||
Loading…
Reference in a new issue