From 3caf77d3b11f2dbc12e52d665183d36604c1dab9 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 19 Jun 2019 14:55:58 +0200 Subject: Add language filters in user preferences --- client/src/sass/include/_mixins.scss | 26 ++++++++++++++----------- client/src/sass/primeng-custom.scss | 37 ++++++++++++++++++++++++++++++++++++ 2 files changed, 52 insertions(+), 11 deletions(-) (limited to 'client/src/sass') diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index f608e9299..caa79bf04 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss @@ -224,6 +224,20 @@ cursor: pointer; } +@mixin select-arrow-down { + top: 50%; + right: calc(0% + 15px); + content: " "; + height: 0; + width: 0; + position: absolute; + pointer-events: none; + border: 5px solid rgba(0, 0, 0, 0); + border-top-color: #000; + margin-top: -2px; + z-index: 100; +} + @mixin peertube-select-container ($width) { padding: 0; margin: 0; @@ -248,17 +262,7 @@ } &:after { - top: 50%; - right: calc(0% + 15px); - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; - border: 5px solid rgba(0, 0, 0, 0); - border-top-color: #000; - margin-top: -2px; - z-index: 100; + @include select-arrow-down; } select { diff --git a/client/src/sass/primeng-custom.scss b/client/src/sass/primeng-custom.scss index 957b99356..6c3100746 100644 --- a/client/src/sass/primeng-custom.scss +++ b/client/src/sass/primeng-custom.scss @@ -232,6 +232,43 @@ p-table { } } +// multiselect customizations +p-multiselect { + .ui-multiselect-label { + font-size: 15px !important; + padding: 4px 30px 4px 12px !important; + + $width: 338px; + width: $width !important; + + @media screen and (max-width: $width) { + width: 100% !important; + } + } + + .pi.pi-chevron-down{ + margin-left: 0 !important; + + &::after { + @include select-arrow-down; + + right: 0; + margin-top: 6px; + } + } + + .ui-chkbox-icon { + //position: absolute !important; + width: 18px; + height: 18px; + //left: 0; + + //&::after { + // left: -2px !important; + //} + } +} + // PrimeNG calendar tweaks p-calendar .ui-datepicker { a { -- cgit v1.2.3