Mercurial > gemma
diff client/src/components/importschedule/Importschedule.vue @ 2330:7b79d4966a87
client: unified buttons styles in tables
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Tue, 19 Feb 2019 16:33:31 +0100 |
parents | 41218dd386a9 |
children | f04d33fec01e |
line wrap: on
line diff
--- a/client/src/components/importschedule/Importschedule.vue Tue Feb 19 14:57:48 2019 +0100 +++ b/client/src/components/importschedule/Importschedule.vue Tue Feb 19 16:33:31 2019 +0100 @@ -28,7 +28,7 @@ /> </div> </div> - <table v-if="schedules.length" class="table"> + <table v-if="schedules.length" class="table table-hover"> <thead> <tr> <th><translate>Import</translate></th> @@ -36,9 +36,7 @@ <th><translate>Author</translate></th> <th><translate>Schedule</translate></th> <th><translate>Email</translate></th> - <th> </th> - <th> </th> - <th> </th> + <th></th> </tr> </thead> <tbody> @@ -55,29 +53,37 @@ icon="check" ></font-awesome-icon> </td> - <td> - <font-awesome-icon - :style="activeStyle" + <td class="text-right"> + <button @click="editSchedule(schedule.id)" - icon="pencil-alt" - fixed-width - ></font-awesome-icon> - </td> - <td> - <font-awesome-icon - :style="activeStyle" + class="btn btn-sm btn-dark mr-1" + :disabled="importScheduleDetailVisible" + > + <font-awesome-icon + icon="pencil-alt" + fixed-width + ></font-awesome-icon> + </button> + <button @click="deleteSchedule(schedule.id)" - icon="trash" - fixed-width - ></font-awesome-icon> - </td> - <td> - <font-awesome-icon + class="btn btn-sm btn-dark mr-1" + :disabled="importScheduleDetailVisible" + > + <font-awesome-icon + icon="trash" + fixed-width + ></font-awesome-icon> + </button> + <button @click="triggerManualImport(schedule.id)" - class="fa-fw mr-2" - fixed-width - icon="play" - ></font-awesome-icon> + class="btn btn-sm btn-dark" + :disabled="importScheduleDetailVisible" + > + <font-awesome-icon + icon="play" + fixed-width + ></font-awesome-icon> + </button> </td> </tr> </tbody> @@ -204,10 +210,6 @@ computed: { ...mapState("application", ["showSidebar"]), ...mapState("importschedule", ["schedules", "importScheduleDetailVisible"]), - activeStyle() { - const color = this.importScheduleDetailVisible ? "#aeaeae" : "#000000"; - return { color: color }; - }, spacerStyle() { return [ "spacer ml-3",