Use <button> instead of <a> for mobile settings tabs

pull/602/head
Thibaut Courouble 8 years ago
parent 78213d015c
commit 29b839589c

@ -49,11 +49,11 @@ class app.views.Mobile extends app.View
@forward.removeAttribute('hidden') @forward.removeAttribute('hidden')
$.on @forward, 'click', @onClickForward $.on @forward, 'click', @onClickForward
@docPickerTab = $('a[data-tab="doc-picker"]') @docPickerTab = $('button[data-tab="doc-picker"]')
@docPickerTab.removeAttribute('hidden') @docPickerTab.removeAttribute('hidden')
$.on @docPickerTab, 'click', @onClickDocPickerTab $.on @docPickerTab, 'click', @onClickDocPickerTab
@settingsTab = $('a[data-tab="settings"]') @settingsTab = $('button[data-tab="settings"]')
@settingsTab.removeAttribute('hidden') @settingsTab.removeAttribute('hidden')
$.on @settingsTab, 'click', @onClickSettingsTab $.on @settingsTab, 'click', @onClickSettingsTab

@ -406,7 +406,6 @@
line-height: inherit; line-height: inherit;
color: $linkColor; color: $linkColor;
text-decoration: $linkTextDecoration; text-decoration: $linkTextDecoration;
cursor: pointer;
&:hover { &:hover {
color: $linkColorHover; color: $linkColorHover;

@ -123,25 +123,18 @@
._settings-tabs { ._settings-tabs {
display: none; // mobile only display: none; // mobile only
margin-right: .5rem; margin-right: .5rem;
line-height: $headerHeight;
} }
._settings-tab { ._settings-tab {
position: relative; position: relative;
display: inline-block;
vertical-align: top; vertical-align: top;
padding: 0 .75rem; padding: 0 .75rem;
cursor: pointer; line-height: $headerHeight;
&, &:hover {
color: $textColorLight; color: $textColorLight;
text-decoration: none;
}
&.active { &.active {
color: $textColor; color: $textColor;
font-weight: $boldFontWeight; font-weight: $boldFontWeight;
text-decoration: none;
box-shadow: inset 0 -2px $linkColor; box-shadow: inset 0 -2px $linkColor;
} }
} }

@ -44,7 +44,7 @@
<svg viewBox="0 0 24 24"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"></path></svg> Back <svg viewBox="0 0 24 24"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"></path></svg> Back
</button> </button>
<nav class="_settings-tabs"> <nav class="_settings-tabs">
<a class="_settings-tab active" data-tab="doc-picker" hidden>Docs</a><a class="_settings-tab" data-tab="settings" hidden>Settings</a> <button type="button" class="_settings-tab active" data-tab="doc-picker" hidden>Docs</button><button type="button" class="_settings-tab" data-tab="settings" hidden>Settings</button>
</nav> </nav>
</div> </div>
<div class="_sidebar"> <div class="_sidebar">

Loading…
Cancel
Save