menu burer croix pour toutes les langues et espace cliquable des boutons plus equilibres
This commit is contained in:
@@ -14,7 +14,9 @@
|
|||||||
<body>
|
<body>
|
||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<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 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>
|
<a href="./de/kosmopolit.html" target="_parent"><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<div class="nav_left">
|
||||||
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
|
<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>
|
<a href="./de/kosmopolit.html" ><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<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 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>
|
<a href="./de/kosmopolit.html" target="_parent"><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<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 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>
|
<a href="./de/kosmopolit.html" target="_parent"><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -14,7 +14,9 @@
|
|||||||
<body>
|
<body>
|
||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<div class="nav_left">
|
||||||
<a id="nav_logo" href="index.html"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
|
<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>
|
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<div class="nav_left">
|
||||||
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
|
<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>
|
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<div class="nav_left">
|
||||||
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
|
<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>
|
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@
|
|||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<div class="nav_left">
|
||||||
<a id="nav_logo" href="index.html"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
|
<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>
|
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -14,7 +14,9 @@
|
|||||||
<body>
|
<body>
|
||||||
|
|
||||||
<nav class="navbar sticky">
|
<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">
|
<div class="nav_left">
|
||||||
<a id="nav_logo" href="index.html" ><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
|
<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>
|
<a href="./en/kosmopolit.html" ><p>KOSMOPOLIT</p></a>
|
||||||
|
|||||||
@@ -19,29 +19,35 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
.navbar .nav_left a {
|
.navbar .nav_left {
|
||||||
display: none;
|
flex-direction: column;
|
||||||
margin-left: 0px;
|
height: auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
.navbar .nav_left a p {
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
.navbar .nav_right {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.navbar .nav_left a#nav_logo {
|
.navbar .nav_left a#nav_logo {
|
||||||
display: flex;
|
display: flex;
|
||||||
margin-bottom: 0px;
|
margin-bottom: 0px;
|
||||||
|
margin-left: 0px;
|
||||||
width: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
.navbar .nav_left {
|
.navbar .nav_left > a:not(#nav_logo) {
|
||||||
flex-direction: column;
|
display: none;
|
||||||
height: auto;
|
margin-left: 0px;
|
||||||
|
width: 100%;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
.navbar .nav_left > a p {
|
||||||
|
margin-left: 20px;
|
||||||
}
|
}
|
||||||
.navbar .nav_right {
|
.navbar .nav_right {
|
||||||
margin: 20px 0px 20px 27px;
|
height: auto;
|
||||||
width: 150px;
|
width: 100%;
|
||||||
|
display: none;
|
||||||
|
margin-left: 28px;
|
||||||
|
}
|
||||||
|
.navbar .nav_right > a {
|
||||||
|
height: 50px;
|
||||||
|
margin: 0px;
|
||||||
}
|
}
|
||||||
/*burger menu*/
|
/*burger menu*/
|
||||||
nav.navbar input#burger {
|
nav.navbar input#burger {
|
||||||
@@ -51,7 +57,7 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
height: 100%;
|
height: var(--nav-height);
|
||||||
width: 50%;
|
width: 50%;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
@@ -84,7 +90,6 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
nav.navbar #burger:checked ~ .nav_left a:not(#nav_logo) {
|
nav.navbar #burger:checked ~ .nav_left a:not(#nav_logo) {
|
||||||
height: 50px;
|
|
||||||
}
|
}
|
||||||
nav.navbar #burger:checked ~ .nav_left a#nav_logo {
|
nav.navbar #burger:checked ~ .nav_left a#nav_logo {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -91,3 +91,7 @@ body#body_navbar {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/*menu burger responsive*/
|
||||||
|
nav.navbar input#burger {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user