Mercurial > libervia-templates
annotate sat_templates/templates/bulma/static/styles.css @ 270:2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
author | Goffi <goffi@goffi.org> |
---|---|
date | Fri, 14 Aug 2020 08:46:00 +0200 |
parents | 23180988ee6b |
children | dea66eead698 |
rev | line source |
---|---|
230 | 1 :root { |
2 --photo-height: 280px; | |
3 --photo-height--poster: 500px; | |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
4 --col-primary: #82baff; |
248
a841837afe78
css (bulma): use a variable for grey light
Goffi <goffi@goffi.org>
parents:
242
diff
changeset
|
5 --grey-light: hsl(0, 0%, 71%); |
230 | 6 } |
7 | |
235
f5f428a50c10
chat, ticket: use `pre-wrap` instead of `pre` for whitespaces
Goffi <goffi@goffi.org>
parents:
230
diff
changeset
|
8 .has-whitespace-pre-wrap { |
f5f428a50c10
chat, ticket: use `pre-wrap` instead of `pre` for whitespaces
Goffi <goffi@goffi.org>
parents:
230
diff
changeset
|
9 white-space: pre-wrap; |
230 | 10 } |
11 | |
12 .is-avatar { | |
13 height: 64px; | |
14 width: 64px; | |
15 border-radius: 50%; | |
16 border: 1px solid #bbb; | |
17 background-color: #eee; | |
18 overflow: hidden; | |
19 } | |
20 | |
21 .is-photo-thumbnail { | |
22 max-height: var(--photo-height); | |
23 max-width: 100%; | |
24 } | |
25 | |
26 .is-photo-thumbnail-container { | |
27 height: var(--photo-height); | |
28 } | |
29 | |
30 .has-items-centered { | |
31 align-items: center; | |
32 justify-content: center; | |
33 } | |
34 | |
35 .is-poster { | |
36 height: var(--photo-height--poster) !important; | |
37 } | |
38 | |
39 .is-poster>.is-photo-thumbnail { | |
40 max-height: var(--photo-height--poster) !important; | |
41 } | |
42 | |
43 .has-items-vcentered { | |
44 align-items: center; | |
45 } | |
46 | |
47 | |
48 .x-is-hoverable:hover { | |
49 background-color: #eee !important; | |
50 } | |
51 | |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
52 .x-is-hoverable-primary:hover { |
253 | 53 background-color: var(--col-primary) !important; |
54 border-radius: 50%; | |
55 box-shadow: 0px 0px 0 0.25rem var(--col-primary); | |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
56 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
57 |
230 | 58 .is-chat-message { |
59 margin: 0.5rem 0 0 !important; | |
60 padding: 0 !important; | |
61 border: 0 !important; | |
62 } | |
63 | |
64 a.is-wrapping { | |
65 line-height: 0; | |
66 } | |
67 | |
68 .has-no-background { | |
253 | 69 box-shadow: none !important; |
230 | 70 background-color: initial !important; |
71 } | |
72 | |
73 .pagination-disabled { | |
74 background-color: white; | |
75 border-color: #dbdbdb; | |
76 color: #b5b5b5; | |
77 cursor: auto; | |
78 } | |
79 | |
80 .pagination-disabled:hover { | |
81 background-color: white; | |
82 border-color: #dbdbdb; | |
83 color: #b5b5b5; | |
84 } | |
85 | |
86 .has-text-shortenable { | |
87 overflow: hidden; | |
88 text-overflow: ellipsis; | |
89 } | |
90 | |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
91 .has-border-dashed { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
92 border-style: dashed; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
93 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
94 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
95 .has-border-grey-light { |
248
a841837afe78
css (bulma): use a variable for grey light
Goffi <goffi@goffi.org>
parents:
242
diff
changeset
|
96 border-color: var(--grey-light); |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
97 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
98 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
99 .has-justify-start { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
100 justify-content: start; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
101 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
102 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
103 /************** |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
104 * selections * |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
105 **************/ |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
106 |
254
8411a274448e
bulma (css): new `is-not-selectable` class
Goffi <goffi@goffi.org>
parents:
253
diff
changeset
|
107 .is-not-selectable { |
8411a274448e
bulma (css): new `is-not-selectable` class
Goffi <goffi@goffi.org>
parents:
253
diff
changeset
|
108 user-select: none; |
8411a274448e
bulma (css): new `is-not-selectable` class
Goffi <goffi@goffi.org>
parents:
253
diff
changeset
|
109 } |
8411a274448e
bulma (css): new `is-not-selectable` class
Goffi <goffi@goffi.org>
parents:
253
diff
changeset
|
110 |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
111 .selected_for_deletion { |
253 | 112 outline: solid red 0.25rem; |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
113 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
114 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
115 /*************** |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
116 * misc states * |
248
a841837afe78
css (bulma): use a variable for grey light
Goffi <goffi@goffi.org>
parents:
242
diff
changeset
|
117 ***************/ |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
118 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
119 .state_deleted { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
120 opacity: 0; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
121 transform: scale(0); |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
122 transition: opacity 0.5s ease-out, transform 0.5s ease-out; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
123 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
124 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
125 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
126 /*********** |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
127 * dialogs * |
248
a841837afe78
css (bulma): use a variable for grey light
Goffi <goffi@goffi.org>
parents:
242
diff
changeset
|
128 ***********/ |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
129 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
130 .modal-content { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
131 transform: scaleY(0); |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
132 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
133 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
134 div.state_appended .modal-content { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
135 transform: scaleY(1); |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
136 transition: transform 0.15s ease-in; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
137 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
138 |
252 | 139 .click_to_close { |
140 cursor: pointer; | |
141 } | |
142 | |
270
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
143 div.search_dialog.is-active>div.dropdown-menu { |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
144 display: none; |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
145 } |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
146 |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
147 div.search_dialog.open>div.dropdown-menu { |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
148 display: block; |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
149 } |
2378084522e1
bulma (dialogs): new `macros.html` with a search dialog
Goffi <goffi@goffi.org>
parents:
262
diff
changeset
|
150 |
252 | 151 /********** |
152 * panels * | |
153 **********/ | |
154 | |
155 .panel_wrapper { | |
156 position: absolute; | |
157 top: 0; | |
158 right: 0; | |
159 height: 100vh; | |
160 width: 100vw; | |
161 z-index: 150; | |
162 } | |
163 | |
260
caadb06854a0
bulma (invitation): invitation manager first draft
Goffi <goffi@goffi.org>
parents:
255
diff
changeset
|
164 .comments_side_panel, .invitation_manager_side_panel { |
253 | 165 position: absolute; |
166 top: 0; | |
167 right: 0; | |
168 height: 100vh; | |
169 width: 0; | |
252 | 170 max-width: 80%; |
253 | 171 z-index: 200; |
172 background: white; | |
173 transition: width 0.3s ease-out; | |
255
c8eb86b49cb5
bulma (css): fixed overflow in slideshow
Goffi <goffi@goffi.org>
parents:
254
diff
changeset
|
174 overflow: auto; |
c8eb86b49cb5
bulma (css): fixed overflow in slideshow
Goffi <goffi@goffi.org>
parents:
254
diff
changeset
|
175 color: black; |
252 | 176 } |
177 | |
260
caadb06854a0
bulma (invitation): invitation manager first draft
Goffi <goffi@goffi.org>
parents:
255
diff
changeset
|
178 .comments_side_panel.open, .invitation_manager_side_panel.open { |
253 | 179 width: 55rem; |
180 transition: width 0.3s ease-out; | |
252 | 181 } |
182 | |
183 /************* | |
184 * slideshow * | |
185 *************/ | |
186 | |
187 .slideshow { | |
188 position: absolute; | |
189 top: 0; | |
190 left: 0; | |
191 width: 100vw; | |
192 height: 100vh; | |
193 background-color: black; | |
194 color: white; | |
195 z-index: 100; | |
255
c8eb86b49cb5
bulma (css): fixed overflow in slideshow
Goffi <goffi@goffi.org>
parents:
254
diff
changeset
|
196 overflow: hidden; |
252 | 197 } |
198 | |
199 div.slideshow>button.delete { | |
200 z-index: 100; | |
201 background-color: var(--grey-light); | |
202 position: absolute; | |
203 top: 1rem; | |
204 right: 2rem; | |
205 } | |
206 | |
207 div.slideshow>div.click_to_comment { | |
208 z-index: 100; | |
209 position: absolute; | |
210 right: 1.7rem; | |
211 bottom: 2rem; | |
212 cursor: pointer; | |
213 } | |
214 | |
215 div.slideshow>div.comments__count { | |
216 z-index: 100; | |
217 position: absolute; | |
218 right: 1.7rem; | |
219 bottom: 0.5rem; | |
220 font-weight: bold; | |
221 } | |
222 | |
223 .swiper-slide { | |
224 display: flex; | |
225 align-items: center; | |
226 justify-content: center; | |
227 } | |
228 | |
229 .swiper-container { | |
230 height: 100%; | |
231 width: 100%; | |
232 } | |
233 | |
234 .swiper-button-prev { | |
253 | 235 left: 2.1rem !important; |
252 | 236 color: #f1f1f1 !important; |
237 } | |
238 | |
239 .swiper-button-next { | |
253 | 240 right: 2.1rem !important; |
252 | 241 color: #f1f1f1 !important; |
242 } | |
243 | |
244 .slide_img { | |
245 max-height: 100%; | |
246 max-width: 100%; | |
247 } | |
242
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
248 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
249 /*************** |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
250 * progression * |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
251 ***************/ |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
252 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
253 .progress_started img { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
254 filter: grayscale(100%); |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
255 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
256 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
257 .progress_finished img { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
258 filter: grayscale(0%); |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
259 transition: filter 1.5s ease-out; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
260 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
261 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
262 .progress_finished progress { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
263 height: 0; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
264 opacity: 0; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
265 transition: all 1.5s ease-out; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
266 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
267 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
268 .progress { |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
269 transition: width 5s ease; |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
270 } |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
271 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
272 |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
273 /********** |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
274 * drawer * |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
275 **********/ |
bb5193cef770
bulma (css): some styles to handle dynamic content + misc
Goffi <goffi@goffi.org>
parents:
235
diff
changeset
|
276 |
230 | 277 |
278 .panel-drawer { | |
279 /* A panel which is hidden by default but can be | |
280 opened when it's clicked */ | |
281 max-height: 0; | |
282 opacity: 0; | |
283 overflow: hidden; | |
284 transition: max-height 0.5s, opacity 0.5s; | |
285 } | |
286 | |
287 .panel-drawer.state_clicked { | |
288 opacity: 1; | |
289 } | |
290 | |
291 /******** | |
292 * code * | |
293 ********/ | |
294 | |
295 .highlight { | |
296 overflow: auto; | |
297 } | |
298 | |
299 /********** | |
300 * blocks * | |
301 **********/ | |
302 | |
303 .block_separator { | |
304 font-size: 1.4em; | |
305 display: flex; | |
306 margin: 1rem 0; | |
307 } | |
308 | |
309 .block_separator__label { | |
310 display: inline-block; | |
311 margin: 0 0.2em; | |
312 } | |
313 | |
314 .block_separator__line { | |
315 height: 1px; | |
316 background: #ccc; | |
317 flex: 1; | |
318 margin-top: 0.7em; | |
319 } | |
320 | |
321 /******** | |
322 * tabs * | |
260
caadb06854a0
bulma (invitation): invitation manager first draft
Goffi <goffi@goffi.org>
parents:
255
diff
changeset
|
323 ********/ |
230 | 324 |
325 #tab_guests { | |
326 overflow: auto; | |
327 } | |
328 | |
329 .tab__page { | |
330 display: None; | |
331 } | |
332 | |
333 .tab__page.state_clicked { | |
334 display: block; | |
335 } | |
262
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
336 |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
337 /********* |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
338 * icons * |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
339 *********/ |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
340 |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
341 .icon_animate_spin { |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
342 animation: spin 2s infinite linear; |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
343 display: inline-block; |
23180988ee6b
bulma (css): added `icon_animate_spin` class
Goffi <goffi@goffi.org>
parents:
260
diff
changeset
|
344 } |