mirror of
https://github.com/tenrok/vue-form-wizard.git
synced 2026-06-06 00:22:23 +03:00
Adjust button styling to match overall wizard style
This commit is contained in:
Vendored
+1
-1
File diff suppressed because one or more lines are too long
+1
-6
@@ -2,6 +2,7 @@
|
||||
<div>
|
||||
<tab-wizard @on-complete="onComplete"
|
||||
shape="circle"
|
||||
color="#e74c3c"
|
||||
class="card">
|
||||
<tab-content title="Personal details"
|
||||
icon="ti-user">
|
||||
@@ -16,12 +17,6 @@
|
||||
Yuhuuu! This seems pretty damn simple
|
||||
</tab-content>
|
||||
|
||||
<button slot="prev" class="btn btn-default">
|
||||
Go back
|
||||
</button>
|
||||
<button slot="next" class="btn btn-default">
|
||||
Go to next step
|
||||
</button>
|
||||
</tab-wizard>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -42,7 +42,7 @@
|
||||
<template>
|
||||
<span @click="prevTab" v-if="displayPrevButton">
|
||||
<slot name="prev">
|
||||
<button type="button" class="btn btn-default btn-wd">
|
||||
<button type="button" class="btn btn-default btn-wd" :style="fillButtonStyle">
|
||||
{{backButtonText}}
|
||||
</button>
|
||||
</slot>
|
||||
@@ -52,7 +52,7 @@
|
||||
<template>
|
||||
<span @click="finish" class="pull-right" v-if="isLastStep">
|
||||
<slot name="finish">
|
||||
<button type="button" class="btn btn-fill btn-wd btn-next">
|
||||
<button type="button" class="btn btn-fill btn-wd btn-next" :style="fillButtonStyle">
|
||||
{{finishButtonText}}
|
||||
</button>
|
||||
</slot>
|
||||
@@ -62,7 +62,7 @@
|
||||
<template>
|
||||
<span @click="nextTab" class="pull-right" v-if="!isLastStep">
|
||||
<slot name="next">
|
||||
<button type="button" class="btn btn-fill btn-wd btn-next">
|
||||
<button type="button" class="btn btn-fill btn-wd btn-next" :style="fillButtonStyle">
|
||||
{{nextButtonText}}
|
||||
</button>
|
||||
</slot>
|
||||
@@ -170,6 +170,13 @@
|
||||
isTabShape () {
|
||||
return this.shape === 'tab'
|
||||
},
|
||||
fillButtonStyle () {
|
||||
return {
|
||||
backgroundColor: this.color,
|
||||
borderColor: this.color,
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
progress () {
|
||||
let percentage = 0
|
||||
if (this.activeTabIndex > 0) {
|
||||
|
||||
Reference in New Issue
Block a user