1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-08-02 11:30:22 +02:00

turn some links into btns

This commit is contained in:
Kushagra Gour
2018-07-03 09:44:51 +05:30
parent 31a6f299e7
commit ed670db395
3 changed files with 18 additions and 20 deletions

View File

@@ -18,7 +18,7 @@ export function MainHeader(props) {
<div class="main-header__btn-wrap flex flex-v-center">
<button
id="runBtn"
class="hide flex flex-v-center hint--rounded hint--bottom-left"
class="hide btn--dark flex flex-v-center hint--rounded hint--bottom-left"
aria-label="Run preview (Ctrl/⌘ + Shift + 5)"
onClick={props.runBtnClickHandler}
>
@@ -31,7 +31,7 @@ export function MainHeader(props) {
onClick={props.addLibraryBtnHandler}
data-event-category="ui"
data-event-action="addLibraryButtonClick"
class="flex-v-center hint--rounded hint--bottom-left"
class="btn--dark flex-v-center hint--rounded hint--bottom-left"
aria-label="Add a JS/CSS library"
>
Add library{' '}
@@ -45,7 +45,7 @@ export function MainHeader(props) {
</Button>
<button
class="flex flex-v-center hint--rounded hint--bottom-left"
class="btn--dark flex flex-v-center hint--rounded hint--bottom-left"
aria-label="Start a new creation"
onClick={props.newBtnHandler}
>
@@ -58,7 +58,7 @@ export function MainHeader(props) {
</button>
<button
id="saveBtn"
class={`flex flex-v-center hint--rounded hint--bottom-left ${
class={`btn--dark flex flex-v-center hint--rounded hint--bottom-left ${
props.isSaving ? 'is-loading' : ''
} ${props.unsavedEditCount ? 'is-marked' : 0}`}
aria-label="Save current creation (Ctrl/⌘ + S)"
@@ -77,7 +77,7 @@ export function MainHeader(props) {
</button>
<button
id="openItemsBtn"
class={`flex flex-v-center hint--rounded hint--bottom-left ${
class={`btn--dark flex flex-v-center hint--rounded hint--bottom-left ${
props.isFetchingItems ? 'is-loading' : ''
}`}
aria-label="Open a saved creation (Ctrl/⌘ + O)"
@@ -98,7 +98,7 @@ export function MainHeader(props) {
onClick={props.loginBtnHandler}
data-event-category="ui"
data-event-action="loginButtonClick"
class="hide-on-login flex flex-v-center hint--rounded hint--bottom-left"
class="hide-on-login btn--dark flex flex-v-center hint--rounded hint--bottom-left"
aria-label="Login/Signup"
>
Login/Signup
@@ -108,7 +108,7 @@ export function MainHeader(props) {
data-event-category="ui"
data-event-action="headerAvatarClick"
aria-label="See profile or Logout"
class="hide-on-logout hint--rounded hint--bottom-left"
class="hide-on-logout btn--dark hint--rounded hint--bottom-left"
>
<img
id="headerAvatarImg"

View File

@@ -201,23 +201,21 @@ export default class SavedItemPane extends Component {
<div class="flex flex-v-center" style="justify-content: space-between;">
<h3>My Library ({this.items.length})</h3>
<div class="main-header__btn-wrap">
<a
<div>
<button
onClick={this.props.exportBtnClickHandler}
href=""
class="btn btn-icon hint--bottom-left hint--rounded hint--medium"
class="btn--dark hint--bottom-left hint--rounded hint--medium"
aria-label="Export all your creations into a single importable file."
>
Export
</a>
<a
</button>
<button
onClick={this.importBtnClickHandler.bind(this)}
href=""
class="btn btn-icon hint--bottom-left hint--rounded hint--medium"
class="btn--dark hint--bottom-left hint--rounded hint--medium"
aria-label="Only the file that you export through the 'Export' button can be imported."
>
Import
</a>
</button>
</div>
</div>
<input