mam/mamweb
13
1
Fork 0
Code Issues Pull requests 12 Projects Wiki Activity Actions

kosmetické úpravy mobilního menu

Browse source
This commit is contained in:
Kateřina Čížková 2020-02-12 00:15:07 +01:00
parent b86696f33c
commit 3edb849345
2 changed files with 74 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

84
mamweb/static/css/mamweb.css
View file

@ -76,8 +76,8 @@ h6 {
.mam-org-only { .mam-org-only {
background: #fff0d7; background: #fff0d7;
padding: 10px; padding: 10px;
margin: 10px -10px; margin: 10px -10px;
border: orange 2px dashed; border: orange 2px dashed;
} }
@ -220,7 +220,7 @@ ul.menu {
width: 100%; width: 100%;
padding: 0px; padding: 0px;
margin-top: -2px; /* posune celé menu nahoru (pak potřeba zvětšit mezeru mezi menu a submenu) */ margin-top: -2px; /* posune celé menu nahoru (pak potřeba zvětšit mezeru mezi menu a submenu) */
font-variant: small-caps; font-variant: small-caps;
} }
@ -233,7 +233,7 @@ ul.menu li {
display: inline-block; display: inline-block;
width: 16.666667%; width: 16.666667%;
text-align: center; text-align: center;
font-size: 140%; font-size: 140%;
font-weight: 400; font-weight: 400;
} }
@ -247,10 +247,10 @@ ul.menu li>a:active {
} }
ul.submenu { ul.submenu {
background-color: #e84e10; background-color: #e84e10;
margin-top: 10px; /* mezera mezi hlavním menu a submenu */ margin-top: 10px; /* mezera mezi hlavním menu a submenu */
margin-bottom: 10px; margin-bottom: 10px;
padding-top: 10px; padding-top: 10px;
padding-bottom: 5px; padding-bottom: 5px;
filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.4)); filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.4));
@ -291,7 +291,7 @@ div.zadani_azad_termin {
} }
/********** /**********
* Footer * Footer
**********/ **********/
/* nefunguje pro mobily */ /* nefunguje pro mobily */
@ -318,7 +318,7 @@ p.license-mobile {
/********************** /**********************
* Zmenšování displeje * Zmenšování displeje
***********************/ ***********************/
@ -345,7 +345,7 @@ p.license-mobile {
#footer { #footer {
width: 100%; width: 100%;
} }
div.novinky{ div.novinky{
max-width: 100%; max-width: 100%;
margin-left: auto; margin-left: auto;
@ -396,7 +396,7 @@ ul.submenu {
background-image: none; background-image: none;
} }
#header.cojemam, #header.cojemam,
#header.soustredeni, #header.soustredeni,
#header.zadani, #header.zadani,
#header.clanky, #header.clanky,
@ -412,7 +412,7 @@ ul.submenu {
#header img.logo { #header img.logo {
display: none; display: none;
} }
#header img.logo-mobile { #header img.logo-mobile {
display: block; display: block;
@ -420,23 +420,74 @@ ul.submenu {
left: 0px; left: 0px;
width: 100%; width: 100%;
filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.4)); filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.4));
margin-bottom: 3px;
} }
/* mobilní menu */
ul.menu { ul.menu {
display: none; display: none;
} }
ul.menu_mobile { ul.menu_mobile {
display: block; display: block;
z-index: 10;
position: sticky;
font-variant: small-caps;
font-size: 150%;
list-style-type: none;
padding-top: 3px;
padding-bottom: 3px;
}
ul.menu_mobile a:active,
ul.menu_mobile a:hover,
ul.menu_mobile a:focus {
text-decoration: none;
color: black;
}
ul.menu_mobile ul {
list-style-type: square;
font-size: 90%;
color: black;
}
ul.menu_mobile ul li>a {
color: black;
} }
ul.menu_mobile br { ul.menu_mobile br {
display: none; display: none;
} }
nav.nav-button { nav.nav-button {
display: block; display: block;
position: sticky; position: sticky;
position: -webkit-sticky;
top: 0;
z-index: 10;
}
#navbar-content {
background-color: #e84e10;
}
button.navbar-button {
color: #6f2509;
background-color: #e84e10;
font-variant: small-caps;
font-size: 160%;
border-radius: 0px;
border-width: 0px;
width: 100%;
}
li.dropdown div.submenu_mobile{
display: none;
}
li.dropdown.open div.submenu_mobile{
display: block;
} }
p.license-mobile { p.license-mobile {
@ -448,7 +499,6 @@ ul.submenu {
text-align: justify; text-align: justify;
} }
div.novinky { div.novinky {
max-width: 100%; max-width: 100%;
float: none; float: none;
@ -459,7 +509,7 @@ ul.submenu {
width: 70%; width: 70%;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
} }
@ -472,7 +522,7 @@ div.seznam_orgu {
div.org_pole { div.org_pole {
display: inline-block; display: inline-block;
width: 49%; width: 30%;
min-width: 300px; min-width: 300px;
text-align: center; text-align: center;
} }
@ -662,8 +712,8 @@ div.seznam_orgu h3 {
/* plus a minus tlacitka */ /* plus a minus tlacitka */
.mam-org-only-galerie { .mam-org-only-galerie {
background: #fff0d7; background: #fff0d7;
padding: 10px; padding: 10px;
margin: 10px 10px 10px -20px; margin: 10px 10px 10px -20px;
border: orange 2px dashed; border: orange 2px dashed;
float: left; float: left;
} }

15
mamweb/templates/base.html
View file

@ -37,7 +37,7 @@
</head> </head>
<body class='{% if user.is_staff %}org-logged-in{% endif %}'> <body class='{% if user.is_staff %}org-logged-in{% endif %}'>
<div class="container"> <div class="container">
{% if user.is_staff %} {% if user.is_staff %}
<div class="login-bar" > <div class="login-bar" >
@ -52,7 +52,7 @@
</div> </div>
{% endif %} {% endif %}
<div class='row'> <div class='row'>
<div class='col-md-12'> <div class='col-md-12'>
<a href='/'> <a href='/'>
@ -67,15 +67,15 @@
<div class='row'> <div class='row'>
<div class='col-md-12'> <div class='col-md-12'>
{# ========= MENU ========== #} {# ========= MENU ========== #}
{% sitetree_menu from "main_menu" include "trunk" template "menu.html" %} {% sitetree_menu from "main_menu" include "trunk" template "menu.html" %}
{# ========= MENU MOBILE ========== #} {# ========= MENU MOBILE ========== #}
<!--Navbar--> <!--Navbar-->
<nav class="nav-button"> <nav class="nav-button">
<!-- Collapse button --> <!-- Collapse button -->
<button class="navbar-button" type="button" data-toggle="collapse" data-target="#navbar-content" <button class="navbar-button" type="button" data-toggle="collapse" data-target="#navbar-content"
aria-controls="navbar-content" aria-expanded="false">Menu</button> aria-controls="navbar-content" aria-expanded="false">Menu</button>
@ -92,9 +92,9 @@
</nav> </nav>
<!--/.Navbar--> <!--/.Navbar-->
{# ========= MENU END ========== #} {# ========= END MENU ========== #}
<div class='row content'> <div class='row content'>
<div class='col-md-12'> <div class='col-md-12'>
@ -127,4 +127,3 @@
{% render_block "js" %} {% render_block "js" %}
</body> </body>
</html> </html>