curben
/
blog
mirror of https://gitlab.com/curben/blog
1
0
Fork 0
Code Issues Releases Wiki Activity

style: consistent class name for mobile nav

This commit is contained in:
curben 2018-11-08 12:11:23 +10:30
parent a3fd0ce5ef
commit 78032cfad4
2 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
themes/typing/layout/_partial/header.ejs
View File

@ -8,10 +8,10 @@
<%/* Nav menu for mobile */%> <%/* Nav menu for mobile */%>
<nav class="mobile-nav"> <nav class="mobile-nav">
<h1 class="nickname"><%= theme.nickname %></h1> <h1 class="nickname"><%= theme.nickname %></h1>
<ul id="mobile-nav-menu"> <ul class="mobile-nav-menu">
<label for="menu-toggle"><a>&#9776; Menu</a></label> <label for="mobile-menu-toggle"><a>&#9776; Menu</a></label>
<input type="checkbox" id="menu-toggle"/> <input id="mobile-menu-toggle" type="checkbox"/>
<ul id="menu"> <ul class="mobile-nav-link">
<% for (let i in theme.menu) { %> <% for (let i in theme.menu) { %>
<a href="<%- url_for(theme.menu[i]) %>"><%= i %></a> <a href="<%- url_for(theme.menu[i]) %>"><%= i %></a>
<% } %> <% } %>

6
themes/typing/source/css/typing.css
View File

@ -1079,13 +1079,13 @@ pre .javascript .function,pre .keyword {
/* hide mobile nav menu and its checkbox */ /* hide mobile nav menu and its checkbox */
/* when it's not mobile */ /* when it's not mobile */
.mobile-nav,#menu-toggle,#menu{ .mobile-nav,#mobile-menu-toggle,.mobile-nav-link{
display: none display: none
} }
/* align the text (in nav menu) to right */ /* align the text (in nav menu) to right */
/* set line-height in /archives page */ /* set line-height in /archives page */
#mobile-nav-menu{ .mobile-nav-menu{
text-align: right; text-align: right;
line-height: 1.8 line-height: 1.8
} }
@ -1129,7 +1129,7 @@ pre .javascript .function,pre .keyword {
/* display links when menu button is clicked */ /* display links when menu button is clicked */
/* use grid to display each link in new line */ /* use grid to display each link in new line */
#menu-toggle:checked + #menu{ #mobile-menu-toggle:checked + .mobile-nav-link{
display: grid; display: grid;
display: -ms-grid; display: -ms-grid;
border: 2px solid #999; border: 2px solid #999;