gcs-user-interface/src/components/VehicleStatus/EmergencyStop.vue

40 lines
778 B
Vue

<template>
<div class="emergency-stop-div">
<button class="emergency-button"> EMERGENCY STOP </button>
</div>
</template>
<script lang="ts">
export default {
data() {
return {};
}
};
</script>
<style scoped>
.emergency-stop-div {
position: relative;
display: flex;
height: 20%;
width: 78%;
text-align: center;
}
.emergency-button {
position: relative;
display: inline-block;
width: 100%;
height: 100%;
background-color: rgb(255, 57, 57);
font-size: 0.96em;
transition: background-color 0.20s;
}
.emergency-button:hover {
background-color: rgb(192, 40, 40);
}
</style>