mirror of
https://github.com/zed-industries/zed.git
synced 2024-10-25 07:55:56 +00:00
Refined dark theme styles
This commit is contained in:
Nate Butler
Keith Simmons
parent
c374fd2f54
commit
631d8d0344
8 changed files with 120 additions and 117 deletions
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"selector": {
|
||||
"background": "#000000",
|
||||
"background": "#1c1c1c",
|
||||
"corner_radius": 6,
|
||||
"padding": 8,
|
||||
"item": {
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
},
|
||||
"highlight_text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#72ad19",
|
||||
"color": "#1684b6",
|
||||
"weight": "bold",
|
||||
"size": 14
|
||||
}
|
||||
|
|
@ -33,19 +33,19 @@
|
|||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"highlight_text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#72ad19",
|
||||
"color": "#1684b6",
|
||||
"weight": "bold",
|
||||
"size": 14
|
||||
},
|
||||
"background": "#1c1c1c"
|
||||
"background": "#2b2b2b"
|
||||
},
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"empty": {
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
}
|
||||
},
|
||||
"input_editor": {
|
||||
"background": "#1c1c1c",
|
||||
"background": "#000000",
|
||||
"corner_radius": 6,
|
||||
"placeholder_text": {
|
||||
"family": "Zed Sans",
|
||||
|
|
@ -75,11 +75,11 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 16
|
||||
},
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#151515",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
|
|
@ -109,8 +109,8 @@
|
|||
"tab": {
|
||||
"height": 32,
|
||||
"background": "#1c1c1c",
|
||||
"icon_close": "#717171",
|
||||
"icon_close_active": "#f1f1f1",
|
||||
"icon_close": "#555555",
|
||||
"icon_close_active": "#ffffff",
|
||||
"icon_conflict": "#c38214",
|
||||
"icon_dirty": "#195cc8",
|
||||
"icon_width": 8,
|
||||
|
|
@ -121,7 +121,7 @@
|
|||
"size": 14
|
||||
},
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"left": true,
|
||||
"bottom": true,
|
||||
|
|
@ -135,8 +135,8 @@
|
|||
"active_tab": {
|
||||
"height": 32,
|
||||
"background": "#000000",
|
||||
"icon_close": "#717171",
|
||||
"icon_close_active": "#f1f1f1",
|
||||
"icon_close": "#555555",
|
||||
"icon_close_active": "#ffffff",
|
||||
"icon_conflict": "#c38214",
|
||||
"icon_dirty": "#195cc8",
|
||||
"icon_width": 8,
|
||||
|
|
@ -147,7 +147,7 @@
|
|||
"size": 14
|
||||
},
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"left": true,
|
||||
"bottom": false,
|
||||
|
|
@ -162,22 +162,22 @@
|
|||
"width": 30,
|
||||
"background": "#1c1c1c",
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"right": true
|
||||
},
|
||||
"item": {
|
||||
"height": 32,
|
||||
"icon_color": "#717171",
|
||||
"icon_color": "#9c9c9c",
|
||||
"icon_size": 18
|
||||
},
|
||||
"active_item": {
|
||||
"height": 32,
|
||||
"icon_color": "#f1f1f1",
|
||||
"icon_color": "#ffffff",
|
||||
"icon_size": 18
|
||||
},
|
||||
"resize_handle": {
|
||||
"background": "#0e0e0e",
|
||||
"background": "#070707",
|
||||
"padding": {
|
||||
"left": 1
|
||||
}
|
||||
|
|
@ -187,29 +187,29 @@
|
|||
"width": 30,
|
||||
"background": "#1c1c1c",
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"left": true
|
||||
},
|
||||
"item": {
|
||||
"height": 32,
|
||||
"icon_color": "#717171",
|
||||
"icon_color": "#9c9c9c",
|
||||
"icon_size": 18
|
||||
},
|
||||
"active_item": {
|
||||
"height": 32,
|
||||
"icon_color": "#f1f1f1",
|
||||
"icon_color": "#ffffff",
|
||||
"icon_size": 18
|
||||
},
|
||||
"resize_handle": {
|
||||
"background": "#0e0e0e",
|
||||
"background": "#070707",
|
||||
"padding": {
|
||||
"left": 1
|
||||
}
|
||||
}
|
||||
},
|
||||
"pane_divider": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"status_bar": {
|
||||
|
|
@ -238,12 +238,12 @@
|
|||
"titlebar": {
|
||||
"avatar_width": 18,
|
||||
"height": 32,
|
||||
"background": "#393939",
|
||||
"share_icon_color": "#717171",
|
||||
"share_icon_active_color": "#f1f1f1",
|
||||
"background": "#2b2b2b",
|
||||
"share_icon_color": "#9c9c9c",
|
||||
"share_icon_active_color": "#ffffff",
|
||||
"title": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"avatar": {
|
||||
|
|
@ -258,7 +258,7 @@
|
|||
"width": 12
|
||||
},
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"bottom": true
|
||||
},
|
||||
|
|
@ -281,7 +281,7 @@
|
|||
}
|
||||
},
|
||||
"offline_icon": {
|
||||
"color": "#717171",
|
||||
"color": "#9c9c9c",
|
||||
"width": 16,
|
||||
"padding": {
|
||||
"right": 4
|
||||
|
|
@ -297,7 +297,7 @@
|
|||
"height": 34,
|
||||
"background": "#000000",
|
||||
"border": {
|
||||
"color": "#2b2b2b",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"bottom": true
|
||||
},
|
||||
|
|
@ -325,10 +325,10 @@
|
|||
}
|
||||
},
|
||||
"editor": {
|
||||
"text_color": "#e3e3e3",
|
||||
"text_color": "#f1f1f1",
|
||||
"background": "#000000",
|
||||
"active_line_background": "#1c1c1c",
|
||||
"code_actions_indicator": "#717171",
|
||||
"active_line_background": "#0e0e0e",
|
||||
"code_actions_indicator": "#9c9c9c",
|
||||
"diff_background_deleted": "#d71c1c",
|
||||
"diff_background_inserted": "#1ea34f",
|
||||
"document_highlight_read_background": "#1e22db",
|
||||
|
|
@ -336,7 +336,7 @@
|
|||
"error_color": "#d71c1c",
|
||||
"gutter_background": "#000000",
|
||||
"gutter_padding_factor": 2.5,
|
||||
"highlighted_line_background": "#0e0e0e",
|
||||
"highlighted_line_background": "#070707",
|
||||
"line_number": "#636363",
|
||||
"line_number_active": "#ffffff",
|
||||
"rename_fade": 0.6,
|
||||
|
|
@ -380,7 +380,7 @@
|
|||
"corner_radius": 6,
|
||||
"padding": 6,
|
||||
"border": {
|
||||
"color": "#393939",
|
||||
"color": "#151515",
|
||||
"width": 1
|
||||
},
|
||||
"item": {
|
||||
|
|
@ -400,7 +400,7 @@
|
|||
"right": 6,
|
||||
"top": 2
|
||||
},
|
||||
"background": "#0e0e0e"
|
||||
"background": "#070707"
|
||||
},
|
||||
"margin": {
|
||||
"left": -14
|
||||
|
|
@ -417,7 +417,7 @@
|
|||
"right": 6,
|
||||
"top": 2
|
||||
},
|
||||
"background": "#1c1c1c"
|
||||
"background": "#0e0e0e"
|
||||
}
|
||||
},
|
||||
"diagnostic_header": {
|
||||
|
|
@ -425,7 +425,7 @@
|
|||
"icon_width_factor": 1.5,
|
||||
"text_scale_factor": 0.857,
|
||||
"border": {
|
||||
"color": "#393939",
|
||||
"color": "#151515",
|
||||
"width": 1,
|
||||
"bottom": true,
|
||||
"top": true
|
||||
|
|
@ -441,7 +441,7 @@
|
|||
"message": {
|
||||
"highlight_text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14,
|
||||
"weight": "bold"
|
||||
},
|
||||
|
|
@ -453,11 +453,11 @@
|
|||
}
|
||||
},
|
||||
"diagnostic_path_header": {
|
||||
"background": "#1c1c1c",
|
||||
"background": "#0e0e0e",
|
||||
"text_scale_factor": 0.857,
|
||||
"filename": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"path": {
|
||||
|
|
@ -473,7 +473,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -496,7 +496,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -519,7 +519,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -542,7 +542,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -565,7 +565,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -588,7 +588,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -611,7 +611,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -634,7 +634,7 @@
|
|||
"text_scale_factor": 0.857,
|
||||
"header": {
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1,
|
||||
"top": true
|
||||
}
|
||||
|
|
@ -661,7 +661,7 @@
|
|||
"tab_summary_spacing": 10,
|
||||
"empty_message": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"status_bar_item": {
|
||||
|
|
@ -691,7 +691,7 @@
|
|||
},
|
||||
"hovered_entry": {
|
||||
"height": 22,
|
||||
"background": "#1c1c1c",
|
||||
"background": "#232323",
|
||||
"icon_color": "#555555",
|
||||
"icon_size": 8,
|
||||
"icon_spacing": 8,
|
||||
|
|
@ -708,19 +708,19 @@
|
|||
"icon_spacing": 8,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
}
|
||||
},
|
||||
"hovered_selected_entry": {
|
||||
"height": 22,
|
||||
"background": "#1c1c1c",
|
||||
"background": "#232323",
|
||||
"icon_color": "#555555",
|
||||
"icon_size": 8,
|
||||
"icon_spacing": 8,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
}
|
||||
}
|
||||
|
|
@ -734,7 +734,7 @@
|
|||
},
|
||||
"channel_name": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"weight": "bold",
|
||||
"size": 14
|
||||
},
|
||||
|
|
@ -750,7 +750,7 @@
|
|||
"header": {
|
||||
"name": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"padding": {
|
||||
|
|
@ -799,13 +799,13 @@
|
|||
"right": 8
|
||||
}
|
||||
},
|
||||
"background": "#1c1c1c",
|
||||
"background": "#232323",
|
||||
"corner_radius": 6
|
||||
},
|
||||
"active_item": {
|
||||
"name": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"padding": 4,
|
||||
|
|
@ -822,7 +822,7 @@
|
|||
"hovered_active_item": {
|
||||
"name": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"padding": 4,
|
||||
|
|
@ -834,7 +834,7 @@
|
|||
"right": 8
|
||||
}
|
||||
},
|
||||
"background": "#1c1c1c",
|
||||
"background": "#232323",
|
||||
"corner_radius": 6
|
||||
},
|
||||
"menu": {
|
||||
|
|
@ -842,7 +842,7 @@
|
|||
"corner_radius": 6,
|
||||
"padding": 4,
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"shadow": {
|
||||
|
|
@ -863,7 +863,7 @@
|
|||
},
|
||||
"hovered_sign_in_prompt": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"underline": true,
|
||||
"size": 14
|
||||
},
|
||||
|
|
@ -883,7 +883,7 @@
|
|||
},
|
||||
"sender": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"weight": "bold",
|
||||
"size": 14,
|
||||
"margin": {
|
||||
|
|
@ -920,7 +920,7 @@
|
|||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 16
|
||||
},
|
||||
"placeholder_text": {
|
||||
|
|
@ -933,7 +933,7 @@
|
|||
"selection": "#307af3"
|
||||
},
|
||||
"border": {
|
||||
"color": "#393939",
|
||||
"color": "#151515",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
|
|
@ -952,7 +952,7 @@
|
|||
"right": 12
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#2b2b2b",
|
||||
"tree_branch_color": "#232323",
|
||||
"tree_branch_width": 1,
|
||||
"host_avatar": {
|
||||
"corner_radius": 10,
|
||||
|
|
@ -994,7 +994,7 @@
|
|||
},
|
||||
"name": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 16,
|
||||
"margin": {
|
||||
"right": 6
|
||||
|
|
@ -1013,7 +1013,7 @@
|
|||
},
|
||||
"name": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 16,
|
||||
"margin": {
|
||||
"right": 6
|
||||
|
|
@ -1022,7 +1022,7 @@
|
|||
"padding": {
|
||||
"left": 8
|
||||
},
|
||||
"background": "#1c1c1c",
|
||||
"background": "#0e0e0e",
|
||||
"corner_radius": 6
|
||||
},
|
||||
"unshared_project": {
|
||||
|
|
@ -1062,7 +1062,7 @@
|
|||
"padding": {
|
||||
"left": 8
|
||||
},
|
||||
"background": "#1c1c1c",
|
||||
"background": "#0e0e0e",
|
||||
"corner_radius": 6
|
||||
}
|
||||
},
|
||||
|
|
@ -1074,10 +1074,10 @@
|
|||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"size": 16,
|
||||
"background": "#393939",
|
||||
"background": "#2b2b2b",
|
||||
"corner_radius": 6,
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
|
|
@ -1095,10 +1095,10 @@
|
|||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"size": 16,
|
||||
"background": "#393939",
|
||||
"background": "#2b2b2b",
|
||||
"corner_radius": 6,
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
|
|
@ -1128,11 +1128,11 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 16
|
||||
},
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
|
|
@ -1149,10 +1149,10 @@
|
|||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"size": 16,
|
||||
"background": "#393939",
|
||||
"background": "#2b2b2b",
|
||||
"corner_radius": 6,
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
|
|
@ -1182,7 +1182,7 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 16
|
||||
},
|
||||
"border": {
|
||||
|
|
@ -1212,7 +1212,7 @@
|
|||
"background": "#1c1c1c",
|
||||
"corner_radius": 6,
|
||||
"border": {
|
||||
"color": "#0e0e0e",
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
|
|
@ -1234,13 +1234,13 @@
|
|||
},
|
||||
"results_status": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 18
|
||||
}
|
||||
},
|
||||
"breadcrumbs": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#e3e3e3",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14,
|
||||
"padding": {
|
||||
"left": 6
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"selector": {
|
||||
"background": "#ffffff",
|
||||
"background": "#f1f1f1",
|
||||
"corner_radius": 6,
|
||||
"padding": 8,
|
||||
"item": {
|
||||
|
|
@ -42,7 +42,7 @@
|
|||
"weight": "bold",
|
||||
"size": 14
|
||||
},
|
||||
"background": "#e3e3e3"
|
||||
"background": "#d5d5d5"
|
||||
},
|
||||
"border": {
|
||||
"color": "#c6c6c6",
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
}
|
||||
},
|
||||
"input_editor": {
|
||||
"background": "#f1f1f1",
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 6,
|
||||
"placeholder_text": {
|
||||
"family": "Zed Sans",
|
||||
|
|
@ -79,7 +79,7 @@
|
|||
"size": 16
|
||||
},
|
||||
"border": {
|
||||
"color": "#c6c6c6",
|
||||
"color": "#e3e3e3",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
"tab": {
|
||||
"height": 32,
|
||||
"background": "#f1f1f1",
|
||||
"icon_close": "#717171",
|
||||
"icon_close": "#555555",
|
||||
"icon_close_active": "#000000",
|
||||
"icon_conflict": "#bc9212",
|
||||
"icon_dirty": "#195cc8",
|
||||
|
|
@ -135,7 +135,7 @@
|
|||
"active_tab": {
|
||||
"height": 32,
|
||||
"background": "#ffffff",
|
||||
"icon_close": "#717171",
|
||||
"icon_close": "#555555",
|
||||
"icon_close_active": "#000000",
|
||||
"icon_conflict": "#bc9212",
|
||||
"icon_dirty": "#195cc8",
|
||||
|
|
@ -297,7 +297,7 @@
|
|||
"height": 34,
|
||||
"background": "#ffffff",
|
||||
"border": {
|
||||
"color": "#f1f1f1",
|
||||
"color": "#c6c6c6",
|
||||
"width": 1,
|
||||
"bottom": true
|
||||
},
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import * as path from "path";
|
|||
import app from "./styleTree/app";
|
||||
import dark from "./themes/dark";
|
||||
import light from "./themes/light";
|
||||
import { colors } from "./tokens";
|
||||
import decamelizeTree from "./utils/decamelizeTree";
|
||||
|
||||
const themes = [dark, light];
|
||||
|
|
@ -14,4 +15,6 @@ for (let theme of themes) {
|
|||
);
|
||||
fs.writeFileSync(outPath, styleTreeJSON);
|
||||
console.log(`Generated ${outPath}`);
|
||||
|
||||
console.log(JSON.stringify(colors.indigo, null, 2));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,12 +16,12 @@ export default function selectorModal(theme: Theme): Object {
|
|||
|
||||
const activeItem = {
|
||||
...item,
|
||||
background: backgroundColor(theme, 500, "active"),
|
||||
background: backgroundColor(theme, 300, "active"),
|
||||
text: text(theme, "sans", "primary"),
|
||||
};
|
||||
|
||||
return {
|
||||
background: backgroundColor(theme, 500),
|
||||
background: backgroundColor(theme, 300),
|
||||
cornerRadius: 6,
|
||||
padding: 8,
|
||||
item,
|
||||
|
|
@ -37,12 +37,12 @@ export default function selectorModal(theme: Theme): Object {
|
|||
},
|
||||
},
|
||||
inputEditor: {
|
||||
background: backgroundColor(theme, 300),
|
||||
background: backgroundColor(theme, 500),
|
||||
corner_radius: 6,
|
||||
placeholderText: text(theme, "sans", "placeholder"),
|
||||
selection: player(theme, 1).selection,
|
||||
text: text(theme, "mono", "primary"),
|
||||
border: border(theme, "primary"),
|
||||
border: border(theme, "secondary"),
|
||||
padding: {
|
||||
bottom: 7,
|
||||
left: 16,
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ export default function workspace(theme: Theme) {
|
|||
const tab = {
|
||||
height: 32,
|
||||
background: backgroundColor(theme, 300),
|
||||
iconClose: iconColor(theme, "secondary"),
|
||||
iconClose: iconColor(theme, "muted"),
|
||||
iconCloseActive: iconColor(theme, "active"),
|
||||
iconConflict: iconColor(theme, "warning"),
|
||||
iconDirty: iconColor(theme, "info"),
|
||||
|
|
@ -135,7 +135,7 @@ export default function workspace(theme: Theme) {
|
|||
toolbar: {
|
||||
height: 34,
|
||||
background: backgroundColor(theme, 500),
|
||||
border: border(theme, "muted", { bottom: true }),
|
||||
border: border(theme, "primary", { bottom: true }),
|
||||
itemSpacing: 8,
|
||||
padding: { left: 16, right: 8, top: 4, bottom: 4 },
|
||||
},
|
||||
|
|
|
|||
|
|
@ -3,22 +3,22 @@ import Theme, { Syntax } from "./theme";
|
|||
|
||||
const backgroundColor = {
|
||||
100: {
|
||||
base: colors.neutral[700],
|
||||
hovered: colors.neutral[700],
|
||||
base: colors.neutral[750],
|
||||
hovered: colors.neutral[725],
|
||||
active: colors.neutral[700],
|
||||
focused: colors.neutral[700],
|
||||
focused: colors.neutral[675],
|
||||
},
|
||||
300: {
|
||||
base: colors.neutral[800],
|
||||
hovered: colors.neutral[800],
|
||||
active: colors.neutral[800],
|
||||
focused: colors.neutral[800],
|
||||
hovered: colors.neutral[775],
|
||||
active: colors.neutral[750],
|
||||
focused: colors.neutral[725],
|
||||
},
|
||||
500: {
|
||||
base: colors.neutral[900],
|
||||
hovered: colors.neutral[850],
|
||||
active: colors.neutral[800],
|
||||
focused: colors.neutral[850],
|
||||
hovered: colors.neutral[875],
|
||||
active: colors.neutral[850],
|
||||
focused: colors.neutral[825],
|
||||
},
|
||||
ok: {
|
||||
base: colors.green[600],
|
||||
|
|
@ -47,11 +47,11 @@ const backgroundColor = {
|
|||
};
|
||||
|
||||
const borderColor = {
|
||||
primary: colors.neutral[850],
|
||||
secondary: colors.neutral[700],
|
||||
muted: colors.neutral[750],
|
||||
focused: colors.neutral[100],
|
||||
active: colors.neutral[500],
|
||||
primary: colors.neutral[875],
|
||||
secondary: colors.neutral[825],
|
||||
muted: colors.neutral[775],
|
||||
focused: colors.neutral[500],
|
||||
active: colors.neutral[900],
|
||||
ok: colors.green[500],
|
||||
error: colors.red[500],
|
||||
warning: colors.amber[500],
|
||||
|
|
@ -59,13 +59,13 @@ const borderColor = {
|
|||
};
|
||||
|
||||
const textColor = {
|
||||
primary: colors.neutral[100],
|
||||
primary: colors.neutral[50],
|
||||
secondary: colors.neutral[350],
|
||||
muted: colors.neutral[550],
|
||||
placeholder: colors.neutral[750],
|
||||
active: colors.neutral[0],
|
||||
//TODO: (design) define feature and it's correct value
|
||||
feature: colors.lime[400],
|
||||
feature: colors.sky[500],
|
||||
ok: colors.green[600],
|
||||
error: colors.red[400],
|
||||
warning: colors.amber[300],
|
||||
|
|
@ -73,11 +73,11 @@ const textColor = {
|
|||
};
|
||||
|
||||
const iconColor = {
|
||||
primary: colors.neutral[300],
|
||||
secondary: colors.neutral[500],
|
||||
primary: colors.neutral[200],
|
||||
secondary: colors.neutral[350],
|
||||
muted: colors.neutral[600],
|
||||
placeholder: colors.neutral[700],
|
||||
active: colors.neutral[50],
|
||||
active: colors.neutral[0],
|
||||
//TODO: (design) define feature and it's correct value
|
||||
feature: colors.sky[500],
|
||||
ok: colors.green[600],
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ export interface ColorToken {
|
|||
step?: number,
|
||||
}
|
||||
export const colors = {
|
||||
neutral: colorRamp(["white", "black"], { steps: 19, increment: 50 }),
|
||||
neutral: colorRamp(["white", "black"], { steps: 37, increment: 25 }), // (900/25) + 1
|
||||
rose: colorRamp("#F43F5EFF"),
|
||||
red: colorRamp("#EF4444FF"),
|
||||
orange: colorRamp("#F97316FF"),
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ export type ColorRamp = {
|
|||
|
||||
export function colorRamp(
|
||||
color: Color | [Color, Color],
|
||||
options?: { steps?: number; increment?: number }
|
||||
options?: { steps?: number; increment?: number; }
|
||||
): ColorRamp {
|
||||
let scale: Scale;
|
||||
if (Array.isArray(color)) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue