change css classes to SASS placeholders
This commit is contained in:
parent
67a621c6c5
commit
0838e21674
@ -150,7 +150,7 @@ Button.audioBtn:last-of-type {
|
||||
}
|
||||
|
||||
.select {
|
||||
@extend .customSelectFocus;
|
||||
@extend %customSelectFocus;
|
||||
background-color: $color-white;
|
||||
border: 0;
|
||||
border-bottom: 0.1rem solid $color-text;
|
||||
|
@ -37,7 +37,7 @@ $btn-jumbo-padding: $jumbo-padding-y $jumbo-padding-x;
|
||||
* ==========
|
||||
*/
|
||||
.button {
|
||||
@extend .btnFocus;
|
||||
@extend %btnFocus;
|
||||
|
||||
font-weight: $btn-font-weight;
|
||||
line-height: 1.5;
|
||||
@ -75,7 +75,7 @@ $btn-jumbo-padding: $jumbo-padding-y $jumbo-padding-x;
|
||||
}
|
||||
|
||||
.buttonWrapper {
|
||||
@extend .btnFocus;
|
||||
@extend %btnFocus;
|
||||
|
||||
&,
|
||||
&:active {
|
||||
|
@ -42,7 +42,7 @@
|
||||
}
|
||||
|
||||
.input {
|
||||
@extend .customInputFocus;
|
||||
@extend %customInputFocus;
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
border: $border-size solid $color-gray-lighter;
|
||||
|
@ -18,7 +18,7 @@
|
||||
flex-shrink: 0;
|
||||
|
||||
a {
|
||||
@extend .customLinkFocus;
|
||||
@extend %customLinkFocus;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
@ -37,7 +37,7 @@
|
||||
}
|
||||
|
||||
.item {
|
||||
@extend .customListItemFocus;
|
||||
@extend %customListItemFocus;
|
||||
flex: 1 1 100%;
|
||||
padding: ($line-height-computed / 3) 0;
|
||||
display: flex;
|
||||
|
@ -53,7 +53,7 @@
|
||||
}
|
||||
|
||||
.select {
|
||||
@extend .customSelectFocus;
|
||||
@extend %customSelectFocus;
|
||||
background-color: #fff;
|
||||
border: $focus-border-size solid #fff;
|
||||
border-radius: $focus-border-size;
|
||||
@ -91,7 +91,7 @@
|
||||
}
|
||||
|
||||
.swatch {
|
||||
@extend .customSelectFocus;
|
||||
@extend %customSelectFocus;
|
||||
position: absolute;
|
||||
float: right;
|
||||
background: #fff;
|
||||
|
@ -1,7 +1,7 @@
|
||||
@import "../styles.scss";
|
||||
|
||||
.chatListItem {
|
||||
@extend .customChatItemFocus;
|
||||
@extend %customChatItemFocus;
|
||||
@extend %list-item;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
|
@ -7,5 +7,5 @@
|
||||
}
|
||||
|
||||
.scrollableList {
|
||||
@extend .customListFocus;
|
||||
@extend %customListFocus;
|
||||
}
|
@ -11,7 +11,7 @@
|
||||
|
||||
.scrollableList {
|
||||
@include scrollbox-vertical($user-list-bg);
|
||||
@extend .customListFocus;
|
||||
@extend %customListFocus;
|
||||
}
|
||||
|
||||
.separator {
|
||||
|
@ -66,7 +66,7 @@
|
||||
}
|
||||
|
||||
.userListItem {
|
||||
@extend .customUserItemFocus;
|
||||
@extend %customUserItemFocus;
|
||||
@extend %list-item;
|
||||
flex-flow: column;
|
||||
flex-shrink: 0;
|
||||
|
@ -5,7 +5,7 @@ $user-list-bg: #F3F6F9;
|
||||
$color-white: #FFF;
|
||||
$list-item-bg-hover: darken($user-list-bg, 7%);
|
||||
|
||||
.customListFocus {
|
||||
%customListFocus {
|
||||
border: $focus-border-size solid $user-list-bg;
|
||||
border-radius: $focus-border-size;
|
||||
|
||||
@ -15,8 +15,8 @@ $list-item-bg-hover: darken($user-list-bg, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
.customUserItemFocus,
|
||||
.customChatItemFocus {
|
||||
%customUserItemFocus,
|
||||
%customChatItemFocus {
|
||||
border: $focus-border-size solid $user-list-bg;
|
||||
border-radius: $focus-border-size;
|
||||
|
||||
@ -36,7 +36,7 @@ $list-item-bg-hover: darken($user-list-bg, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
.customListItemFocus {
|
||||
%customListItemFocus {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
border-right: $focus-border-size solid $color-white;
|
||||
@ -52,9 +52,9 @@ $list-item-bg-hover: darken($user-list-bg, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
.customInputFocus,
|
||||
.customSelectFocus,
|
||||
.customLinkFocus {
|
||||
%customInputFocus,
|
||||
%customSelectFocus,
|
||||
%customLinkFocus {
|
||||
border: $focus-border-size solid $color-white;
|
||||
|
||||
&,
|
||||
@ -67,7 +67,7 @@ $list-item-bg-hover: darken($user-list-bg, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
.btnFocus {
|
||||
%btnFocus {
|
||||
border: none;
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
|
Loading…
Reference in New Issue
Block a user