Use buttons more consistently
This commit is contained in:
parent
0102709d92
commit
e960202607
21 changed files with 45 additions and 43 deletions
|
@ -16,7 +16,7 @@
|
|||
model="hex"
|
||||
picker="square"
|
||||
v-model="color"/>
|
||||
<a @click="reset" class="reset">
|
||||
<a @click="reset" class="button has-no-shadow is-small ml-2">
|
||||
Reset Color
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -98,7 +98,7 @@
|
|||
/>
|
||||
|
||||
<a
|
||||
class="button is-outlined is-primary has-no-shadow is-fullwidth"
|
||||
class="button is-primary has-no-shadow is-fullwidth"
|
||||
@click="close"
|
||||
>
|
||||
Confirm
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<template>
|
||||
<div :class="{'is-pulled-up': isEditEnabled}" class="editor">
|
||||
<div class="tabs is-right" v-if="hasPreview && isEditEnabled && !hasEditBottom">
|
||||
<ul>
|
||||
<li>
|
||||
<a v-if="!isEditActive" @click="toggleEdit">Edit</a>
|
||||
<a v-else @click="toggleEdit">Done</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="is-pulled-right mb-4" v-if="hasPreview && isEditEnabled && !hasEditBottom">
|
||||
<a v-if="!isEditActive" @click="toggleEdit" class="button has-no-shadow">
|
||||
<icon icon="pen"/>
|
||||
</a>
|
||||
<a v-else @click="toggleEdit" class="button has-no-shadow">
|
||||
Done
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="clear"></div>
|
||||
|
||||
<vue-easymde
|
||||
:configs="config"
|
||||
@change="bubble"
|
||||
|
@ -416,8 +418,8 @@ export default {
|
|||
@import '../../styles/theme/variables';
|
||||
|
||||
.editor {
|
||||
.tabs ul {
|
||||
margin-left: 0;
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.preview.content ul li input[type="checkbox"] {
|
||||
|
|
|
@ -50,7 +50,7 @@
|
|||
<a
|
||||
:disabled="backgroundService.loading"
|
||||
@click="() => searchBackgrounds(currentPage + 1)"
|
||||
class="button is-primary is-centered is-load-more-button is-outlined noshadow"
|
||||
class="button is-centered is-load-more-button has-no-shadow mt-4"
|
||||
v-if="backgroundSearchResult.length > 0"
|
||||
>
|
||||
<template v-if="backgroundService.loading">
|
||||
|
|
|
@ -39,7 +39,7 @@
|
|||
</p>
|
||||
<div class="buttons">
|
||||
<button @click="migrate" class="button is-primary">I am sure, please start migrating now!</button>
|
||||
<router-link :to="{name: 'home'}" class="button is-danger is-outlined">Cancel</router-link>
|
||||
<router-link :to="{name: 'home'}" class="button is-text has-text-danger is-inverted noshadow underline-none">Cancel</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
|
|
|
@ -11,8 +11,8 @@
|
|||
<slot name="text"></slot>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<button @click="$emit('close')" class="button is-danger is-inverted noshadow">Cancel</button>
|
||||
<button @click="$emit('submit')" class="button is-success noshadow">Do it!</button>
|
||||
<button @click="$emit('close')" class="button is-text has-text-danger is-inverted noshadow underline-none">Cancel</button>
|
||||
<button @click="$emit('submit')" class="button is-primary noshadow">Do it!</button>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
|
|
|
@ -138,7 +138,7 @@
|
|||
class="is-narrow"
|
||||
/>
|
||||
|
||||
<button :class="{ 'is-loading': taskService.loading}" class="button is-success is-fullwidth" type="submit">
|
||||
<button :class="{ 'is-loading': taskService.loading}" class="button is-primary is-fullwidth" type="submit">
|
||||
Save
|
||||
</button>
|
||||
|
||||
|
|
|
@ -2,9 +2,9 @@
|
|||
<div :class="{'is-loading': taskService.loading}" class="defer-task loading-container">
|
||||
<label class="label">Defer due date</label>
|
||||
<div class="defer-days">
|
||||
<button @click="() => deferDays(1)" class="button is-outlined is-primary has-no-shadow">1 day</button>
|
||||
<button @click="() => deferDays(3)" class="button is-outlined is-primary has-no-shadow">3 days</button>
|
||||
<button @click="() => deferDays(7)" class="button is-outlined is-primary has-no-shadow">1 week</button>
|
||||
<button @click="() => deferDays(1)" class="button has-no-shadow">1 day</button>
|
||||
<button @click="() => deferDays(3)" class="button has-no-shadow">3 days</button>
|
||||
<button @click="() => deferDays(7)" class="button has-no-shadow">1 week</button>
|
||||
</div>
|
||||
<flat-pickr
|
||||
:class="{ 'disabled': taskService.loading}"
|
||||
|
|
|
@ -1,15 +1,11 @@
|
|||
.color-picker-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.verte__guide {
|
||||
border-radius: 100%;
|
||||
border: 1px solid $grey-light;
|
||||
box-shadow: $card-shadow;
|
||||
}
|
||||
|
||||
a.reset {
|
||||
font-size: .9em;
|
||||
padding-left: .5rem;
|
||||
}
|
||||
}
|
|
@ -15,7 +15,7 @@
|
|||
border-radius: $radius;
|
||||
box-shadow: $card-shadow;
|
||||
|
||||
a {
|
||||
a:not(.button) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 .5rem;
|
||||
|
@ -49,11 +49,11 @@
|
|||
width: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&.button {
|
||||
margin: 1rem;
|
||||
width: calc(100% - 2rem);
|
||||
}
|
||||
}
|
||||
|
||||
a.button {
|
||||
margin: 1rem;
|
||||
width: calc(100% - 2rem);
|
||||
}
|
||||
|
||||
.flatpickr-calendar {
|
||||
|
|
|
@ -55,3 +55,7 @@
|
|||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.underline-none {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<p>Click on a list or namespace on the left to get started.</p>
|
||||
<router-link
|
||||
:to="{name: 'migrate.start'}"
|
||||
class="button is-primary is-right noshadow is-outlined"
|
||||
class="button is-primary has-no-shadow"
|
||||
v-if="migratorsEnabled"
|
||||
>
|
||||
Import your data into Vikunja
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :class="{ 'is-loading': labelService.loading}" class="loader-container content">
|
||||
<router-link :to="{name:'labels.create'}" class="button is-success button-right">
|
||||
<router-link :to="{name:'labels.create'}" class="button is-primary button-right">
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
</span>
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
v-model="label.title"/>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button class="button is-success noshadow" type="submit">
|
||||
<button class="button is-primary noshadow" type="submit">
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
</span>
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
v-model="list.title"/>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button :disabled="list.title === ''" @click="newList()" class="button is-success noshadow">
|
||||
<button :disabled="list.title === ''" @click="newList()" class="button is-primary noshadow">
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
</span>
|
||||
|
|
|
@ -62,7 +62,7 @@
|
|||
</span>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button :disabled="newTaskText.length === 0" @click="addTask()" class="button is-success">
|
||||
<button :disabled="newTaskText.length === 0" @click="addTask()" class="button is-primary">
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
</span>
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
v-model="namespace.title"/>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button :disabled="namespace.title === ''" @click="newNamespace()" class="button is-success noshadow">
|
||||
<button :disabled="namespace.title === ''" @click="newNamespace()" class="button is-primary noshadow">
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
</span>
|
||||
|
|
|
@ -30,9 +30,9 @@
|
|||
/>
|
||||
</h3>
|
||||
<div v-if="!showAll">
|
||||
<a @click="showTodaysTasks()" class="button is-primary is-outlined noshadow mr-2">Today</a>
|
||||
<a @click="setDatesToNextWeek()" class="button is-primary is-outlined noshadow mr-2">Next Week</a>
|
||||
<a @click="setDatesToNextMonth()" class="button is-primary is-outlined noshadow">Next Month</a>
|
||||
<a @click="showTodaysTasks()" class="button noshadow mr-2">Today</a>
|
||||
<a @click="setDatesToNextWeek()" class="button noshadow mr-2">Next Week</a>
|
||||
<a @click="setDatesToNextMonth()" class="button noshadow">Next Month</a>
|
||||
</div>
|
||||
<template v-if="!taskService.loading && (!hasUndoneTasks || !tasks || tasks.length === 0)">
|
||||
<h3 class="nothing">Nothing to do - Have a nice day!</h3>
|
||||
|
|
|
@ -236,9 +236,9 @@
|
|||
</div>
|
||||
<div class="column is-one-third action-buttons" v-if="canWrite">
|
||||
<a
|
||||
:class="{'is-success': !task.done}"
|
||||
:class="{'is-success': !task.done, 'has-no-shadow': !task.done}"
|
||||
@click="toggleTaskDone()"
|
||||
class="button is-outlined noshadow has-no-border">
|
||||
class="button is-outlined has-no-border">
|
||||
<span class="icon is-small"><icon icon="check-double"/></span>
|
||||
<template v-if="task.done">
|
||||
Mark as undone
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
v-model="team.name"/>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button class="button is-success noshadow" type="submit">
|
||||
<button class="button is-primary noshadow" type="submit">
|
||||
<span class="icon is-small">
|
||||
<icon icon="plus"/>
|
||||
</span>
|
||||
|
|
|
@ -248,7 +248,7 @@
|
|||
<input type="text" v-model="caldavUrl" class="input" readonly/>
|
||||
</div>
|
||||
<div class="control">
|
||||
<a @click="copy(caldavUrl)" class="button is-success noshadow" v-tooltip="'Copy to clipboard'">
|
||||
<a @click="copy(caldavUrl)" class="button is-primary noshadow" v-tooltip="'Copy to clipboard'">
|
||||
<span class="icon">
|
||||
<icon icon="paste"/>
|
||||
</span>
|
||||
|
|
Loading…
Reference in a new issue