diff options
Diffstat (limited to 'src/styles/title-bar.scss')
-rw-r--r-- | src/styles/title-bar.scss | 80 |
1 files changed, 80 insertions, 0 deletions
diff --git a/src/styles/title-bar.scss b/src/styles/title-bar.scss new file mode 100644 index 000000000..885eb94c4 --- /dev/null +++ b/src/styles/title-bar.scss | |||
@@ -0,0 +1,80 @@ | |||
1 | @import './config.scss'; | ||
2 | |||
3 | .theme__dark #electron-app-title-bar { | ||
4 | background: $dark-theme-gray-darker; | ||
5 | |||
6 | .toolbar-dropdown { | ||
7 | &.open > .toolbar-button > button { | ||
8 | background: $dark-theme-gray-light; | ||
9 | color: $dark-theme-gray-lightest; | ||
10 | } | ||
11 | |||
12 | &:not(.open) { | ||
13 | .menu-item .menu-label { opacity: 1; } | ||
14 | > .toolbar-button > button:hover { | ||
15 | background: $dark-theme-gray-darkest; | ||
16 | } | ||
17 | } | ||
18 | } | ||
19 | |||
20 | #app-menu-bar #foldout-container .foldout { | ||
21 | color: $dark-theme-gray-lightest; | ||
22 | |||
23 | .menu-pane { | ||
24 | background: $dark-theme-gray-light; | ||
25 | |||
26 | .menu-item { | ||
27 | .accelerator { | ||
28 | color: lighten($dark-theme-gray-light, 20%); | ||
29 | } | ||
30 | } | ||
31 | |||
32 | hr { | ||
33 | border-color: $dark-theme-gray-lighter; | ||
34 | } | ||
35 | } | ||
36 | } | ||
37 | |||
38 | .list .ReactVirtualized__Grid { | ||
39 | background: $dark-theme-gray-light; | ||
40 | } | ||
41 | } | ||
42 | |||
43 | #electron-app-title-bar { | ||
44 | background: $theme-gray-lightest; | ||
45 | border-bottom: 0; | ||
46 | box-shadow: 0 0 8px rgba(black, .1); | ||
47 | |||
48 | span { line-height: normal; } | ||
49 | |||
50 | div { height: auto; } | ||
51 | |||
52 | .toolbar-dropdown { | ||
53 | &.open { box-shadow: 0 0 8px rgba(black, 0.1); } | ||
54 | |||
55 | &:not(.open) { | ||
56 | .menu-item .menu-label { opacity: 1; } | ||
57 | > .toolbar-button > button:hover { background: $theme-brand-primary; } | ||
58 | } | ||
59 | } | ||
60 | |||
61 | .list-item { | ||
62 | .menu-item { | ||
63 | border-radius: $theme-border-radius-small; | ||
64 | margin: 4px; | ||
65 | } | ||
66 | |||
67 | &.selected, | ||
68 | &.selected:focus { | ||
69 | background: none; | ||
70 | |||
71 | .menu-item { background: $theme-brand-primary; } | ||
72 | } | ||
73 | } | ||
74 | |||
75 | .menu-pane { | ||
76 | border-bottom-left-radius: $theme-border-radius-small; | ||
77 | border-bottom-right-radius: $theme-border-radius-small; | ||
78 | box-shadow: 0 0 10px rgba(black, .5); | ||
79 | } | ||
80 | } | ||