105 lines
2.4 KiB
Sass
105 lines
2.4 KiB
Sass
.dropdown-container
|
|
position: relative
|
|
display: inline-block
|
|
.button.dropdown-trigger
|
|
padding-top: 4px
|
|
padding-bottom: 4px
|
|
margin-bottom: 0
|
|
cursor: pointer
|
|
.dropdown-trigger-icon
|
|
@extend .fa
|
|
@extend .fa-lg
|
|
@extend .fa-caret-left
|
|
margin-right: 6px
|
|
|
|
.dropdown-list-container
|
|
$border-size: 1px
|
|
$arrow-size: 7px
|
|
$border-color: #333
|
|
$background-color: white
|
|
$right-offset: 16px
|
|
display: none
|
|
text-align: left
|
|
background-color: $background-color
|
|
position: absolute
|
|
right: 0
|
|
margin: 0
|
|
min-width: 160px
|
|
z-index: 542
|
|
margin-top: 7px
|
|
border-radius: 4px
|
|
border: $border-size solid $border-color
|
|
box-shadow: 5px 5px 5px #888888
|
|
|
|
// Arrow
|
|
&:before, &:after
|
|
border: solid transparent
|
|
content: " "
|
|
height: 0
|
|
width: 0
|
|
position: absolute
|
|
pointer-events: none
|
|
bottom: 100%
|
|
&:after
|
|
border-width: $arrow-size
|
|
margin-left: -$arrow-size
|
|
border-bottom-color: $background-color
|
|
right: $right-offset + $border-size
|
|
&:before
|
|
border-bottom-color: $border-color
|
|
border-width: $arrow-size + $border-size
|
|
margin-left: -($arrow-size + $border-size)
|
|
right: $right-offset
|
|
|
|
ul
|
|
list-style: none
|
|
margin: 0
|
|
padding: 0
|
|
li
|
|
border-bottom: 1px solid #bbb
|
|
a
|
|
font-size: 0.8em
|
|
display: block
|
|
padding: 4px 7px
|
|
&:hover
|
|
background-color: #ddd
|
|
&.active
|
|
color: $current-color
|
|
background-color: #444
|
|
span.section-add-tables-icon
|
|
@extend .fa
|
|
@extend .fa-plus-square
|
|
span
|
|
padding-left: 7px
|
|
span.section-arrange-tables-icon
|
|
@extend .fa
|
|
@extend .fa-th
|
|
span
|
|
padding-left: 7px
|
|
span.section-remove-icon
|
|
@extend .fa, .fa-trash-o
|
|
span
|
|
padding-left: 7px
|
|
span.icon
|
|
span
|
|
// translation span
|
|
padding-left: 7px
|
|
span.sign-out-icon
|
|
@extend .fa, .fa-sign-out
|
|
span
|
|
padding-left: 7px
|
|
span.current-employee-my-account-icon
|
|
@extend .fa, .fa-user
|
|
span
|
|
padding-left: 7px
|
|
span.current-employee-my-schedule-icon
|
|
@extend .fa, .fa-calendar
|
|
span
|
|
padding-left: 7px
|
|
&.active
|
|
.dropdown-list-container
|
|
display: block
|
|
.button.dropdown-trigger
|
|
.dropdown-trigger-icon
|
|
@extend .fa-caret-down
|