codevdesign 0.0.22 → 0.0.24
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 +262 -0
- package/composants/gabarit/csqcMenu.vue +10 -2
- package/package.json +1 -1
package/assets/csqc.css
ADDED
|
@@ -0,0 +1,262 @@
|
|
|
1
|
+
@charset "UTF-8";
|
|
2
|
+
|
|
3
|
+
/* titre design qc avec ligne orange*/
|
|
4
|
+
.headline {
|
|
5
|
+
color: #223654 !important;
|
|
6
|
+
font-weight: 600 !important;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
/* titre design qc avec ligne orange*/
|
|
10
|
+
.headline:after {
|
|
11
|
+
content: "";
|
|
12
|
+
display: block;
|
|
13
|
+
margin: 0 0 8px 0;
|
|
14
|
+
width: 2.8rem;
|
|
15
|
+
padding-top: 0.3rem;
|
|
16
|
+
border-bottom: 3px solid #f09686;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
/* pour afficher une étoile après le label*/
|
|
20
|
+
.required:after {
|
|
21
|
+
content: " *";
|
|
22
|
+
color: red;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
/* grosseur et poids des labels*/
|
|
26
|
+
.libelle {
|
|
27
|
+
font-weight: bold;
|
|
28
|
+
font-size: 0.9rem;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
/*hauteur des boutons min... par défaut c'est 34*/
|
|
33
|
+
.BoutonCSQC {
|
|
34
|
+
border-radius: 4px;
|
|
35
|
+
min-height: 56px;
|
|
36
|
+
min-width: 112px !important;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.BoutonCSQCCompact {
|
|
40
|
+
border-radius: 4px;
|
|
41
|
+
min-height: 40px;
|
|
42
|
+
min-width: 80px !important;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.iconeHover:hover {
|
|
46
|
+
color: #095797;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
/*goutière de 24px minimum entre les boutons compact*/
|
|
50
|
+
.v-application--is-ltr .v-card__actions>.v-btn.v-btn+.v-btn {
|
|
51
|
+
margin-left: 16px;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.Gouttiere {
|
|
55
|
+
margin-left: 16px;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
|
|
59
|
+
/*permet legend max width sans padding de container */
|
|
60
|
+
.maximumLargeur {
|
|
61
|
+
margin-right: auto;
|
|
62
|
+
margin-left: auto;
|
|
63
|
+
max-width: 1310px;
|
|
64
|
+
width: 100%;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.ajouterPointeur {
|
|
68
|
+
cursor: pointer;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
/*********************** Overrride piv *******************/
|
|
75
|
+
@media screen and (min-width: 993px) {
|
|
76
|
+
#pivImage {
|
|
77
|
+
max-height: none !important;
|
|
78
|
+
max-width: 256px !important;
|
|
79
|
+
width: auto !important;
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.hyphen_auto {
|
|
84
|
+
hyphens: auto;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.material-icons {
|
|
88
|
+
font-family: 'Material Icons';
|
|
89
|
+
font-weight: normal;
|
|
90
|
+
font-style: normal;
|
|
91
|
+
font-size: 24px;
|
|
92
|
+
line-height: 1;
|
|
93
|
+
letter-spacing: normal;
|
|
94
|
+
text-transform: none;
|
|
95
|
+
display: inline-block;
|
|
96
|
+
white-space: nowrap;
|
|
97
|
+
word-wrap: normal;
|
|
98
|
+
direction: ltr;
|
|
99
|
+
-moz-osx-font-smoothing: grayscale;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
html,
|
|
103
|
+
body {
|
|
104
|
+
padding: 0;
|
|
105
|
+
margin: 0;
|
|
106
|
+
width: 100%
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
/************************** PIV **************************/
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
#pivImage {
|
|
113
|
+
max-height: 2rem;
|
|
114
|
+
max-width: 10.175rem;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.imgImpression {
|
|
118
|
+
display: none;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
.visuallyHidden {
|
|
123
|
+
border: 0;
|
|
124
|
+
clip: rect(0 0 0 0);
|
|
125
|
+
height: 1px;
|
|
126
|
+
margin: -1px;
|
|
127
|
+
overflow: hidden;
|
|
128
|
+
padding: 0;
|
|
129
|
+
position: absolute;
|
|
130
|
+
width: 1px
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
.cacher {
|
|
134
|
+
display: none !important
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
.flex,
|
|
139
|
+
.d-flex {
|
|
140
|
+
display: -ms-flexbox !important;
|
|
141
|
+
display: -webkit-box !important;
|
|
142
|
+
display: flex !important
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.align-items-center {
|
|
146
|
+
-ms-flex-align: center !important;
|
|
147
|
+
-webkit-box-align: center !important;
|
|
148
|
+
align-items: center !important
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
.justify-content-end {
|
|
152
|
+
-ms-flex-pack: end !important;
|
|
153
|
+
-webkit-box-pack: end !important;
|
|
154
|
+
justify-content: flex-end !important
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
.justify-content-start {
|
|
158
|
+
-ms-flex-pack: start !important;
|
|
159
|
+
-webkit-box-pack: start !important;
|
|
160
|
+
justify-content: flex-start !important
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
|
|
164
|
+
/* Taille de police */
|
|
165
|
+
|
|
166
|
+
h1,
|
|
167
|
+
h2,
|
|
168
|
+
h3,
|
|
169
|
+
h4,
|
|
170
|
+
h5,
|
|
171
|
+
h6,
|
|
172
|
+
.h1,
|
|
173
|
+
.h2,
|
|
174
|
+
.h3,
|
|
175
|
+
.h4,
|
|
176
|
+
.h5,
|
|
177
|
+
.h6 {
|
|
178
|
+
color: #223654;
|
|
179
|
+
font-weight: 600;
|
|
180
|
+
font-style: normal;
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
h1,
|
|
184
|
+
.h1 {
|
|
185
|
+
font-size: 2.5rem;
|
|
186
|
+
font-weight: bold;
|
|
187
|
+
line-height: 2.7rem;
|
|
188
|
+
margin-top: 1.3rem;
|
|
189
|
+
margin-bottom: 2rem;
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
h2,
|
|
193
|
+
.h2 {
|
|
194
|
+
font-size: 2rem;
|
|
195
|
+
font-weight: bold;
|
|
196
|
+
padding-bottom: 0;
|
|
197
|
+
margin-bottom: 0.7rem;
|
|
198
|
+
margin-top: 2.5rem;
|
|
199
|
+
line-height: 2.3rem;
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
h3,
|
|
203
|
+
.h3 {
|
|
204
|
+
font-size: 1.8rem;
|
|
205
|
+
font-weight: 500;
|
|
206
|
+
margin-top: 1.3rem;
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
h3.results-topic {
|
|
210
|
+
margin-top: 1rem;
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
h3.results-topic a {
|
|
214
|
+
font-weight: normal;
|
|
215
|
+
font-size: 1.5rem;
|
|
216
|
+
text-decoration: none;
|
|
217
|
+
font-variant-caps: all-small-caps;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
h4,
|
|
221
|
+
.h4 {
|
|
222
|
+
font-size: 1.3125rem;
|
|
223
|
+
font-weight: bold;
|
|
224
|
+
margin-top: 1rem;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
h5,
|
|
228
|
+
.h5 {
|
|
229
|
+
font-size: 1.125rem;
|
|
230
|
+
font-weight: 500;
|
|
231
|
+
margin-top: 1rem;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
h6,
|
|
235
|
+
.h6 {
|
|
236
|
+
font-size: 1rem;
|
|
237
|
+
font-weight: bold;
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
/* Titre design québec */
|
|
241
|
+
|
|
242
|
+
h1:after,
|
|
243
|
+
h2.decorated:after {
|
|
244
|
+
content: "";
|
|
245
|
+
display: block;
|
|
246
|
+
margin: 0 0 12px 0;
|
|
247
|
+
width: 4.8rem;
|
|
248
|
+
padding-top: 0.4rem;
|
|
249
|
+
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
h3.decorated:after,
|
|
253
|
+
h4.decorated:after,
|
|
254
|
+
h5.decorated:after,
|
|
255
|
+
h6.decorated:after {
|
|
256
|
+
content: "";
|
|
257
|
+
display: block;
|
|
258
|
+
margin: 0 0 12px 0;
|
|
259
|
+
width: 3.4rem;
|
|
260
|
+
padding-top: 0.4rem;
|
|
261
|
+
border-bottom: 3px solid #f09686;
|
|
262
|
+
}
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
:to="item.path"
|
|
18
18
|
:active="item.path === route"
|
|
19
19
|
:active-color="'white'"
|
|
20
|
+
:style="'min-width: 100px;'"
|
|
20
21
|
>{{ item.title }}</v-btn
|
|
21
22
|
>
|
|
22
23
|
</div>
|
|
@@ -76,7 +77,10 @@
|
|
|
76
77
|
</v-toolbar-title>
|
|
77
78
|
</v-toolbar>
|
|
78
79
|
|
|
79
|
-
<v-navigation-drawer
|
|
80
|
+
<v-navigation-drawer
|
|
81
|
+
v-model="menu"
|
|
82
|
+
nav
|
|
83
|
+
>
|
|
80
84
|
<v-list>
|
|
81
85
|
<div
|
|
82
86
|
v-for="item in filtrerMenuItems"
|
|
@@ -180,7 +184,7 @@
|
|
|
180
184
|
/* desktop background de la barre de menu et hauteur */
|
|
181
185
|
.v-toolbar {
|
|
182
186
|
background-color: #223654;
|
|
183
|
-
height:
|
|
187
|
+
height: 64px;
|
|
184
188
|
}
|
|
185
189
|
|
|
186
190
|
/* desktop couleur du texte de la barre, marge du haut, padding */
|
|
@@ -240,4 +244,8 @@
|
|
|
240
244
|
.v-navigation-drawer {
|
|
241
245
|
top: 132px !important;
|
|
242
246
|
}
|
|
247
|
+
/* mobile drawer, Calcule la hauteur comme étant 100% moins 132px pour afficher le scroll */
|
|
248
|
+
:deep(.v-navigation-drawer__content) {
|
|
249
|
+
height: calc(100% - 132px);
|
|
250
|
+
}
|
|
243
251
|
</style>
|