X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fsass%2Finclude%2F_mixins.scss;h=10ab44f57a402d8d2c95c17ab4ee662572b7903e;hb=48586fe070c2a59e9febb62a7f41ebb384e1d20e;hp=e4c2dffa0f0e83794621bb9055ce9a5772b4967f;hpb=4572c3d0d92f5b1b79b34dbe2c7b6557a8a5b7e4;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index e4c2dffa0..10ab44f57 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss @@ -121,6 +121,7 @@ min-height: $button-height; padding-top: 0; padding-bottom: 0; + flex-wrap: nowrap; .input-group-text{ font-size: 14px; @@ -304,6 +305,14 @@ z-index: 100; } +@mixin responsive-width ($width) { + width: $width; + + @media screen and (max-width: $width) { + width: 100%; + } +} + @mixin peertube-select-container ($width) { padding: 0; margin: 0; @@ -720,6 +729,10 @@ &.secondary { background-color: pvar(--secondaryColor); } + + &.red { + background-color: lighten($color: #c54130, $amount: 10); + } } } @@ -807,75 +820,6 @@ } } -@mixin ng2-tags { - ::ng-deep { - .ng2-tag-input { - border: none !important; - } - - .ng2-tags-container { - display: flex; - align-items: center; - border: 1px solid #C6C6C6; - border-radius: 3px; - padding: 5px !important; - height: max-content; - - &:focus-within { - box-shadow: #{$focus-box-shadow-form} pvar(--mainColorLightest); - } - } - - tag-input-form { - input { - height: 30px !important; - font-size: 12px !important; - - background-color: pvar(--mainBackgroundColor) !important; - color: pvar(--mainForegroundColor) !important; - } - } - - tag { - background-color: $grey-background-color !important; - color: #000 !important; - border-radius: 3px !important; - font-size: 12px !important; - height: 30px !important; - line-height: 30px !important; - margin: 0 5px 0 0 !important; - cursor: default !important; - padding: 0 8px 0 10px !important; - - div { - height: 100% !important; - } - } - - delete-icon { - cursor: pointer !important; - height: auto !important; - vertical-align: middle !important; - padding-left: 6px !important; - - svg { - position: relative; - top: -1px; - height: auto !important; - vertical-align: middle !important; - - path { - fill: pvar(--greyForegroundColor) !important; - } - } - - &:hover { - transform: none !important; - } - } - } -} - @mixin divider($color: pvar(--submenuColor), $background: pvar(--mainBackgroundColor)) { width: 95%; border-top: .05rem solid $color;