diff options
Diffstat (limited to 'client/src/sass')
-rw-r--r-- | client/src/sass/include/_mixins.scss | 11 | ||||
-rw-r--r-- | client/src/sass/primeng-custom.scss | 61 |
2 files changed, 11 insertions, 61 deletions
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index ae2b99a5b..e6491b492 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss | |||
@@ -304,6 +304,17 @@ | |||
304 | z-index: 100; | 304 | z-index: 100; |
305 | } | 305 | } |
306 | 306 | ||
307 | |||
308 | @mixin ng-select ($width) { | ||
309 | ::ng-deep ng-select { | ||
310 | width: $width; | ||
311 | |||
312 | @media screen and (max-width: $width) { | ||
313 | width: 100%; | ||
314 | } | ||
315 | } | ||
316 | } | ||
317 | |||
307 | @mixin peertube-select-container ($width) { | 318 | @mixin peertube-select-container ($width) { |
308 | padding: 0; | 319 | padding: 0; |
309 | margin: 0; | 320 | margin: 0; |
diff --git a/client/src/sass/primeng-custom.scss b/client/src/sass/primeng-custom.scss index bf49639f5..750c433b5 100644 --- a/client/src/sass/primeng-custom.scss +++ b/client/src/sass/primeng-custom.scss | |||
@@ -303,67 +303,6 @@ p-table { | |||
303 | } | 303 | } |
304 | } | 304 | } |
305 | 305 | ||
306 | // multiselect customizations | ||
307 | p-multiselect { | ||
308 | .ui-multiselect { | ||
309 | border-color: #C6C6C6; | ||
310 | |||
311 | &:not(.ui-state-disabled) { | ||
312 | &:hover { | ||
313 | border-color: #C6C6C6; | ||
314 | } | ||
315 | |||
316 | &:focus, | ||
317 | &.ui-state-focus { | ||
318 | box-shadow: #{$focus-box-shadow-form} pvar(--mainColorLightest); | ||
319 | } | ||
320 | } | ||
321 | } | ||
322 | |||
323 | .ui-multiselect-label { | ||
324 | font-size: 15px !important; | ||
325 | padding: 4px 30px 4px 12px !important; | ||
326 | |||
327 | $width: 338px; | ||
328 | width: $width !important; | ||
329 | |||
330 | @media screen and (max-width: $width) { | ||
331 | width: 100% !important; | ||
332 | } | ||
333 | } | ||
334 | |||
335 | .pi.pi-chevron-down { | ||
336 | margin-left: 0 !important; | ||
337 | |||
338 | &::after { | ||
339 | @include select-arrow-down; | ||
340 | |||
341 | right: 0; | ||
342 | margin-top: 6px; | ||
343 | } | ||
344 | } | ||
345 | |||
346 | .ui-chkbox-icon { | ||
347 | //position: absolute !important; | ||
348 | width: 18px; | ||
349 | height: 18px; | ||
350 | //left: 0; | ||
351 | |||
352 | //&::after { | ||
353 | // left: -2px !important; | ||
354 | //} | ||
355 | } | ||
356 | |||
357 | .ui-multiselect-panel .ui-multiselect-items .ui-multiselect-item.ui-state-highlight { | ||
358 | background-color: pvar(--mainColorLighter); | ||
359 | } | ||
360 | |||
361 | .ui-inputtext:enabled:focus:not(.ui-state-error) { | ||
362 | border-color: pvar(--mainColorLighter) !important; | ||
363 | box-shadow: none; | ||
364 | } | ||
365 | } | ||
366 | |||
367 | // PrimeNG calendar tweaks | 306 | // PrimeNG calendar tweaks |
368 | p-calendar .ui-datepicker { | 307 | p-calendar .ui-datepicker { |
369 | a { | 308 | a { |