165 lines
3.1 KiB
Sass
165 lines
3.1 KiB
Sass
|
|
||
|
|
|
||
|
|
ul.sharing-users-list
|
||
|
|
list-style: none
|
||
|
|
margin: 0
|
||
|
|
padding: 0
|
||
|
|
|
||
|
|
li.sharing-users-item
|
||
|
|
padding: 10px 0
|
||
|
|
display: flex
|
||
|
|
align-items: center
|
||
|
|
cursor: default
|
||
|
|
|
||
|
|
&:hover
|
||
|
|
.sharing-users-action
|
||
|
|
visibility: visible
|
||
|
|
.sharing-users-details
|
||
|
|
.sharing-users-name
|
||
|
|
color: $color-text-dark-primary
|
||
|
|
|
||
|
|
&.active, &.added
|
||
|
|
color: $color-primary
|
||
|
|
.sharing-users-details
|
||
|
|
.sharing-users-name, .sharing-users-extra
|
||
|
|
color: $color-primary
|
||
|
|
.sharing-users-avatar
|
||
|
|
img
|
||
|
|
transform: scale(1.2)
|
||
|
|
|
||
|
|
&.added
|
||
|
|
.sharing-users-details
|
||
|
|
.sharing-users-name, .sharing-users-extra
|
||
|
|
color: $color-success
|
||
|
|
|
||
|
|
&.self
|
||
|
|
.sharing-users-details
|
||
|
|
.sharing-users-name
|
||
|
|
color: $color-info
|
||
|
|
.sharing-users-action
|
||
|
|
visibility: visible
|
||
|
|
.sharing-users-avatar img
|
||
|
|
border: 2px solid $color-info
|
||
|
|
|
||
|
|
.sharing-users-avatar
|
||
|
|
width: 15%
|
||
|
|
max-width: 60px
|
||
|
|
text-align: center
|
||
|
|
|
||
|
|
img
|
||
|
|
margin: 0 auto
|
||
|
|
width: 40px
|
||
|
|
height: 40px
|
||
|
|
border-radius: 50%
|
||
|
|
overflow: hidden
|
||
|
|
border: thin solid lighten($color-text-dark-hint, 10%)
|
||
|
|
transition: transform 350ms ease-in-out
|
||
|
|
|
||
|
|
.sharing-users-details
|
||
|
|
width: 85%
|
||
|
|
display: flex
|
||
|
|
flex-direction: column
|
||
|
|
|
||
|
|
.sharing-users-name
|
||
|
|
font:
|
||
|
|
size: 1.2em
|
||
|
|
weight: 400
|
||
|
|
color: $color-text-dark
|
||
|
|
transition: color 350ms ease-in-out
|
||
|
|
|
||
|
|
small
|
||
|
|
color: $color-text-dark-hint
|
||
|
|
|
||
|
|
.sharing-users-extra
|
||
|
|
font:
|
||
|
|
size: .9em
|
||
|
|
weight: 300
|
||
|
|
color: $color-text-dark-primary
|
||
|
|
transition: color 350ms ease-in-out
|
||
|
|
|
||
|
|
.sharing-users-action
|
||
|
|
visibility: hidden
|
||
|
|
span
|
||
|
|
font-size: .9em
|
||
|
|
color: $color-text-dark-hint
|
||
|
|
|
||
|
|
button
|
||
|
|
background: none
|
||
|
|
border: none
|
||
|
|
|
||
|
|
&.user-remove
|
||
|
|
color: $color-danger
|
||
|
|
|
||
|
|
&:hover
|
||
|
|
color: lighten($color-danger, 10%)
|
||
|
|
|
||
|
|
.sharing-users-intro,
|
||
|
|
.sharing-users-info
|
||
|
|
h4
|
||
|
|
margin: 0
|
||
|
|
font-family: $font-body
|
||
|
|
|
||
|
|
.sharing-users-info
|
||
|
|
padding-left: 15px
|
||
|
|
border-left: thin solid $color-text-dark-hint
|
||
|
|
|
||
|
|
+media-sm
|
||
|
|
margin-top: 25px
|
||
|
|
|
||
|
|
h4
|
||
|
|
padding-bottom: 10px
|
||
|
|
|
||
|
|
p
|
||
|
|
font:
|
||
|
|
size: 1.1em
|
||
|
|
weight: 300
|
||
|
|
|
||
|
|
.sharing-users-search
|
||
|
|
.disabled
|
||
|
|
color: $color-text-dark-secondary
|
||
|
|
padding-bottom: 10px
|
||
|
|
|
||
|
|
.algolia-autocomplete
|
||
|
|
position: relative
|
||
|
|
width: 100%
|
||
|
|
&:before
|
||
|
|
content: '\e81c'
|
||
|
|
font-family: 'pillar-font'
|
||
|
|
position: absolute
|
||
|
|
font-size: .9em
|
||
|
|
top: 7px
|
||
|
|
left: 15px
|
||
|
|
z-index: 1
|
||
|
|
color: $color-text-dark-secondary
|
||
|
|
|
||
|
|
.algolia-autocomplete .aa-input
|
||
|
|
padding-left: 35px
|
||
|
|
width: 100%
|
||
|
|
|
||
|
|
|
||
|
|
.algolia-autocomplete .aa-hint
|
||
|
|
width: 100%
|
||
|
|
color: $color-text-dark-hint
|
||
|
|
|
||
|
|
.algolia-autocomplete .aa-dropdown-menu
|
||
|
|
width: 100%
|
||
|
|
background-color: white
|
||
|
|
border: 1px solid $color-text-dark-hint
|
||
|
|
border-top: none
|
||
|
|
border-bottom-left-radius: 3px
|
||
|
|
border-bottom-right-radius: 3px
|
||
|
|
box-shadow: 0 15px 30px rgba(black, .1)
|
||
|
|
|
||
|
|
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion
|
||
|
|
cursor: pointer
|
||
|
|
padding: 5px 4px
|
||
|
|
|
||
|
|
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion.aa-cursor,
|
||
|
|
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion.aa-cursor em
|
||
|
|
background-color: $color-primary
|
||
|
|
color: white
|
||
|
|
|
||
|
|
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion em
|
||
|
|
font-style: normal
|
||
|
|
color: $color-primary
|