codevdesign 2.0.14 → 2.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/csqc.css +70 -15
- package/composants/csqcEntete.vue +236 -230
- package/package.json +1 -1
package/assets/csqc.css
CHANGED
|
@@ -1,8 +1,69 @@
|
|
|
1
1
|
@charset "UTF-8";
|
|
2
|
+
/* Largeur maximale : contenu principal, entête et menu */
|
|
3
|
+
.conteneurLargeur,
|
|
4
|
+
.barre-entete .v-toolbar__content,
|
|
5
|
+
.barre-menu .v-toolbar__content {
|
|
6
|
+
margin-inline: auto;
|
|
7
|
+
max-width: 1500px;
|
|
8
|
+
width: 100%;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
/* Fond gris dans les marges latérales au-delà du conteneur */
|
|
12
|
+
.v-main,
|
|
13
|
+
.barre-footer {
|
|
14
|
+
background-color: rgb(var(--v-theme-surface));
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.v-main {
|
|
18
|
+
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
.conteneurLargeur {
|
|
23
|
+
background-color: rgb(var(--v-theme-background));
|
|
24
|
+
margin-bottom: 0; /* mb-0 */
|
|
25
|
+
min-height: 100%;
|
|
26
|
+
padding-bottom: 0; /* pb-0 */
|
|
27
|
+
padding-left: 24px; /* px-6 */
|
|
28
|
+
padding-right: 24px; /* px-6 */
|
|
29
|
+
padding-top: 12px; /* pt-3 */
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
/* Quand la page utilise pleine largeur, le parent devient transparent */
|
|
33
|
+
.conteneurLargeur:has(.conteneurLargeurMax) {
|
|
34
|
+
background-color: transparent;
|
|
35
|
+
min-height: unset;
|
|
36
|
+
}
|
|
2
37
|
|
|
38
|
+
/* Contenu pleine largeur viewport, s'échappe du conteneurLargeur */
|
|
39
|
+
.conteneurLargeurMax {
|
|
40
|
+
background-color: rgb(var(--v-theme-background));
|
|
41
|
+
margin-left: calc(50% - 50vw);
|
|
42
|
+
margin-right: calc(50% - 50vw);
|
|
43
|
+
min-height: 100vh;
|
|
44
|
+
padding-left: 24px; /* px-6 */
|
|
45
|
+
padding-right: 24px; /* px-6 */
|
|
46
|
+
padding-top: 12px; /* pt-3 */
|
|
47
|
+
width: 100vw;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
/* csqcEntete pleine largeur viewport — contenu centré et limité via .v-toolbar__content */
|
|
51
|
+
.conteneurEntete {
|
|
52
|
+
margin-left: calc(50% - 50vw);
|
|
53
|
+
margin-right: calc(50% - 50vw);
|
|
54
|
+
width: 100vw;
|
|
55
|
+
}
|
|
56
|
+
.conteneurEntete .v-toolbar__content {
|
|
57
|
+
margin-inline: auto;
|
|
58
|
+
max-width: 1500px;
|
|
59
|
+
padding-inline: 32px;
|
|
60
|
+
}
|
|
61
|
+
.conteneurEntete .v-toolbar__content > div:last-child {
|
|
62
|
+
display: none;
|
|
63
|
+
}
|
|
3
64
|
/* titre design qc avec ligne orange*/
|
|
4
65
|
.headline {
|
|
5
|
-
color:
|
|
66
|
+
color: rgb(var(--v-theme-bleuFonce));
|
|
6
67
|
display: inline-block; /* largeur du texte */
|
|
7
68
|
font-weight: 600;
|
|
8
69
|
position: relative; /* pour positionner le ::after */
|
|
@@ -18,7 +79,7 @@
|
|
|
18
79
|
|
|
19
80
|
/* pour afficher une étoile après le label*/
|
|
20
81
|
.required:after {
|
|
21
|
-
color:
|
|
82
|
+
color: rgb(var(--v-theme-rouge));
|
|
22
83
|
content: ' *';
|
|
23
84
|
}
|
|
24
85
|
|
|
@@ -31,29 +92,29 @@
|
|
|
31
92
|
/*hauteur des boutons min... par défaut c'est 34*/
|
|
32
93
|
.BoutonCSQC {
|
|
33
94
|
border-radius: 4px;
|
|
34
|
-
min-height: 56px;
|
|
35
95
|
min-width: 112px !important;
|
|
36
96
|
}
|
|
37
97
|
|
|
38
98
|
.BoutonCSQCCompact {
|
|
39
99
|
border-radius: 4px;
|
|
40
|
-
min-height: 40px;
|
|
41
100
|
min-width: 80px !important;
|
|
42
101
|
}
|
|
43
102
|
|
|
44
103
|
.iconeHover:hover {
|
|
45
|
-
color:
|
|
104
|
+
color: rgb(var(--v-theme-primary));
|
|
46
105
|
}
|
|
47
106
|
|
|
48
107
|
/*goutière de 24px minimum entre les boutons compact*/
|
|
49
108
|
.v-application--is-ltr .v-card__actions > .v-btn.v-btn + .v-btn {
|
|
50
|
-
margin-left:
|
|
109
|
+
margin-left: 24px;
|
|
51
110
|
}
|
|
52
111
|
|
|
53
112
|
.Gouttiere {
|
|
54
|
-
margin-left:
|
|
113
|
+
margin-left: 24px;
|
|
114
|
+
}
|
|
115
|
+
.GouttiereStandard {
|
|
116
|
+
margin-left: 32px;
|
|
55
117
|
}
|
|
56
|
-
|
|
57
118
|
/*permet legend max width sans padding de container */
|
|
58
119
|
.maximumLargeur {
|
|
59
120
|
margin-left: auto;
|
|
@@ -66,12 +127,6 @@
|
|
|
66
127
|
cursor: pointer;
|
|
67
128
|
}
|
|
68
129
|
|
|
69
|
-
/*********************** Divers ********************/
|
|
70
|
-
.messageInfo {
|
|
71
|
-
font-size: smaller;
|
|
72
|
-
font-style: italic;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
130
|
/*********************** Overrride piv *******************/
|
|
76
131
|
@media screen and (min-width: 993px) {
|
|
77
132
|
#pivImage {
|
|
@@ -171,7 +226,7 @@ h6,
|
|
|
171
226
|
.h4,
|
|
172
227
|
.h5,
|
|
173
228
|
.h6 {
|
|
174
|
-
color:
|
|
229
|
+
color: rgb(var(--v-theme-bleuFonce));
|
|
175
230
|
font-style: normal;
|
|
176
231
|
font-weight: 600;
|
|
177
232
|
}
|
|
@@ -1,230 +1,236 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<v-app-bar
|
|
3
|
-
:color="barreCouleur"
|
|
4
|
-
class="px-0 mx-0"
|
|
5
|
-
:style="{
|
|
6
|
-
position: 'sticky',
|
|
7
|
-
width: '100%',
|
|
8
|
-
// variables CSS pour les couleurs dynamiques
|
|
9
|
-
'--entete-texte': texteCouleur,
|
|
10
|
-
'--entete-icone': iconeCouleur,
|
|
11
|
-
}"
|
|
12
|
-
height="auto"
|
|
13
|
-
>
|
|
14
|
-
<v-row
|
|
15
|
-
class="pt-2"
|
|
16
|
-
@resize="controlAffichage"
|
|
17
|
-
>
|
|
18
|
-
<v-col
|
|
19
|
-
:cols="titreCol"
|
|
20
|
-
class="pr-0 mr-0 pl-5"
|
|
21
|
-
>
|
|
22
|
-
<v-toolbar-title class="titre">
|
|
23
|
-
<div class="entete-ligne">
|
|
24
|
-
<!-- GAUCHE -->
|
|
25
|
-
<div class="entete-gauche">
|
|
26
|
-
<!-- Barre de retour -->
|
|
27
|
-
<slot name="retour">
|
|
28
|
-
<v-icon
|
|
29
|
-
v-if="retour"
|
|
30
|
-
size="large"
|
|
31
|
-
start
|
|
32
|
-
:color="iconeCouleur"
|
|
33
|
-
icon="mdi-arrow-left-thin"
|
|
34
|
-
@click="retournerMenu"
|
|
35
|
-
/>
|
|
36
|
-
</slot>
|
|
37
|
-
|
|
38
|
-
<div class="titre-bloc">
|
|
39
|
-
<slot name="titre">
|
|
40
|
-
<span class="pl-3 titre-texte">{{ props.titre }}</span>
|
|
41
|
-
</slot>
|
|
42
|
-
|
|
43
|
-
<slot name="etat">
|
|
44
|
-
<span
|
|
45
|
-
v-if="monEtat?.afficher"
|
|
46
|
-
class="pl-10"
|
|
47
|
-
>
|
|
48
|
-
<v-btn
|
|
49
|
-
size="small"
|
|
50
|
-
:color="monEtat.couleur"
|
|
51
|
-
variant="tonal"
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
</
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
interface
|
|
104
|
-
afficher: boolean
|
|
105
|
-
couleur: string
|
|
106
|
-
texte: string
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
)
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
}
|
|
161
|
-
.
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
.
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
.
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
width: 100%;
|
|
205
|
-
}
|
|
206
|
-
.
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
}
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
}
|
|
229
|
-
|
|
230
|
-
|
|
1
|
+
<template>
|
|
2
|
+
<v-app-bar
|
|
3
|
+
:color="barreCouleur"
|
|
4
|
+
class="px-0 mx-0"
|
|
5
|
+
:style="{
|
|
6
|
+
position: 'sticky',
|
|
7
|
+
width: '100%',
|
|
8
|
+
// variables CSS pour les couleurs dynamiques
|
|
9
|
+
'--entete-texte': texteCouleur,
|
|
10
|
+
'--entete-icone': iconeCouleur,
|
|
11
|
+
}"
|
|
12
|
+
height="auto"
|
|
13
|
+
>
|
|
14
|
+
<v-row
|
|
15
|
+
class="pt-2"
|
|
16
|
+
@resize="controlAffichage"
|
|
17
|
+
>
|
|
18
|
+
<v-col
|
|
19
|
+
:cols="titreCol"
|
|
20
|
+
class="pr-0 mr-0 pl-5"
|
|
21
|
+
>
|
|
22
|
+
<v-toolbar-title class="titre">
|
|
23
|
+
<div class="entete-ligne">
|
|
24
|
+
<!-- GAUCHE -->
|
|
25
|
+
<div class="entete-gauche">
|
|
26
|
+
<!-- Barre de retour -->
|
|
27
|
+
<slot name="retour">
|
|
28
|
+
<v-icon
|
|
29
|
+
v-if="retour"
|
|
30
|
+
size="large"
|
|
31
|
+
start
|
|
32
|
+
:color="iconeCouleur"
|
|
33
|
+
icon="mdi-arrow-left-thin"
|
|
34
|
+
@click="retournerMenu"
|
|
35
|
+
/>
|
|
36
|
+
</slot>
|
|
37
|
+
|
|
38
|
+
<div class="titre-bloc">
|
|
39
|
+
<slot name="titre">
|
|
40
|
+
<span class="pl-3 titre-texte">{{ props.titre }}</span>
|
|
41
|
+
</slot>
|
|
42
|
+
|
|
43
|
+
<slot name="etat">
|
|
44
|
+
<span
|
|
45
|
+
v-if="monEtat?.afficher"
|
|
46
|
+
class="pl-10"
|
|
47
|
+
>
|
|
48
|
+
<v-btn
|
|
49
|
+
size="small"
|
|
50
|
+
:color="monEtat.couleur"
|
|
51
|
+
variant="tonal"
|
|
52
|
+
density="default"
|
|
53
|
+
min-width="100px"
|
|
54
|
+
:style="'font-size:.75rem;letter-spacing: .0892857em; text-transform: uppercase; font-weight: 500; line-height: normal;'"
|
|
55
|
+
>
|
|
56
|
+
{{ monEtat.texte }}
|
|
57
|
+
</v-btn>
|
|
58
|
+
</span>
|
|
59
|
+
</slot>
|
|
60
|
+
|
|
61
|
+
<slot name="etatSecondaire">
|
|
62
|
+
<span
|
|
63
|
+
v-if="monEtatSecondaire?.afficher"
|
|
64
|
+
class="pl-3"
|
|
65
|
+
>
|
|
66
|
+
<v-btn
|
|
67
|
+
size="small"
|
|
68
|
+
:color="monEtatSecondaire.couleur"
|
|
69
|
+
variant="tonal"
|
|
70
|
+
density="default"
|
|
71
|
+
min-width="100px"
|
|
72
|
+
:style="'font-size:.75rem;letter-spacing: .0892857em; text-transform: uppercase; font-weight: 500; line-height: normal;'"
|
|
73
|
+
>
|
|
74
|
+
{{ monEtatSecondaire.texte }}
|
|
75
|
+
</v-btn>
|
|
76
|
+
</span>
|
|
77
|
+
</slot>
|
|
78
|
+
|
|
79
|
+
<slot name="soustitre">
|
|
80
|
+
<span class="pl-3 soustitre-texte">{{ props.soustitre }}</span>
|
|
81
|
+
</slot>
|
|
82
|
+
</div>
|
|
83
|
+
</div>
|
|
84
|
+
|
|
85
|
+
<!-- DROITE -->
|
|
86
|
+
<div class="entete-droite mr-1">
|
|
87
|
+
<slot name="droite" />
|
|
88
|
+
</div>
|
|
89
|
+
</div>
|
|
90
|
+
</v-toolbar-title>
|
|
91
|
+
</v-col>
|
|
92
|
+
</v-row>
|
|
93
|
+
|
|
94
|
+
<!-- Barre en bas -->
|
|
95
|
+
<div style="background-color: #808a9d; bottom: 0; height: 2px; left: 0; position: absolute; right: 0" />
|
|
96
|
+
</v-app-bar>
|
|
97
|
+
</template>
|
|
98
|
+
|
|
99
|
+
<script setup lang="ts">
|
|
100
|
+
import { useRouter } from 'vue-router'
|
|
101
|
+
import { ref, computed } from 'vue'
|
|
102
|
+
|
|
103
|
+
interface EnteteEtat {
|
|
104
|
+
afficher: boolean
|
|
105
|
+
couleur: string
|
|
106
|
+
texte: string
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
interface EnteteEtatSecondaire {
|
|
110
|
+
afficher: boolean
|
|
111
|
+
couleur: string
|
|
112
|
+
texte: string
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
const router = useRouter()
|
|
116
|
+
|
|
117
|
+
const props = defineProps<{
|
|
118
|
+
titre: string
|
|
119
|
+
soustitre?: string
|
|
120
|
+
retour?: string
|
|
121
|
+
etat?: EnteteEtat
|
|
122
|
+
couleur?: string // couleur de la barre (Vuetify color/hex)
|
|
123
|
+
couleurTexte?: string
|
|
124
|
+
couleurIcone?: string
|
|
125
|
+
etatSecondaire?: EnteteEtatSecondaire
|
|
126
|
+
}>()
|
|
127
|
+
|
|
128
|
+
const titreCol = ref(12)
|
|
129
|
+
|
|
130
|
+
// Fallbacks (tes valeurs actuelles)
|
|
131
|
+
const barreCouleur = computed(() => props.couleur ?? 'white')
|
|
132
|
+
const texteCouleur = computed(() => props.couleurTexte ?? '#223654')
|
|
133
|
+
const iconeCouleur = computed(() => props.couleurIcone ?? 'grisMoyen') // peut être un nom de couleur Vuetify ou un hex
|
|
134
|
+
|
|
135
|
+
const monEtat = computed<EnteteEtat>(() => props.etat ?? { afficher: false, couleur: 'primary', texte: 'test' })
|
|
136
|
+
const monEtatSecondaire = computed<EnteteEtatSecondaire>(
|
|
137
|
+
() => props.etatSecondaire ?? { afficher: false, couleur: 'primary', texte: 'test' },
|
|
138
|
+
)
|
|
139
|
+
|
|
140
|
+
function retournerMenu() {
|
|
141
|
+
if (props.retour) router.push({ name: props.retour })
|
|
142
|
+
}
|
|
143
|
+
function controlAffichage() {
|
|
144
|
+
/* logique resize */
|
|
145
|
+
}
|
|
146
|
+
</script>
|
|
147
|
+
|
|
148
|
+
<style scoped>
|
|
149
|
+
.titre {
|
|
150
|
+
font-size: 1.85rem;
|
|
151
|
+
font-weight: bold;
|
|
152
|
+
margin-bottom: 15px;
|
|
153
|
+
}
|
|
154
|
+
.titre-texte {
|
|
155
|
+
color: var(--entete-texte, #223654);
|
|
156
|
+
max-width: 100%;
|
|
157
|
+
overflow: hidden;
|
|
158
|
+
text-overflow: ellipsis;
|
|
159
|
+
white-space: nowrap;
|
|
160
|
+
}
|
|
161
|
+
.soustitre-texte {
|
|
162
|
+
color: var(--entete-texte, #223654);
|
|
163
|
+
display: block;
|
|
164
|
+
font-size: 1rem;
|
|
165
|
+
font-weight: normal;
|
|
166
|
+
}
|
|
167
|
+
.titre-bloc {
|
|
168
|
+
display: inline-block;
|
|
169
|
+
padding-left: 12px;
|
|
170
|
+
vertical-align: middle;
|
|
171
|
+
}
|
|
172
|
+
/* Couleur de l’icône (retour) + hover */
|
|
173
|
+
.v-icon {
|
|
174
|
+
color: var(--entete-icone, #6b7280); /* grisMoyen approx si hex */
|
|
175
|
+
}
|
|
176
|
+
.v-icon:hover {
|
|
177
|
+
filter: brightness(0.85);
|
|
178
|
+
}
|
|
179
|
+
.entete-ligne {
|
|
180
|
+
align-items: center;
|
|
181
|
+
display: flex;
|
|
182
|
+
flex-wrap: wrap;
|
|
183
|
+
gap: 8px;
|
|
184
|
+
width: 100%;
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
.entete-gauche {
|
|
188
|
+
align-items: center;
|
|
189
|
+
display: flex;
|
|
190
|
+
flex: 1;
|
|
191
|
+
min-width: 0; /* important pour éviter overflow */
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
.entete-droite {
|
|
195
|
+
align-items: center;
|
|
196
|
+
display: flex;
|
|
197
|
+
flex-shrink: 0;
|
|
198
|
+
gap: 12px;
|
|
199
|
+
padding-right: 16px;
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
@media (max-width: 600px) {
|
|
203
|
+
.entete-gauche {
|
|
204
|
+
width: 100%;
|
|
205
|
+
}
|
|
206
|
+
.entete-droite {
|
|
207
|
+
justify-content: flex-end;
|
|
208
|
+
padding-left: 0;
|
|
209
|
+
padding-right: 8px;
|
|
210
|
+
width: 100%;
|
|
211
|
+
}
|
|
212
|
+
.titre {
|
|
213
|
+
font-size: 1.2rem;
|
|
214
|
+
}
|
|
215
|
+
.titre-bloc {
|
|
216
|
+
align-items: flex-start;
|
|
217
|
+
display: flex;
|
|
218
|
+
flex-direction: column;
|
|
219
|
+
max-width: 100%;
|
|
220
|
+
min-width: 0;
|
|
221
|
+
padding-left: 4px;
|
|
222
|
+
}
|
|
223
|
+
.titre-texte {
|
|
224
|
+
max-width: 100%;
|
|
225
|
+
overflow: hidden;
|
|
226
|
+
text-overflow: ellipsis;
|
|
227
|
+
white-space: nowrap;
|
|
228
|
+
}
|
|
229
|
+
:deep(.v-col) {
|
|
230
|
+
padding-left: 8px !important;
|
|
231
|
+
}
|
|
232
|
+
:deep(.v-toolbar-title__placeholder) {
|
|
233
|
+
padding-inline-start: 0 !important;
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
</style>
|