Vertically align inner toggle for webkit browsers

This commit is contained in:
Michael Rose 2017-03-29 15:27:15 -04:00
parent 81a477ea18
commit 4182c34ff6
4 changed files with 10 additions and 10 deletions

View File

@ -14,8 +14,10 @@
<div class="sidebar-toggle-wrapper"> <div class="sidebar-toggle-wrapper">
<button class="toggle navicon-button larr" type="button"> <button class="toggle navicon-button larr" type="button">
<span class="sidebar-toggle-label">{{ site.data.theme.t.menu | default: 'Menu' }}</span> <span class="toggle-inner">
<span class="navicon"></span> <span class="sidebar-toggle-label">{{ site.data.theme.t.menu | default: 'Menu' }}</span>
<span class="navicon"></span>
</span>
</button> </button>
</div> </div>

View File

@ -116,13 +116,11 @@
cursor: pointer; cursor: pointer;
z-index: 10000; z-index: 10000;
.toggle { .toggle-inner {
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
color: inherit;
text-decoration: none;
} }
} }

View File

@ -14,8 +14,10 @@
<div class="sidebar-toggle-wrapper"> <div class="sidebar-toggle-wrapper">
<button class="toggle navicon-button larr" type="button"> <button class="toggle navicon-button larr" type="button">
<span class="sidebar-toggle-label">{{ site.data.theme.t.menu | default: 'Menu' }}</span> <span class="toggle-inner">
<span class="navicon"></span> <span class="sidebar-toggle-label">{{ site.data.theme.t.menu | default: 'Menu' }}</span>
<span class="navicon"></span>
</span>
</button> </button>
</div> </div>

View File

@ -116,13 +116,11 @@
cursor: pointer; cursor: pointer;
z-index: 10000; z-index: 10000;
.toggle { .toggle-inner {
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
color: inherit;
text-decoration: none;
} }
} }