aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/sass')
-rw-r--r--client/src/sass/include/_mixins.scss11
-rw-r--r--client/src/sass/primeng-custom.scss61
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
307p-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
368p-calendar .ui-datepicker { 307p-calendar .ui-datepicker {
369 a { 308 a {