forked from treehouse/mastodon
Move columns-related CSS rules into the appropriate files
parent
b5927301cf
commit
dca05c79a9
|
@ -254,127 +254,6 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.column-settings__outer {
|
||||
background: lighten($ui-base-color, 8%);
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.column-settings__section {
|
||||
color: $darker-text-color;
|
||||
cursor: default;
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.column-settings__hashtags {
|
||||
.column-settings__row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.column-select {
|
||||
&__control {
|
||||
@include search-input();
|
||||
|
||||
&::placeholder {
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&::-moz-focus-inner,
|
||||
&:focus,
|
||||
&:active {
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
&__placeholder {
|
||||
color: $dark-text-color;
|
||||
padding-left: 2px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&__value-container {
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
||||
&__multi-value {
|
||||
background: lighten($ui-base-color, 8%);
|
||||
|
||||
&__remove {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
background: lighten($ui-base-color, 12%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__multi-value__label,
|
||||
&__input {
|
||||
color: $darker-text-color;
|
||||
}
|
||||
|
||||
&__clear-indicator,
|
||||
&__dropdown-indicator {
|
||||
cursor: pointer;
|
||||
transition: none;
|
||||
color: $dark-text-color;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: lighten($dark-text-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
&__indicator-separator {
|
||||
background-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
&__menu {
|
||||
@include search-popout();
|
||||
padding: 0;
|
||||
background: $ui-secondary-color;
|
||||
}
|
||||
|
||||
&__menu-list {
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
&__option {
|
||||
color: $inverted-text-color;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
|
||||
&--is-focused,
|
||||
&--is-selected {
|
||||
background: darken($ui-secondary-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.column-settings__row {
|
||||
.text-btn {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.relationship-tag {
|
||||
color: $primary-text-color;
|
||||
margin-bottom: 4px;
|
||||
|
|
|
@ -569,3 +569,124 @@
|
|||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.column-settings__outer {
|
||||
background: lighten($ui-base-color, 8%);
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.column-settings__section {
|
||||
color: $darker-text-color;
|
||||
cursor: default;
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.column-settings__hashtags {
|
||||
.column-settings__row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.column-select {
|
||||
&__control {
|
||||
@include search-input();
|
||||
|
||||
&::placeholder {
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&::-moz-focus-inner,
|
||||
&:focus,
|
||||
&:active {
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
&__placeholder {
|
||||
color: $dark-text-color;
|
||||
padding-left: 2px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&__value-container {
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
||||
&__multi-value {
|
||||
background: lighten($ui-base-color, 8%);
|
||||
|
||||
&__remove {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
background: lighten($ui-base-color, 12%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__multi-value__label,
|
||||
&__input {
|
||||
color: $darker-text-color;
|
||||
}
|
||||
|
||||
&__clear-indicator,
|
||||
&__dropdown-indicator {
|
||||
cursor: pointer;
|
||||
transition: none;
|
||||
color: $dark-text-color;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: lighten($dark-text-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
&__indicator-separator {
|
||||
background-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
&__menu {
|
||||
@include search-popout();
|
||||
padding: 0;
|
||||
background: $ui-secondary-color;
|
||||
}
|
||||
|
||||
&__menu-list {
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
&__option {
|
||||
color: $inverted-text-color;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
|
||||
&--is-focused,
|
||||
&--is-selected {
|
||||
background: darken($ui-secondary-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.column-settings__row {
|
||||
.text-btn {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue