diff options
author | Rigel Kent <sendmemail@rigelk.eu> | 2020-07-15 11:17:03 +0200 |
---|---|---|
committer | Rigel Kent <par@rigelk.eu> | 2020-07-29 18:15:53 +0200 |
commit | bc99dfe54e093e69ba8fd06d36b36fbbda3f45de (patch) | |
tree | 2c13497b77928c2593310746e3ec33333e2b4d66 /client/src/sass | |
parent | 654a188f80fc1f089aa14837084664c908fe27d2 (diff) | |
download | PeerTube-bc99dfe54e093e69ba8fd06d36b36fbbda3f45de.tar.gz PeerTube-bc99dfe54e093e69ba8fd06d36b36fbbda3f45de.tar.zst PeerTube-bc99dfe54e093e69ba8fd06d36b36fbbda3f45de.zip |
variable columns for users list, more columns possible, badge display for statuses
Diffstat (limited to 'client/src/sass')
-rw-r--r-- | client/src/sass/include/_mixins.scss | 32 |
1 files changed, 15 insertions, 17 deletions
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index 2de5ce7f1..75fe2ab11 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss | |||
@@ -332,9 +332,7 @@ | |||
332 | 332 | ||
333 | select { | 333 | select { |
334 | padding: 0 35px 0 12px; | 334 | padding: 0 35px 0 12px; |
335 | width: calc(100% + 2px); | ||
336 | position: relative; | 335 | position: relative; |
337 | left: 1px; | ||
338 | border: 1px solid #C6C6C6; | 336 | border: 1px solid #C6C6C6; |
339 | background: transparent none; | 337 | background: transparent none; |
340 | appearance: none; | 338 | appearance: none; |
@@ -692,7 +690,21 @@ | |||
692 | overflow: hidden; | 690 | overflow: hidden; |
693 | font-size: 0.75rem; | 691 | font-size: 0.75rem; |
694 | border-radius: 0.25rem; | 692 | border-radius: 0.25rem; |
695 | color: gray; | 693 | isolation: isolate; |
694 | position: relative; | ||
695 | |||
696 | span { | ||
697 | position: absolute; | ||
698 | color: rgb(92, 92, 92); | ||
699 | top: -1px; | ||
700 | |||
701 | &:nth-of-type(1) { | ||
702 | left: .2rem; | ||
703 | } | ||
704 | &:nth-of-type(2) { | ||
705 | right: .2rem; | ||
706 | } | ||
707 | } | ||
696 | 708 | ||
697 | .progress-bar { | 709 | .progress-bar { |
698 | color: pvar(--mainBackgroundColor); | 710 | color: pvar(--mainBackgroundColor); |
@@ -703,25 +715,11 @@ | |||
703 | text-align: center; | 715 | text-align: center; |
704 | white-space: nowrap; | 716 | white-space: nowrap; |
705 | transition: width 0.6s ease; | 717 | transition: width 0.6s ease; |
706 | isolation: isolate; | ||
707 | |||
708 | &:after { | ||
709 | content: attr(valuenow-formatted); | ||
710 | position: absolute; | ||
711 | margin-left: .2rem; | ||
712 | mix-blend-mode: screen; | ||
713 | color: gray; | ||
714 | } | ||
715 | 718 | ||
716 | &.secondary { | 719 | &.secondary { |
717 | background-color: pvar(--secondaryColor); | 720 | background-color: pvar(--secondaryColor); |
718 | } | 721 | } |
719 | } | 722 | } |
720 | |||
721 | .progress-bar + span { | ||
722 | position: relative; | ||
723 | top: -1px; | ||
724 | } | ||
725 | } | 723 | } |
726 | 724 | ||
727 | @mixin breadcrumb { | 725 | @mixin breadcrumb { |