Ohm-Management - Projektarbeit B-ME
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

dropdown.sass 1.9KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. $dropdown-content-background-color: $white !default
  2. $dropdown-content-arrow: $link !default
  3. $dropdown-content-offset: 4px !default
  4. $dropdown-content-radius: $radius !default
  5. $dropdown-content-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1) !default
  6. $dropdown-content-z: 20 !default
  7. $dropdown-item-color: $grey-dark !default
  8. $dropdown-item-hover-color: $black !default
  9. $dropdown-item-hover-background-color: $background !default
  10. $dropdown-item-active-color: $link-invert !default
  11. $dropdown-item-active-background-color: $link !default
  12. $dropdown-divider-background-color: $border !default
  13. .dropdown
  14. display: inline-flex
  15. position: relative
  16. vertical-align: top
  17. &.is-active,
  18. &.is-hoverable:hover
  19. .dropdown-menu
  20. display: block
  21. &.is-right
  22. .dropdown-menu
  23. left: auto
  24. right: 0
  25. &.is-up
  26. .dropdown-menu
  27. bottom: 100%
  28. padding-bottom: $dropdown-content-offset
  29. padding-top: initial
  30. top: auto
  31. .dropdown-menu
  32. display: none
  33. left: 0
  34. min-width: 12rem
  35. padding-top: $dropdown-content-offset
  36. position: absolute
  37. top: 100%
  38. z-index: $dropdown-content-z
  39. .dropdown-content
  40. background-color: $dropdown-content-background-color
  41. border-radius: $dropdown-content-radius
  42. box-shadow: $dropdown-content-shadow
  43. padding-bottom: 0.5rem
  44. padding-top: 0.5rem
  45. .dropdown-item
  46. color: $dropdown-item-color
  47. display: block
  48. font-size: 0.875rem
  49. line-height: 1.5
  50. padding: 0.375rem 1rem
  51. position: relative
  52. a.dropdown-item,
  53. button.dropdown-item
  54. padding-right: 3rem
  55. text-align: left
  56. white-space: nowrap
  57. width: 100%
  58. &:hover
  59. background-color: $dropdown-item-hover-background-color
  60. color: $dropdown-item-hover-color
  61. &.is-active
  62. background-color: $dropdown-item-active-background-color
  63. color: $dropdown-item-active-color
  64. .dropdown-divider
  65. background-color: $dropdown-divider-background-color
  66. border: none
  67. display: block
  68. height: 1px
  69. margin: 0.5rem 0