mirror of https://gitlab.com/curben/blog
fix(css): reduce mobile header height
- disable line break for site title - remove menu button label - increase size of menu button
This commit is contained in:
parent
96ad03e681
commit
5a79bf82a8
|
@ -24,9 +24,9 @@
|
|||
</nav>
|
||||
<%/* Nav menu for mobile */%>
|
||||
<nav class="mobile-nav">
|
||||
<h1><a href="<%- url_for(theme.menu['Home']) %>"><%= config.title %></a></h1>
|
||||
<h1 class="site-title"><a href="<%- url_for(theme.menu['Home']) %>"><%= config.title %></a></h1>
|
||||
<ul class="mobile-nav-menu">
|
||||
<label for="mobile-menu-toggle"><a class="no-underline">☰ Menu</a></label>
|
||||
<label for="mobile-menu-toggle"><a class="menu-button no-underline">☰</a></label>
|
||||
<input id="mobile-menu-toggle" type="checkbox"/>
|
||||
<ul class="mobile-nav-link">
|
||||
<div class="searchContainer">
|
||||
|
|
|
@ -59,6 +59,11 @@ h1 {
|
|||
margin: 0.5em 0;
|
||||
}
|
||||
|
||||
/* Disable line break for site title */
|
||||
h1.site-title {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
@ -638,6 +643,10 @@ td {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.menu-button {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
/* search bar */
|
||||
.searchContainer {
|
||||
border-radius: 5px;
|
||||
|
@ -732,6 +741,8 @@ svg#link {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
/* reduce height of mobile header */
|
||||
height: 1.5em;
|
||||
}
|
||||
|
||||
/* display links when menu button is clicked */
|
||||
|
|
Loading…
Reference in New Issue