menu burer croix pour toutes les langues et espace cliquable des boutons plus equilibres

This commit is contained in:
hugogogo
2021-04-23 16:26:40 +02:00
parent a9ddd81b1b
commit 7e20d74faf
11 changed files with 46 additions and 25 deletions

View File

@@ -14,7 +14,9 @@
<body>
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" target="_parent"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./de/kosmopolit.html" target="_parent"><p>KOSMOPOLIT</p></a>

View File

@@ -15,7 +15,8 @@
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./de/kosmopolit.html" ><p>KOSMOPOLIT</p></a>

View File

@@ -15,7 +15,8 @@
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" target="_parent"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./de/kosmopolit.html" target="_parent"><p>KOSMOPOLIT</p></a>

View File

@@ -15,7 +15,8 @@
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" target="_parent"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./de/kosmopolit.html" target="_parent"><p>KOSMOPOLIT</p></a>

View File

@@ -14,7 +14,9 @@
<body>
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>

View File

@@ -15,7 +15,8 @@
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>

View File

@@ -15,7 +15,8 @@
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>

View File

@@ -15,7 +15,8 @@
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>

View File

@@ -14,7 +14,9 @@
<body>
<nav class="navbar sticky">
<label for="burger" class="burger"></label><input type="checkbox" id="burger">
<input type="checkbox" id="burger">
<label for="burger" class="burger"></label>
<div class="nav_left">
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>

View File

@@ -19,29 +19,35 @@
flex-direction: column;
height: auto;
}
.navbar .nav_left a {
display: none;
margin-left: 0px;
.navbar .nav_left {
flex-direction: column;
height: auto;
width: 100%;
}
.navbar .nav_left a p {
margin-left: 20px;
}
.navbar .nav_right {
display: none;
}
.navbar .nav_left a#nav_logo {
display: flex;
margin-bottom: 0px;
margin-left: 0px;
width: auto;
}
.navbar .nav_left {
flex-direction: column;
height: auto;
.navbar .nav_left > a:not(#nav_logo) {
display: none;
margin-left: 0px;
width: 100%;
height: 50px;
}
.navbar .nav_left > a p {
margin-left: 20px;
}
.navbar .nav_right {
margin: 20px 0px 20px 27px;
width: 150px;
height: auto;
width: 100%;
display: none;
margin-left: 28px;
}
.navbar .nav_right > a {
height: 50px;
margin: 0px;
}
/*burger menu*/
nav.navbar input#burger {
@@ -51,7 +57,7 @@
position: absolute;
right: 0px;
top: 0px;
height: 100%;
height: var(--nav-height);
width: 50%;
cursor: pointer;
}
@@ -84,7 +90,6 @@
display: flex;
}
nav.navbar #burger:checked ~ .nav_left a:not(#nav_logo) {
height: 50px;
}
nav.navbar #burger:checked ~ .nav_left a#nav_logo {
display: flex;

View File

@@ -91,3 +91,7 @@ body#body_navbar {
}
/*menu burger responsive*/
nav.navbar input#burger {
display: none;
}