Update projectBrowser styles

This commit is contained in:
Nate Butler 2022-04-29 01:35:58 -04:00
parent 67181a16c0
commit f4dbe4d976
9 changed files with 79 additions and 66 deletions

View file

@ -933,11 +933,13 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#8b8792", "icon_color": "#8b8792",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -948,19 +950,19 @@
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#58526052", "background": "#58526052",
"icon_color": "#8b8792", "icon_color": "#8b8792",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#8b8792", "color": "#e2dfe7",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#8b8792", "icon_color": "#8b8792",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#58526052", "background": "#58526052",
"icon_color": "#8b8792", "icon_color": "#8b8792",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#e2dfe7", "color": "#efecf4",
"size": 14 "size": 14
} }
} }

View file

@ -933,11 +933,13 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#585260", "icon_color": "#585260",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -948,19 +950,19 @@
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#8b87921f", "background": "#8b87921f",
"icon_color": "#585260", "icon_color": "#585260",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#585260", "color": "#26232a",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#585260", "icon_color": "#585260",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#8b87921f", "background": "#8b87921f",
"icon_color": "#585260", "icon_color": "#585260",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#26232a", "color": "#19171c",
"size": 14 "size": 14
} }
} }

View file

@ -933,34 +933,36 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#555555", "icon_color": "#555555",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#9c9c9c", "color": "#808080",
"size": 14 "size": 14
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#232323", "background": "#232323",
"icon_color": "#555555", "icon_color": "#555555",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#9c9c9c", "color": "#f1f1f1",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#555555", "icon_color": "#555555",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#232323", "background": "#232323",
"icon_color": "#555555", "icon_color": "#555555",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#f1f1f1", "color": "#ffffff",
"size": 14 "size": 14
} }
} }

View file

@ -933,34 +933,36 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#9c9c9c", "icon_color": "#9c9c9c",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#474747", "color": "#636363",
"size": 14 "size": 14
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#eaeaea", "background": "#eaeaea",
"icon_color": "#9c9c9c", "icon_color": "#9c9c9c",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#474747", "color": "#2b2b2b",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#9c9c9c", "icon_color": "#9c9c9c",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#eaeaea", "background": "#eaeaea",
"icon_color": "#9c9c9c", "icon_color": "#9c9c9c",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#2b2b2b", "color": "#000000",
"size": 14 "size": 14
} }
} }

View file

@ -933,11 +933,13 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#93a1a1", "icon_color": "#93a1a1",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -948,19 +950,19 @@
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#586e7552", "background": "#586e7552",
"icon_color": "#93a1a1", "icon_color": "#93a1a1",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#93a1a1", "color": "#eee8d5",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#93a1a1", "icon_color": "#93a1a1",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#586e7552", "background": "#586e7552",
"icon_color": "#93a1a1", "icon_color": "#93a1a1",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#eee8d5", "color": "#fdf6e3",
"size": 14 "size": 14
} }
} }

View file

@ -933,11 +933,13 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#586e75", "icon_color": "#586e75",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -948,19 +950,19 @@
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#93a1a11f", "background": "#93a1a11f",
"icon_color": "#586e75", "icon_color": "#586e75",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#586e75", "color": "#073642",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#586e75", "icon_color": "#586e75",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#93a1a11f", "background": "#93a1a11f",
"icon_color": "#586e75", "icon_color": "#586e75",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#073642", "color": "#002b36",
"size": 14 "size": 14
} }
} }

View file

@ -933,11 +933,13 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#979db4", "icon_color": "#979db4",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -948,19 +950,19 @@
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#5e668752", "background": "#5e668752",
"icon_color": "#979db4", "icon_color": "#979db4",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#979db4", "color": "#dfe2f1",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#979db4", "icon_color": "#979db4",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#5e668752", "background": "#5e668752",
"icon_color": "#979db4", "icon_color": "#979db4",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#dfe2f1", "color": "#f5f7ff",
"size": 14 "size": 14
} }
} }

View file

@ -933,11 +933,13 @@
}, },
"project_panel": { "project_panel": {
"padding": { "padding": {
"left": 12,
"right": 12,
"top": 6, "top": 6,
"left": 12 "bottom": 6
}, },
"entry": { "entry": {
"height": 22, "height": 24,
"icon_color": "#5e6687", "icon_color": "#5e6687",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -948,19 +950,19 @@
} }
}, },
"hovered_entry": { "hovered_entry": {
"height": 22, "height": 24,
"background": "#979db41f", "background": "#979db41f",
"icon_color": "#5e6687", "icon_color": "#5e6687",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#5e6687", "color": "#293256",
"size": 14 "size": 14
} }
}, },
"selected_entry": { "selected_entry": {
"height": 22, "height": 24,
"icon_color": "#5e6687", "icon_color": "#5e6687",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
@ -971,14 +973,14 @@
} }
}, },
"hovered_selected_entry": { "hovered_selected_entry": {
"height": 22, "height": 24,
"background": "#979db41f", "background": "#979db41f",
"icon_color": "#5e6687", "icon_color": "#5e6687",
"icon_size": 8, "icon_size": 8,
"icon_spacing": 8, "icon_spacing": 8,
"text": { "text": {
"family": "Zed Mono", "family": "Zed Mono",
"color": "#293256", "color": "#202746",
"size": 14 "size": 14
} }
} }

View file

@ -6,7 +6,7 @@ import { backgroundColor, iconColor, text, TextColor } from "./components";
export default function projectPanel(theme: Theme) { export default function projectPanel(theme: Theme) {
function entry(theme: Theme, textColor: TextColor, background?: Color) { function entry(theme: Theme, textColor: TextColor, background?: Color) {
return { return {
height: 22, height: 24,
background, background,
iconColor: iconColor(theme, "muted"), iconColor: iconColor(theme, "muted"),
iconSize: 8, iconSize: 8,
@ -17,21 +17,18 @@ export default function projectPanel(theme: Theme) {
return { return {
...panel, ...panel,
entry: entry(theme, "secondary"), entry: entry(theme, "muted"),
hoveredEntry: entry( hoveredEntry: entry(
theme, theme,
"secondary", "primary",
backgroundColor(theme, 300, "hovered") backgroundColor(theme, 300, "hovered")
), ),
selectedEntry: entry(theme, "primary"), selectedEntry: entry(theme, "primary"),
hoveredSelectedEntry: entry( hoveredSelectedEntry: entry(
theme, theme,
"primary", "active",
backgroundColor(theme, 300, "hovered") backgroundColor(theme, 300, "hovered")
), ),
padding: { padding: { left: 12, right: 12, top: 6, bottom: 6 },
top: 6,
left: 12,
},
}; };
} }