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