Fix the navbar height
This commit is contained in:
parent
2575097323
commit
c76fa98be3
3 changed files with 20 additions and 15 deletions
|
@ -5,6 +5,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||||
|
|
||||||
## [Unreleased]
|
## [Unreleased]
|
||||||
|
### Fixed
|
||||||
|
* Fix the navbar height
|
||||||
|
|
||||||
## [1.1.0] - 2020-04-28
|
## [1.1.0] - 2020-04-28
|
||||||
### Added
|
### Added
|
||||||
|
|
|
@ -168,28 +168,27 @@ body {
|
||||||
#navigation .menu-button {
|
#navigation .menu-button {
|
||||||
float: right;
|
float: right;
|
||||||
position:relative;
|
position:relative;
|
||||||
display: none;
|
|
||||||
width: 4em;
|
width: 4em;
|
||||||
height: 4em;
|
height: 4em;
|
||||||
|
cursor: pointer;
|
||||||
|
max-height: var(--navbar-height);
|
||||||
}
|
}
|
||||||
#navigation .menu-button-inner {
|
#navigation .menu-button-inner {
|
||||||
width: 3em;
|
width: 100%;
|
||||||
height: 3em;
|
height: 100%;
|
||||||
position:relative;
|
position:relative;
|
||||||
top: 0.5em;
|
|
||||||
left: 0.5em;
|
|
||||||
text-align:center
|
text-align:center
|
||||||
}
|
}
|
||||||
#navigation .menu-button .menu-button-image {
|
#navigation .menu-button .menu-button-image {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: relative;
|
position: absolute;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
top: 14px;
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
background-image: url(../svg/bars.svg);
|
background-image: url(../svg/bars.svg);
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
margin: auto;
|
transform: translateX(-50%) translateY(-50%);
|
||||||
vertical-align: top;
|
|
||||||
}
|
}
|
||||||
#menu-toggle:checked + .menu-button .menu-button-image {
|
#menu-toggle:checked + .menu-button .menu-button-image {
|
||||||
opacity: 40%;
|
opacity: 40%;
|
||||||
|
@ -225,10 +224,6 @@ body {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
max-height: max-content;
|
max-height: max-content;
|
||||||
}
|
}
|
||||||
#navigation .menu-button {
|
|
||||||
display: block;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/******************* Front-screen *******************/
|
/******************* Front-screen *******************/
|
||||||
.front-screen {
|
.front-screen {
|
||||||
|
|
|
@ -1,10 +1,18 @@
|
||||||
/******************* Main layout *******************/
|
/******************* Main layout *******************/
|
||||||
|
@media only screen and (max-width: 320px) {
|
||||||
|
html {
|
||||||
|
font-size: smaller;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (max-width: 768px) {
|
||||||
.post {
|
.post {
|
||||||
margin-bottom: calc(-1 * var(--footer-height-block));
|
margin-bottom: calc(-1 * var(--footer-height-block));
|
||||||
}
|
}
|
||||||
.post_body {
|
.post_body,
|
||||||
margin: 0 1em;
|
.post_header {
|
||||||
|
padding: 0 1em;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
.post:after {
|
.post:after {
|
||||||
height: var(--footer-height-block);
|
height: var(--footer-height-block);
|
||||||
|
|
Loading…
Reference in a new issue