_file-chooser.scss 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. /****************
  2. * File chooser *
  3. ****************/
  4. $_placesidebar_icons_opacity: 0.7;
  5. placessidebar {
  6. > viewport.frame { border-style: none; }
  7. row {
  8. // Needs overriding of the GtkListBoxRow padding
  9. min-height: 36px;
  10. padding: 0px;
  11. // Using margins/padding directly in the SidebarRow
  12. // will make the animation of the new bookmark row jump
  13. > revealer { padding: 0 14px; }
  14. &:selected { color: $selected_fg_color; }
  15. &:disabled { color: $insensitive_fg_color; }
  16. &:backdrop {
  17. color: $backdrop_fg_color;
  18. &:selected { color: $backdrop_selected_fg_color; }
  19. &:disabled { color: $backdrop_insensitive_color; }
  20. }
  21. image.sidebar-icon {
  22. opacity: $_placesidebar_icons_opacity; // dim the device icons
  23. &:dir(ltr) { padding-right: 8px; }
  24. &:dir(rtl) { padding-left: 8px; }
  25. }
  26. label.sidebar-label {
  27. &:dir(ltr) { padding-right: 2px; }
  28. &:dir(rtl) { padding-left: 2px; }
  29. }
  30. @at-root button.sidebar-button {
  31. @extend %button_basic.flat;
  32. @extend %button_selected.flat;
  33. min-height: 26px;
  34. min-width: 26px;
  35. margin-top: 3px;
  36. margin-bottom: 3px;
  37. padding: 0;
  38. border-radius: 100%;
  39. -gtk-outline-radius: 100%;
  40. &:not(:hover):not(:active),
  41. &:backdrop { > image { opacity: $_placesidebar_icons_opacity; }}
  42. }
  43. // in the sidebar case it makes no sense to click the selected row
  44. &:selected:active { box-shadow: none; }
  45. &.sidebar-placeholder-row {
  46. padding: 0 8px;
  47. min-height: 2px;
  48. background-image: image($drop_target_color);
  49. background-clip: content-box;
  50. }
  51. &.sidebar-new-bookmark-row { color: $selected_bg_color; }
  52. &:drop(active):not(:disabled) {
  53. color: $drop_target_color;
  54. box-shadow: inset 0 1px $drop_target_color,
  55. inset 0 -1px $drop_target_color;
  56. &:selected {
  57. color: $selected_fg_color;
  58. background-color: $drop_target_color;
  59. }
  60. }
  61. }
  62. }
  63. placesview {
  64. .server-list-button > image {
  65. transition: 200ms $ease-out-quad;
  66. -gtk-icon-transform: rotate(0turn);
  67. }
  68. .server-list-button:checked > image {
  69. transition: 200ms $ease-out-quad;
  70. -gtk-icon-transform: rotate(-0.5turn);
  71. }
  72. row.activatable:hover { background-color: transparent; }
  73. // this selects the "connect to server" label
  74. > actionbar > revealer > box > label {
  75. padding-left: 8px;
  76. padding-right: 8px;
  77. }
  78. }