_lists.scss 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. /*********
  2. * Lists *
  3. *********/
  4. list, listview {
  5. color: $text_color;
  6. background-color: $base_color;
  7. border-color: $borders_color;
  8. &:backdrop {
  9. background-color: $backdrop_base_color;
  10. border-color: $backdrop_borders_color;
  11. }
  12. &.horizontal row.separator,
  13. &.separators.horizontal > row:not(.separator) {
  14. border-left: 1px solid $borders_color;
  15. }
  16. &:not(.horizontal) row.separator,
  17. &.separators:not(.horizontal) > row:not(.separator) {
  18. border-bottom: 1px solid $borders_color;
  19. }
  20. }
  21. row {
  22. padding: 8px 14px;
  23. transition: all 150ms $ease-out-quad;
  24. label {
  25. padding-left: 8px;
  26. }
  27. &:hover { transition: none; }
  28. &:backdrop { transition: $backdrop_transition; }
  29. &.activatable {
  30. &.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411
  31. &:hover { background-color: if(variant == light, transparentize($fg_color, 0.9), transparentize($fg_color, 0.95)); }
  32. &:active { box-shadow: inset 0 2px 2px -2px transparentize(black, 0.8); }
  33. &:backdrop:hover { background-color: transparent; }
  34. &:selected {
  35. &:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
  36. &.has-open-popup,
  37. &:hover { background-color: transparentize($selected_bg_color, 0.2); }
  38. &:backdrop { background-color: $backdrop_selected_bg_color; }
  39. }
  40. }
  41. &:selected { @extend %selected_items; }
  42. }