users/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/spaces/spaces.js
a2c015245921f589bbd7cc787bfd092474a07992
· 1.1 KB · 50 lines
raw
| 1 | // Styles for /lib/components/{yabai|aerospace}/*.jsx components |
| 2 | import { spaceStyles } from "./space"; |
| 3 | import { spaceOptionsStyles } from "./space-options"; |
| 4 | |
| 5 | export const styles = /* css */ ` |
| 6 | .spaces { |
| 7 | flex: 0 0 auto; |
| 8 | display: flex; |
| 9 | align-items: stretch; |
| 10 | } |
| 11 | .simple-bar--no-bar-background .spaces { |
| 12 | padding: 4px 5px; |
| 13 | background-color: var(--background); |
| 14 | box-shadow: var(--light-shadow); |
| 15 | border-radius: var(--bar-radius); |
| 16 | } |
| 17 | .simple-bar--no-bar-background.simple-bar--no-shadow .spaces { |
| 18 | box-shadow: none; |
| 19 | } |
| 20 | .simple-bar--process-aligned-to-left .spaces { |
| 21 | margin-right: 4px; |
| 22 | } |
| 23 | .spaces__separator { |
| 24 | align-self: center; |
| 25 | flex: 0 0 5px; |
| 26 | width: 5px; |
| 27 | height: 5px; |
| 28 | margin: var(--item-outer-margin); |
| 29 | background-color: var(--foreground); |
| 30 | border-radius: 50%; |
| 31 | opacity: 0.35; |
| 32 | } |
| 33 | ${spaceStyles} |
| 34 | ${spaceOptionsStyles} |
| 35 | .spaces__add > svg { |
| 36 | width: 10px; |
| 37 | height: 10px; |
| 38 | fill: currentColor; |
| 39 | } |
| 40 | .spaces__end-separator { |
| 41 | align-self: center; |
| 42 | flex: 0 0 4px; |
| 43 | width: 4px; |
| 44 | height: 4px; |
| 45 | margin: var(--item-outer-margin); |
| 46 | background-color: var(--main-alt); |
| 47 | border-radius: 50%; |
| 48 | opacity: 0.35; |
| 49 | } |
| 50 | `; |