Update Details.vue's button styles

This commit is contained in:
Louis Lam 2022-10-15 21:01:48 +08:00
parent afe12ccf24
commit 64f84eb118

View file

@ -20,19 +20,21 @@
</p> </p>
<div class="functions"> <div class="functions">
<button v-if="monitor.active" class="btn btn-light" @click="pauseDialog"> <div class="btn-group" role="group">
<button v-if="monitor.active" class="btn btn-normal" @click="pauseDialog">
<font-awesome-icon icon="pause" /> {{ $t("Pause") }} <font-awesome-icon icon="pause" /> {{ $t("Pause") }}
</button> </button>
<button v-if="! monitor.active" class="btn btn-primary" @click="resumeMonitor"> <button v-if="! monitor.active" class="btn btn-primary" @click="resumeMonitor">
<font-awesome-icon icon="play" /> {{ $t("Resume") }} <font-awesome-icon icon="play" /> {{ $t("Resume") }}
</button> </button>
<router-link :to=" '/edit/' + monitor.id " class="btn btn-secondary"> <router-link :to=" '/edit/' + monitor.id " class="btn btn-normal">
<font-awesome-icon icon="edit" /> {{ $t("Edit") }} <font-awesome-icon icon="edit" /> {{ $t("Edit") }}
</router-link> </router-link>
<button class="btn btn-danger" @click="deleteDialog"> <button class="btn btn-danger" @click="deleteDialog">
<font-awesome-icon icon="trash" /> {{ $t("Delete") }} <font-awesome-icon icon="trash" /> {{ $t("Delete") }}
</button> </button>
</div> </div>
</div>
<div class="shadow-box"> <div class="shadow-box">
<div class="row"> <div class="row">
@ -392,11 +394,6 @@ export default {
@media (max-width: 550px) { @media (max-width: 550px) {
.functions { .functions {
text-align: center; text-align: center;
button, a {
margin-left: 10px !important;
margin-right: 10px !important;
}
} }
.ping-chart-wrapper { .ping-chart-wrapper {
@ -439,12 +436,6 @@ export default {
} }
} }
.functions {
button, a {
margin-right: 20px;
}
}
.shadow-box { .shadow-box {
padding: 20px; padding: 20px;
margin-top: 25px; margin-top: 25px;