refactor: replace emergency stop icon (#1170)

Fixes https://github.com/mainsail-crew/mainsail/pull/932
This commit is contained in:
th33xitus
2022-11-25 23:13:47 +01:00
committed by GitHub
parent 12483ee63b
commit 4c24fa7284

View File

@@ -63,7 +63,7 @@
class="button-min-width-auto px-3 emergency-button"
:loading="loadings.includes('topbarEmergencyStop')"
@click="btnEmergencyStop">
<v-icon class="mr-md-2">{{ mdiAlertCircleOutline }}</v-icon>
<v-icon class="mr-md-2">{{ mdiAlertOctagonOutline }}</v-icon>
<span class="d-none d-md-inline">{{ $t('App.TopBar.EmergencyStop') }}</span>
</v-btn>
<the-notification-menu></the-notification-menu>
@@ -84,10 +84,10 @@
</v-snackbar>
<v-dialog v-model="showEmergencyStopDialog" width="400" :fullscreen="isMobile">
<panel
:title="$t('EmergencyStopDialog.EmergencyStop')"
:title="$t('EmergencyStopDialog.EmergencyStop').toString()"
toolbar-color="error"
card-class="emergency-stop-dialog"
:icon="mdiAlertCircleOutline"
:icon="mdiAlertOctagonOutline"
:margin-bottom="false">
<template #buttons>
<v-btn icon tile @click="showEmergencyStopDialog = false">
@@ -119,7 +119,7 @@ import PrinterSelector from '@/components/ui/PrinterSelector.vue'
import MainsailLogo from '@/components/ui/MainsailLogo.vue'
import TheNotificationMenu from '@/components/notifications/TheNotificationMenu.vue'
import { topbarHeight } from '@/store/variables'
import { mdiAlertCircleOutline, mdiContentSave, mdiFileUpload, mdiClose, mdiCloseThick } from '@mdi/js'
import { mdiAlertOctagonOutline, mdiContentSave, mdiFileUpload, mdiClose, mdiCloseThick } from '@mdi/js'
type uploadSnackbar = {
status: boolean
@@ -145,7 +145,7 @@ type uploadSnackbar = {
},
})
export default class TheTopbar extends Mixins(BaseMixin) {
mdiAlertCircleOutline = mdiAlertCircleOutline
mdiAlertOctagonOutline = mdiAlertOctagonOutline
mdiContentSave = mdiContentSave
mdiFileUpload = mdiFileUpload
mdiClose = mdiClose
@@ -256,14 +256,14 @@ export default class TheTopbar extends Mixins(BaseMixin) {
async uploadAndStart() {
if (this.$refs.fileUploadAndStart?.files.length) {
this.$store.dispatch('socket/addLoading', { name: 'btnUploadAndStart' })
await this.$store.dispatch('socket/addLoading', { name: 'btnUploadAndStart' })
let successFiles = []
for (const file of this.$refs.fileUploadAndStart?.files || []) {
const result = await this.doUploadAndStart(file)
successFiles.push(result)
}
this.$store.dispatch('socket/removeLoading', { name: 'btnUploadAndStart' })
await this.$store.dispatch('socket/removeLoading', { name: 'btnUploadAndStart' })
for (const file of successFiles) {
const text = this.$t('App.TopBar.UploadOfFileSuccessful', { file: file }).toString()
this.$toast.success(text)
@@ -329,6 +329,7 @@ export default class TheTopbar extends Mixins(BaseMixin) {
</script>
<style>
/*noinspection CssUnusedSymbol*/
.topbar .v-toolbar__content {
padding-top: 0 !important;
padding-bottom: 0 !important;
@@ -338,13 +339,17 @@ export default class TheTopbar extends Mixins(BaseMixin) {
.button-min-width-auto {
min-width: auto !important;
}
/*noinspection CssUnusedSymbol*/
.topbar .v-btn {
height: 100% !important;
max-height: none;
}
/*noinspection CssUnusedSymbol*/
.topbar .v-btn.v-btn--icon {
/*noinspection CssUnresolvedCustomProperty*/
width: var(--topbar-icon-btn-width) !important;
}
/*noinspection CssUnusedSymbol*/
@media (min-width: 768px) {
header.topbar {
z-index: 8 !important;