Fix classic select and ng select css inconsistency
This commit is contained in:
parent
a3d7aadb6d
commit
bffee1d538
7 changed files with 26 additions and 14 deletions
|
@ -20,6 +20,11 @@ input[type=text] {
|
|||
@include peertube-select-container(340px);
|
||||
}
|
||||
|
||||
my-select-channel {
|
||||
display: block;
|
||||
max-width: 340px;
|
||||
}
|
||||
|
||||
input[type=submit] {
|
||||
@include peertube-button;
|
||||
@include orange-button;
|
||||
|
|
|
@ -17,7 +17,7 @@ $width-size: 250px;
|
|||
align-items: center;
|
||||
|
||||
.upload-icon {
|
||||
@include apply-svg-color(#C6C6C6);
|
||||
@include apply-svg-color($input-border-color);
|
||||
|
||||
width: 90px;
|
||||
margin-bottom: 25px;
|
||||
|
|
|
@ -57,8 +57,8 @@ form {
|
|||
width: $markdown-icon-width;
|
||||
|
||||
svg {
|
||||
color: #C6C6C6;
|
||||
fill: #C6C6C6;
|
||||
color: $input-border-color;
|
||||
fill: $input-border-color;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
|
@ -67,7 +67,7 @@ form {
|
|||
&:active,
|
||||
&:hover {
|
||||
my-global-icon svg {
|
||||
background-color: #C6C6C6;
|
||||
background-color: $input-border-color;
|
||||
color: pvar(--mainBackgroundColor);
|
||||
fill: pvar(--mainBackgroundColor);
|
||||
}
|
||||
|
|
|
@ -4,7 +4,6 @@
|
|||
|
||||
$nav-preview-tab-height: 30px;
|
||||
$base-padding: 15px;
|
||||
$input-border-color: #C6C6C6;
|
||||
$input-border-radius: 3px;
|
||||
|
||||
@mixin in-small-view {
|
||||
|
|
|
@ -91,7 +91,7 @@
|
|||
width: $width;
|
||||
color: pvar(--inputForegroundColor);
|
||||
background-color: pvar(--inputBackgroundColor);
|
||||
border: 1px solid #C6C6C6;
|
||||
border: 1px solid $input-border-color;
|
||||
border-radius: 3px;
|
||||
font-size: 15px;
|
||||
|
||||
|
@ -150,7 +150,7 @@
|
|||
&.disabled {
|
||||
cursor: default;
|
||||
color: #fff;
|
||||
background-color: #C6C6C6;
|
||||
background-color: $input-border-color;
|
||||
}
|
||||
|
||||
my-global-icon {
|
||||
|
@ -180,7 +180,7 @@
|
|||
&.disabled {
|
||||
cursor: default;
|
||||
color: pvar(--mainColor);
|
||||
background-color: #C6C6C6;
|
||||
background-color: $input-border-color;
|
||||
}
|
||||
|
||||
my-global-icon {
|
||||
|
@ -396,10 +396,9 @@
|
|||
select {
|
||||
padding: 0 35px 0 12px;
|
||||
position: relative;
|
||||
border: 1px solid #C6C6C6;
|
||||
border: 1px solid $input-border-color;
|
||||
background: transparent none;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
height: $button-height;
|
||||
text-overflow: ellipsis;
|
||||
color: pvar(--mainForegroundColor);
|
||||
|
@ -460,7 +459,7 @@
|
|||
top: 0;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border: 1px solid #C6C6C6;
|
||||
border: 1px solid $input-border-color;
|
||||
border-radius: 100%;
|
||||
background: #fff;
|
||||
}
|
||||
|
@ -507,7 +506,7 @@
|
|||
width: 18px;
|
||||
min-width: 18px;
|
||||
height: 18px;
|
||||
border: $border-width solid #C6C6C6;
|
||||
border: $border-width solid $input-border-color;
|
||||
border-radius: 3px;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
|
@ -670,7 +669,7 @@
|
|||
margin-bottom: 20px;
|
||||
|
||||
@if $separator {
|
||||
border-bottom: 1px solid #C6C6C6;
|
||||
border-bottom: 1px solid $input-border-color;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $small-view) {
|
||||
|
|
|
@ -84,6 +84,7 @@ $theater-bottom-space: 115px;
|
|||
$input-foreground-color: $fg-color;
|
||||
$input-background-color: $bg-color;
|
||||
$input-placeholder-color: #898989;
|
||||
$input-border-color: #C6C6C6;
|
||||
|
||||
$textarea-foreground-color: $fg-color;
|
||||
$textarea-background-color: $bg-color;
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
$ng-select-highlight: #f2690d;
|
||||
// $ng-select-primary-text: #333 !default;
|
||||
// $ng-select-disabled-text: #f9f9f9 !default;
|
||||
// $ng-select-border: #ccc !default;
|
||||
$ng-select-border: $input-border-color;
|
||||
// $ng-select-border-radius: 4px !default;
|
||||
// $ng-select-bg: #ffffff !default;
|
||||
// $ng-select-selected: lighten($ng-select-highlight, 46) !default;
|
||||
|
@ -46,6 +46,14 @@ $ng-select-value-font-size: 15px;
|
|||
@include padding-right(12px);
|
||||
}
|
||||
|
||||
.ng-arrow {
|
||||
border-color: #000 transparent transparent !important;
|
||||
}
|
||||
|
||||
&.ng-select-opened .ng-arrow {
|
||||
border-color: transparent transparent #000 !important;
|
||||
}
|
||||
|
||||
&.ng-select-single .ng-value-container .ng-value {
|
||||
color: pvar(--inputForegroundColor);
|
||||
|
||||
|
|
Loading…
Reference in a new issue