123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108 |
- .session
- width 100%
- display flex
- flex-direction column
- //flex-wrap wrap
- align-items stretch
- justify-content flex-start
- overflow auto
- padding-bottom 6px
- .device
- border-top 1px solid #303030
- border-left 1px solid #303030
- border-bottom 1px solid #101010
- border-right 1px solid #101010
- padding 6px 9px
- margin 6px 6px 0
- background rgba(32,32,32,0.95)
- flex-shrink 0
- &-header
- display flex
- flex-direction row
- justify-content space-between
- &-label
- background none
- border none
- border-bottom 1px dotted rgba(255,255,255,0.5)
- color white
- margin-bottom 3px
- font-size 14px
- &:hover, &:focus
- outline none
- background rgba(0,0,0,0.5)
- &-info, &-power
- display inline-block
- text-align center
- background #333
- line-height 18px
- vertical-align middle
- height 18px
- cursor pointer
- width 18px
- margin-left 6px
- &.active
- background #009b2a
- &-info
- font-size 16px
- &-icon
- display block
- &-dropdown
- cursor default
- font-size 11px
- z-index 2
- padding 6px 9px
- position absolute
- right -9px
- background #333
- box-shadow 0 3px 3px black
- display flex
- flex-direction column
- margin-top 7px
- border 1px solid black
- border-radius 3px
- &:before, &:after
- content ''
- position absolute
- bottom 100%
- right 8px
- height 9px
- width 0
- border-left 9px solid transparent
- border-right 9px solid transparent
- pointer-events none
- &:before
- border-bottom 9px solid black
- margin-bottom 1px
- &:after
- border-bottom 9px solid #333
- &-option
- width 100%
- display flex
- flex-direction row
- justify-content space-between
- &-label
- font-weight bold
- margin-right 9px
- &-value, &-button
- margin-left 9px
- &-button
- width 12px
- height 12px
- background #222
- margin-top 3px
|