78 lines
2.0 KiB
Vue
78 lines
2.0 KiB
Vue
<template>
|
|
<v-container>
|
|
<v-row no-gutters>
|
|
<v-col class="align-start">
|
|
<card-control />
|
|
</v-col>
|
|
<v-col class="pl-3">
|
|
<card-soundboard />
|
|
</v-col>
|
|
</v-row>
|
|
</v-container>
|
|
<v-row no-gutters class="pr-4 pl-4">
|
|
<v-row no-gutters>
|
|
<v-col class="align-start">
|
|
<CardButtonScore />
|
|
</v-col>
|
|
<v-col class="pl-3">
|
|
<card-solution />
|
|
</v-col>
|
|
</v-row>
|
|
</v-row>
|
|
</template>
|
|
|
|
<script setup>
|
|
|
|
import CardSolution from '@/components/CardSolution.vue'
|
|
import CardControl from '@/components/CardControl.vue'
|
|
import CardSoundboard from '@/components/CardSoundboard.vue';
|
|
import CardButtonScore from '@/components/CardButtonScore.vue'
|
|
|
|
</script>
|
|
|
|
<style>
|
|
@media (min-width: 1024px) {
|
|
.card__title.primary {
|
|
background-color: #d42828; /* Changez la couleur en fonction de votre thème */
|
|
}
|
|
.card__title.feedback {
|
|
background-color: #2E7D32; /* Changez la couleur en fonction de votre thème */
|
|
}
|
|
.btn{
|
|
border-radius:20px!important;
|
|
}
|
|
.btn.red {
|
|
background-color: #d42828; /* Changez la couleur en fonction de votre thème */
|
|
}
|
|
.btn.blue {
|
|
background-color: #2867d4; /* Changez la couleur en fonction de votre thème */
|
|
}
|
|
.btn.orange {
|
|
background-color: #d48f28; /* Changez la couleur en fonction de votre thème */
|
|
}
|
|
.btn.green {
|
|
background-color: #28d42e; /* Changez la couleur en fonction de votre thème */
|
|
}
|
|
.scorediv-style-red {
|
|
background-color: #d42828 !important;
|
|
padding: 15px;
|
|
border-top-left-radius: 10%;
|
|
}
|
|
.scorediv-style-orange {
|
|
background-color: #d48f28 !important;
|
|
padding: 15px;
|
|
border-bottom-left-radius: 10%;
|
|
}
|
|
.scorediv-style-blue {
|
|
background-color: #2867d4 !important;
|
|
padding: 15px;
|
|
border-top-right-radius: 10%;
|
|
}
|
|
.scorediv-style-green {
|
|
background-color: #28d42e !important;
|
|
padding: 15px;
|
|
border-bottom-right-radius: 10%;
|
|
}
|
|
}
|
|
</style>
|