|
|
|
@ -111,7 +111,7 @@ input {
@@ -111,7 +111,7 @@ input {
|
|
|
|
|
border: none; |
|
|
|
|
padding: .5rem; |
|
|
|
|
position: relative; |
|
|
|
|
overflow: hidden; |
|
|
|
|
/* overflow: hidden; */ |
|
|
|
|
|
|
|
|
|
/* kostil */ |
|
|
|
|
display: flex; |
|
|
|
@ -138,80 +138,80 @@ input {
@@ -138,80 +138,80 @@ input {
|
|
|
|
|
&.menu-open { |
|
|
|
|
background-color: rgba(112, 117, 121, 0.08); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.btn-menu { |
|
|
|
|
visibility: hidden; |
|
|
|
|
position: absolute; |
|
|
|
|
background: #fff; |
|
|
|
|
box-shadow: 0 5px 8px 1px rgba(0,0,0,.24); |
|
|
|
|
z-index: 3; |
|
|
|
|
top: 100%; |
|
|
|
|
margin-top: 8px; |
|
|
|
|
padding: 9px 0; |
|
|
|
|
border-radius: $border-radius; |
|
|
|
|
opacity: 0; |
|
|
|
|
transform: scale(.8); |
|
|
|
|
transition-property: opacity,transform,visibility; |
|
|
|
|
transition-duration: .2s; |
|
|
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); |
|
|
|
|
font-size: 16px; |
|
|
|
|
.btn-menu { |
|
|
|
|
visibility: hidden; |
|
|
|
|
position: absolute; |
|
|
|
|
background: #fff; |
|
|
|
|
box-shadow: 0 5px 8px 1px rgba(0,0,0,.24); |
|
|
|
|
z-index: 3; |
|
|
|
|
top: 100%; |
|
|
|
|
margin-top: 8px; |
|
|
|
|
padding: 9px 0; |
|
|
|
|
border-radius: $border-radius; |
|
|
|
|
opacity: 0; |
|
|
|
|
transform: scale(.8); |
|
|
|
|
transition-property: opacity,transform,visibility; |
|
|
|
|
transition-duration: .2s; |
|
|
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); |
|
|
|
|
font-size: 16px; |
|
|
|
|
|
|
|
|
|
&.active { |
|
|
|
|
visibility: visible; |
|
|
|
|
opacity: 1; |
|
|
|
|
transform: scale(1); |
|
|
|
|
} |
|
|
|
|
&.active { |
|
|
|
|
visibility: visible; |
|
|
|
|
opacity: 1; |
|
|
|
|
transform: scale(1); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&.bottom-left { |
|
|
|
|
right: 0; |
|
|
|
|
top: 100%; |
|
|
|
|
transform-origin: top right; |
|
|
|
|
} |
|
|
|
|
&.bottom-left { |
|
|
|
|
right: 0; |
|
|
|
|
top: 100%; |
|
|
|
|
transform-origin: top right; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&.bottom-right { |
|
|
|
|
left: 0; |
|
|
|
|
top: 100%; |
|
|
|
|
transform-origin: top left; |
|
|
|
|
} |
|
|
|
|
&.bottom-right { |
|
|
|
|
left: 0; |
|
|
|
|
top: 100%; |
|
|
|
|
transform-origin: top left; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
> div { |
|
|
|
|
display: flex; |
|
|
|
|
position: relative; |
|
|
|
|
padding: 0 40px 0 20px; |
|
|
|
|
height: 56px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
background-position: 16px center; |
|
|
|
|
background-size: 24px 24px; |
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
color: #000; |
|
|
|
|
text-transform: none; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
overflow: hidden; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
align-items: center; |
|
|
|
|
> div { |
|
|
|
|
display: flex; |
|
|
|
|
position: relative; |
|
|
|
|
padding: 0 40px 0 20px; |
|
|
|
|
height: 56px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
background-position: 16px center; |
|
|
|
|
background-size: 24px 24px; |
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
color: #000; |
|
|
|
|
text-transform: none; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
overflow: hidden; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
background-color: rgba(112, 117, 121, 0.06); |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
background-color: rgba(112, 117, 121, 0.06); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&:before { |
|
|
|
|
color: $color-gray; |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
margin-right: 35px; |
|
|
|
|
} |
|
|
|
|
&:before { |
|
|
|
|
color: $color-gray; |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
margin-right: 35px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&.danger:before { |
|
|
|
|
color: $color-error; |
|
|
|
|
} |
|
|
|
|
&.danger:before { |
|
|
|
|
color: $color-error; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.user-avatar { |
|
|
|
|
color: #fff; |
|
|
|
|
width: 52px; |
|
|
|
|
height: 52px; |
|
|
|
|
line-height: 52px; |
|
|
|
|
width: 54px; |
|
|
|
|
height: 54px; |
|
|
|
|
line-height: 54px; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
background-color: $button-primary-background; |
|
|
|
|
text-align: center; |
|
|
|
|