Skip to content

Commit 1829b1d

Browse files
authored
Fix style regression (#787)
* Fix style regression * More button homogeneity
1 parent 1fd00aa commit 1829b1d

7 files changed

+78
-24
lines changed

src/style/BranchMenu.ts

+14-5
Original file line numberDiff line numberDiff line change
@@ -86,12 +86,21 @@ export const newBranchButtonClass = style({
8686
width: '7.7em',
8787
height: '2em',
8888

89-
color: 'var(--jp-ui-inverse-font-color1)',
89+
color: 'white',
9090
fontSize: 'var(--jp-ui-font-size1)',
9191

92-
backgroundColor: 'var(--jp-brand-color1)',
92+
backgroundColor: 'var(--md-blue-500)',
9393
border: '0',
94-
borderRadius: '3px'
94+
borderRadius: '3px',
95+
96+
$nest: {
97+
'&:hover': {
98+
backgroundColor: 'var(--md-blue-600)'
99+
},
100+
'&:active': {
101+
backgroundColor: 'var(--md-blue-700)'
102+
}
103+
}
95104
});
96105

97106
export const listItemClass = style({
@@ -101,13 +110,13 @@ export const listItemClass = style({
101110
});
102111

103112
export const activeListItemClass = style({
104-
color: 'var(--jp-ui-inverse-font-color1)!important',
113+
color: 'white!important',
105114

106115
backgroundColor: 'var(--jp-brand-color1)!important',
107116

108117
$nest: {
109118
'& .jp-icon-selectable[fill]': {
110-
fill: 'var(--jp-layout-color1)'
119+
fill: 'white'
111120
}
112121
}
113122
});

src/style/CommitBox.ts

+14-2
Original file line numberDiff line numberDiff line change
@@ -90,20 +90,32 @@ export const commitButtonClass = style({
9090

9191
marginBottom: '0.5em',
9292

93-
color: 'var(--jp-ui-inverse-font-color1)',
93+
color: 'white',
9494
fontSize: 'var(--jp-ui-font-size1)',
9595

9696
cursor: 'pointer',
9797

98-
backgroundColor: 'var(--jp-brand-color1)',
98+
backgroundColor: 'var(--md-blue-500)',
9999
border: '0',
100100
borderRadius: '3px',
101101

102102
$nest: {
103+
'&:hover': {
104+
backgroundColor: 'var(--md-blue-600)'
105+
},
106+
'&:active': {
107+
backgroundColor: 'var(--md-blue-700)'
108+
},
103109
'&:disabled': {
104110
cursor: 'default',
105111
color: 'var(--jp-ui-inverse-font-color0)',
106112
backgroundColor: 'var(--jp-layout-color3)'
113+
},
114+
'&:disabled:hover': {
115+
backgroundColor: 'var(--jp-layout-color3)'
116+
},
117+
'&:disabled:active': {
118+
backgroundColor: 'var(--jp-layout-color3)'
107119
}
108120
}
109121
});

src/style/FileItemStyle.ts

+6-6
Original file line numberDiff line numberDiff line change
@@ -22,22 +22,22 @@ export const fileStyle = style(
2222
);
2323

2424
export const selectedFileStyle = style({
25-
color: 'var(--jp-ui-inverse-font-color1)',
25+
color: 'white',
2626
background: 'var(--jp-brand-color1)',
2727

2828
$nest: {
2929
'&:hover': {
30-
color: 'var(--jp-ui-inverse-font-color1)',
30+
color: 'white',
3131
background: 'var(--jp-brand-color1) !important'
3232
},
3333
'&:hover .jp-icon-selectable[fill]': {
34-
fill: 'var(--jp-layout-color2)'
34+
fill: 'white'
3535
},
3636
'&:hover .jp-icon-selectable[stroke]': {
37-
stroke: 'var(--jp-layout-color2)'
37+
stroke: 'white'
3838
},
3939
'& .jp-icon-selectable[fill]': {
40-
fill: 'var(--jp-layout-color1)'
40+
fill: 'white'
4141
},
4242
'& .jp-icon-selectable-inverse[fill]': {
4343
fill: 'var(--jp-brand-color1)'
@@ -51,7 +51,7 @@ export const fileChangedLabelStyle = style({
5151
});
5252

5353
export const selectedFileChangedLabelStyle = style({
54-
color: 'var(--jp-ui-inverse-font-color1) !important'
54+
color: 'white !important'
5555
});
5656

5757
export const fileChangedLabelBrandStyle = style({

src/style/GitPanel.ts

+12-4
Original file line numberDiff line numberDiff line change
@@ -21,13 +21,21 @@ export const repoButtonClass = style({
2121
height: '2em',
2222
width: '12em',
2323
marginTop: '5px',
24+
border: '0',
25+
borderRadius: '3px',
2426

25-
color: 'var(--jp-ui-inverse-font-color1)',
27+
color: 'white',
2628
fontSize: 'var(--jp-ui-font-size1)',
2729

28-
backgroundColor: 'var(--jp-brand-color1)',
29-
border: '0',
30-
borderRadius: '3px'
30+
backgroundColor: 'var(--md-blue-500)',
31+
$nest: {
32+
'&:hover': {
33+
backgroundColor: 'var(--md-blue-600)'
34+
},
35+
'&:active': {
36+
backgroundColor: 'var(--md-blue-700)'
37+
}
38+
}
3139
});
3240

3341
export const tabsClass = style({

src/style/NewBranchDialog.ts

+17-4
Original file line numberDiff line numberDiff line change
@@ -191,13 +191,13 @@ export const listItemClass = style({
191191
});
192192

193193
export const activeListItemClass = style({
194-
color: 'var(--jp-ui-inverse-font-color1)!important',
194+
color: 'white!important',
195195

196196
backgroundColor: 'var(--jp-brand-color1)!important',
197197

198198
$nest: {
199199
'& .jp-icon-selectable[fill]': {
200-
fill: 'var(--jp-layout-color1)'
200+
fill: 'white'
201201
}
202202
}
203203
});
@@ -245,7 +245,7 @@ export const buttonClass = style({
245245
width: '9em',
246246
height: '2em',
247247

248-
color: 'var(--jp-ui-inverse-font-color1)',
248+
color: 'white',
249249
fontSize: 'var(--jp-ui-font-size1)',
250250

251251
border: '0',
@@ -266,12 +266,25 @@ export const cancelButtonClass = style({
266266
});
267267

268268
export const createButtonClass = style({
269-
backgroundColor: 'var(--jp-brand-color1)',
269+
backgroundColor: 'var(--md-blue-500)',
270+
270271
$nest: {
272+
'&:hover': {
273+
backgroundColor: 'var(--md-blue-600)'
274+
},
275+
'&:active': {
276+
backgroundColor: 'var(--md-blue-700)'
277+
},
271278
'&:disabled': {
272279
cursor: 'default',
273280
color: 'var(--jp-ui-inverse-font-color0)',
274281
backgroundColor: 'var(--jp-layout-color3)'
282+
},
283+
'&:disabled:hover': {
284+
backgroundColor: 'var(--jp-layout-color3)'
285+
},
286+
'&:disabled:active': {
287+
backgroundColor: 'var(--jp-layout-color3)'
275288
}
276289
}
277290
});

src/style/ResetRevertDialog.ts

+14-2
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ export const buttonClass = style({
7474
width: '9em',
7575
height: '2em',
7676

77-
color: 'var(--jp-ui-inverse-font-color1)',
77+
color: 'white',
7878
fontSize: 'var(--jp-ui-font-size1)',
7979

8080
cursor: 'pointer',
@@ -103,12 +103,24 @@ export const cancelButtonClass = style({
103103
});
104104

105105
export const submitButtonClass = style({
106-
backgroundColor: 'var(--jp-brand-color1)',
106+
backgroundColor: 'var(--md-blue-500)',
107107

108108
$nest: {
109+
'&:hover': {
110+
backgroundColor: 'var(--md-blue-600)'
111+
},
112+
'&:active': {
113+
backgroundColor: 'var(--md-blue-700)'
114+
},
109115
'&:disabled': {
110116
color: 'var(--jp-ui-inverse-font-color0)',
111117
backgroundColor: 'var(--jp-layout-color3)'
118+
},
119+
'&:disabled:hover': {
120+
backgroundColor: 'var(--jp-layout-color3)'
121+
},
122+
'&:disabled:active': {
123+
backgroundColor: 'var(--jp-layout-color3)'
112124
}
113125
}
114126
});

src/style/SinglePastCommitInfo.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ export const insertionsIconClass = style({
7171
export const deletionsIconClass = style({
7272
$nest: {
7373
'.jp-icon3': {
74-
fill: '--var(--md-red-500)'
74+
fill: 'var(--md-red-500)'
7575
}
7676
}
7777
});

0 commit comments

Comments
 (0)