Update inputs, tabs, pickers, autocomplete
This commit is contained in:
parent
d99c74d874
commit
408f8d4297
11 changed files with 294 additions and 214 deletions
|
@ -1,16 +1,16 @@
|
|||
{
|
||||
"selector": {
|
||||
"background": "#1c1c1c",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"padding": 8,
|
||||
"item": {
|
||||
"padding": {
|
||||
"bottom": 4,
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"left": 12,
|
||||
"right": 12,
|
||||
"top": 4
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#9c9c9c",
|
||||
|
@ -26,11 +26,11 @@
|
|||
"active_item": {
|
||||
"padding": {
|
||||
"bottom": 4,
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"left": 12,
|
||||
"right": 12,
|
||||
"top": 4
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#f1f1f1",
|
||||
|
@ -56,14 +56,14 @@
|
|||
},
|
||||
"padding": {
|
||||
"bottom": 4,
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"left": 12,
|
||||
"right": 12,
|
||||
"top": 8
|
||||
}
|
||||
},
|
||||
"input_editor": {
|
||||
"background": "#000000",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"placeholder_text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#474747",
|
||||
|
@ -114,9 +114,9 @@
|
|||
"icon_conflict": "#f6a724",
|
||||
"icon_dirty": "#135acd",
|
||||
"icon_width": 8,
|
||||
"spacing": 10,
|
||||
"spacing": 8,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"family": "Zed Sans",
|
||||
"color": "#9c9c9c",
|
||||
"size": 14
|
||||
},
|
||||
|
@ -128,8 +128,8 @@
|
|||
"overlay": true
|
||||
},
|
||||
"padding": {
|
||||
"left": 12,
|
||||
"right": 12
|
||||
"left": 8,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"active_tab": {
|
||||
|
@ -140,9 +140,9 @@
|
|||
"icon_conflict": "#f6a724",
|
||||
"icon_dirty": "#135acd",
|
||||
"icon_width": 8,
|
||||
"spacing": 10,
|
||||
"spacing": 8,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"family": "Zed Sans",
|
||||
"color": "#ffffff",
|
||||
"size": 14
|
||||
},
|
||||
|
@ -154,8 +154,8 @@
|
|||
"overlay": true
|
||||
},
|
||||
"padding": {
|
||||
"left": 12,
|
||||
"right": 12
|
||||
"left": 8,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"left_sidebar": {
|
||||
|
@ -272,18 +272,36 @@
|
|||
"family": "Zed Sans",
|
||||
"color": "#9c9c9c",
|
||||
"size": 12,
|
||||
"underline": true,
|
||||
"border": {
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"margin": {
|
||||
"top": 1,
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"right": 8
|
||||
"left": 6,
|
||||
"right": 6
|
||||
}
|
||||
},
|
||||
"hovered_sign_in_prompt": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#ffffff",
|
||||
"size": 12,
|
||||
"underline": true,
|
||||
"border": {
|
||||
"color": "#070707",
|
||||
"width": 1
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"margin": {
|
||||
"top": 1,
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"right": 8
|
||||
"left": 6,
|
||||
"right": 6
|
||||
}
|
||||
},
|
||||
"offline_icon": {
|
||||
|
@ -383,8 +401,8 @@
|
|||
],
|
||||
"autocomplete": {
|
||||
"background": "#000000",
|
||||
"corner_radius": 6,
|
||||
"padding": 6,
|
||||
"corner_radius": 8,
|
||||
"padding": 4,
|
||||
"border": {
|
||||
"color": "#232323",
|
||||
"width": 1
|
||||
|
@ -713,21 +731,23 @@
|
|||
"key": {
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#f1f1f1",
|
||||
"color": "#ffffff",
|
||||
"size": 12
|
||||
},
|
||||
"corner_radius": 3,
|
||||
"background": "#2472f2",
|
||||
"corner_radius": 4,
|
||||
"background": "#0e0e0e",
|
||||
"border": {
|
||||
"color": "#2472f2",
|
||||
"color": "#232323",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"left": 3,
|
||||
"right": 3
|
||||
"top": 3,
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8
|
||||
},
|
||||
"margin": {
|
||||
"left": 3
|
||||
"left": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -1127,53 +1147,53 @@
|
|||
},
|
||||
"search": {
|
||||
"match_background": "#3f15a380",
|
||||
"tab_icon_spacing": 4,
|
||||
"tab_icon_spacing": 8,
|
||||
"tab_icon_width": 14,
|
||||
"active_hovered_option_button": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"color": "#ffffff",
|
||||
"size": 14,
|
||||
"background": "#2b2b2b",
|
||||
"corner_radius": 6,
|
||||
"background": "#232323",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#070707",
|
||||
"color": "#404040",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"active_option_button": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"color": "#ffffff",
|
||||
"size": 14,
|
||||
"background": "#2b2b2b",
|
||||
"corner_radius": 6,
|
||||
"background": "#232323",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#070707",
|
||||
"color": "#404040",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"editor": {
|
||||
"background": "#000000",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"min_width": 200,
|
||||
"max_width": 500,
|
||||
"placeholder_text": {
|
||||
|
@ -1187,7 +1207,7 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#f1f1f1",
|
||||
"color": "#ffffff",
|
||||
"size": 14
|
||||
},
|
||||
"border": {
|
||||
|
@ -1195,39 +1215,39 @@
|
|||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"right": 5
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"top": 3,
|
||||
"bottom": 3,
|
||||
"left": 14,
|
||||
"right": 14
|
||||
"left": 12,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"hovered_option_button": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"color": "#ffffff",
|
||||
"size": 14,
|
||||
"background": "#2b2b2b",
|
||||
"corner_radius": 6,
|
||||
"background": "#0e0e0e",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#070707",
|
||||
"color": "#404040",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"invalid_editor": {
|
||||
"background": "#000000",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"min_width": 200,
|
||||
"max_width": 500,
|
||||
"placeholder_text": {
|
||||
|
@ -1241,7 +1261,7 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#f1f1f1",
|
||||
"color": "#ffffff",
|
||||
"size": 14
|
||||
},
|
||||
"border": {
|
||||
|
@ -1249,13 +1269,13 @@
|
|||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"right": 5
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"top": 3,
|
||||
"bottom": 3,
|
||||
"left": 14,
|
||||
"right": 14
|
||||
"left": 12,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"match_index": {
|
||||
|
@ -1268,27 +1288,27 @@
|
|||
"family": "Zed Mono",
|
||||
"color": "#9c9c9c",
|
||||
"size": 14,
|
||||
"background": "#1c1c1c",
|
||||
"corner_radius": 6,
|
||||
"background": "#0e0e0e",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#070707",
|
||||
"color": "#232323",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"option_button_group": {
|
||||
"padding": {
|
||||
"left": 2,
|
||||
"right": 2
|
||||
"left": 4,
|
||||
"right": 4
|
||||
}
|
||||
},
|
||||
"results_status": {
|
||||
|
@ -1299,7 +1319,7 @@
|
|||
},
|
||||
"breadcrumbs": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#f1f1f1",
|
||||
"color": "#9c9c9c",
|
||||
"size": 14,
|
||||
"padding": {
|
||||
"left": 6
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
{
|
||||
"selector": {
|
||||
"background": "#f8f8f8",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"padding": 8,
|
||||
"item": {
|
||||
"padding": {
|
||||
"bottom": 4,
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"left": 12,
|
||||
"right": 12,
|
||||
"top": 4
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#474747",
|
||||
|
@ -26,11 +26,11 @@
|
|||
"active_item": {
|
||||
"padding": {
|
||||
"bottom": 4,
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"left": 12,
|
||||
"right": 12,
|
||||
"top": 4
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#2b2b2b",
|
||||
|
@ -42,7 +42,7 @@
|
|||
"weight": "bold",
|
||||
"size": 14
|
||||
},
|
||||
"background": "#dcdcdc"
|
||||
"background": "#e3e3e3"
|
||||
},
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
|
@ -56,14 +56,14 @@
|
|||
},
|
||||
"padding": {
|
||||
"bottom": 4,
|
||||
"left": 16,
|
||||
"right": 16,
|
||||
"left": 12,
|
||||
"right": 12,
|
||||
"top": 8
|
||||
}
|
||||
},
|
||||
"input_editor": {
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"placeholder_text": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#808080",
|
||||
|
@ -114,9 +114,9 @@
|
|||
"icon_conflict": "#f7bf17",
|
||||
"icon_dirty": "#135acd",
|
||||
"icon_width": 8,
|
||||
"spacing": 10,
|
||||
"spacing": 8,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"family": "Zed Sans",
|
||||
"color": "#474747",
|
||||
"size": 14
|
||||
},
|
||||
|
@ -128,8 +128,8 @@
|
|||
"overlay": true
|
||||
},
|
||||
"padding": {
|
||||
"left": 12,
|
||||
"right": 12
|
||||
"left": 8,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"active_tab": {
|
||||
|
@ -140,9 +140,9 @@
|
|||
"icon_conflict": "#f7bf17",
|
||||
"icon_dirty": "#135acd",
|
||||
"icon_width": 8,
|
||||
"spacing": 10,
|
||||
"spacing": 8,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"family": "Zed Sans",
|
||||
"color": "#000000",
|
||||
"size": 14
|
||||
},
|
||||
|
@ -154,8 +154,8 @@
|
|||
"overlay": true
|
||||
},
|
||||
"padding": {
|
||||
"left": 12,
|
||||
"right": 12
|
||||
"left": 8,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"left_sidebar": {
|
||||
|
@ -272,18 +272,36 @@
|
|||
"family": "Zed Sans",
|
||||
"color": "#474747",
|
||||
"size": 12,
|
||||
"underline": true,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"width": 1
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"margin": {
|
||||
"top": 1,
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"right": 8
|
||||
"left": 6,
|
||||
"right": 6
|
||||
}
|
||||
},
|
||||
"hovered_sign_in_prompt": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#000000",
|
||||
"size": 12,
|
||||
"underline": true,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"width": 1
|
||||
},
|
||||
"corner_radius": 6,
|
||||
"margin": {
|
||||
"top": 1,
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"right": 8
|
||||
"left": 6,
|
||||
"right": 6
|
||||
}
|
||||
},
|
||||
"offline_icon": {
|
||||
|
@ -383,8 +401,8 @@
|
|||
],
|
||||
"autocomplete": {
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 6,
|
||||
"padding": 6,
|
||||
"corner_radius": 8,
|
||||
"padding": 4,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"width": 1
|
||||
|
@ -713,21 +731,23 @@
|
|||
"key": {
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#2b2b2b",
|
||||
"color": "#000000",
|
||||
"size": 12
|
||||
},
|
||||
"corner_radius": 3,
|
||||
"background": "#c5dafc",
|
||||
"corner_radius": 4,
|
||||
"background": "#f1f1f1",
|
||||
"border": {
|
||||
"color": "#9ec1fa",
|
||||
"color": "#d5d5d5",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"left": 3,
|
||||
"right": 3
|
||||
"top": 3,
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8
|
||||
},
|
||||
"margin": {
|
||||
"left": 3
|
||||
"left": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -1127,53 +1147,53 @@
|
|||
},
|
||||
"search": {
|
||||
"match_background": "#fce9b7",
|
||||
"tab_icon_spacing": 4,
|
||||
"tab_icon_spacing": 8,
|
||||
"tab_icon_width": 14,
|
||||
"active_hovered_option_button": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#474747",
|
||||
"color": "#000000",
|
||||
"size": 14,
|
||||
"background": "#eaeaea",
|
||||
"corner_radius": 6,
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"color": "#e3e3e3",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"active_option_button": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#474747",
|
||||
"color": "#000000",
|
||||
"size": 14,
|
||||
"background": "#eaeaea",
|
||||
"corner_radius": 6,
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"color": "#e3e3e3",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"editor": {
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"min_width": 200,
|
||||
"max_width": 500,
|
||||
"placeholder_text": {
|
||||
|
@ -1187,7 +1207,7 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#2b2b2b",
|
||||
"color": "#000000",
|
||||
"size": 14
|
||||
},
|
||||
"border": {
|
||||
|
@ -1195,39 +1215,39 @@
|
|||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"right": 5
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"top": 3,
|
||||
"bottom": 3,
|
||||
"left": 14,
|
||||
"right": 14
|
||||
"left": 12,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"hovered_option_button": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#474747",
|
||||
"color": "#000000",
|
||||
"size": 14,
|
||||
"background": "#eaeaea",
|
||||
"corner_radius": 6,
|
||||
"background": "#f1f1f1",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"color": "#e3e3e3",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"invalid_editor": {
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 6,
|
||||
"corner_radius": 8,
|
||||
"min_width": 200,
|
||||
"max_width": 500,
|
||||
"placeholder_text": {
|
||||
|
@ -1241,7 +1261,7 @@
|
|||
},
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#2b2b2b",
|
||||
"color": "#000000",
|
||||
"size": 14
|
||||
},
|
||||
"border": {
|
||||
|
@ -1249,13 +1269,13 @@
|
|||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"right": 5
|
||||
"right": 6
|
||||
},
|
||||
"padding": {
|
||||
"top": 3,
|
||||
"bottom": 3,
|
||||
"left": 14,
|
||||
"right": 14
|
||||
"left": 12,
|
||||
"right": 8
|
||||
}
|
||||
},
|
||||
"match_index": {
|
||||
|
@ -1268,27 +1288,27 @@
|
|||
"family": "Zed Mono",
|
||||
"color": "#474747",
|
||||
"size": 14,
|
||||
"background": "#f8f8f8",
|
||||
"corner_radius": 6,
|
||||
"background": "#f1f1f1",
|
||||
"corner_radius": 4,
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"width": 1
|
||||
},
|
||||
"margin": {
|
||||
"left": 1,
|
||||
"right": 1
|
||||
"left": 2,
|
||||
"right": 2
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 1,
|
||||
"left": 6,
|
||||
"right": 6,
|
||||
"top": 1
|
||||
"bottom": 3,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 3
|
||||
}
|
||||
},
|
||||
"option_button_group": {
|
||||
"padding": {
|
||||
"left": 2,
|
||||
"right": 2
|
||||
"left": 4,
|
||||
"right": 4
|
||||
}
|
||||
},
|
||||
"results_status": {
|
||||
|
@ -1299,7 +1319,7 @@
|
|||
},
|
||||
"breadcrumbs": {
|
||||
"family": "Zed Sans",
|
||||
"color": "#2b2b2b",
|
||||
"color": "#474747",
|
||||
"size": 14,
|
||||
"padding": {
|
||||
"left": 6
|
||||
|
|
|
@ -36,7 +36,7 @@ export default function app(theme: Theme): Object {
|
|||
contactsPanel: contactsPanel(theme),
|
||||
search: search(theme),
|
||||
breadcrumbs: {
|
||||
...text(theme, "sans", "primary"),
|
||||
...text(theme, "sans", "secondary"),
|
||||
padding: {
|
||||
left: 6,
|
||||
},
|
||||
|
|
|
@ -1,20 +1,23 @@
|
|||
import Theme from "../themes/theme";
|
||||
import { text, backgroundColor, border } from "./components";
|
||||
import { colors } from "../tokens";
|
||||
import { text, backgroundColor, border, borderColor } from "./components";
|
||||
|
||||
export default function commandPalette(theme: Theme) {
|
||||
return {
|
||||
keystrokeSpacing: 8,
|
||||
key: {
|
||||
text: text(theme, "mono", "primary", { size: "xs" }),
|
||||
cornerRadius: 3,
|
||||
background: backgroundColor(theme, "info", "base"),
|
||||
border: border(theme, "info"),
|
||||
text: text(theme, "mono", "active", { size: "xs" }),
|
||||
cornerRadius: 4,
|
||||
background: backgroundColor(theme, "on300"),
|
||||
border: border(theme, "secondary"),
|
||||
padding: {
|
||||
left: 3,
|
||||
right: 3,
|
||||
top: 3,
|
||||
bottom: 3,
|
||||
left: 8,
|
||||
right: 8,
|
||||
},
|
||||
margin: {
|
||||
left: 3
|
||||
left: 2
|
||||
},
|
||||
}
|
||||
}
|
||||
|
|
|
@ -67,8 +67,8 @@ export default function editor(theme: Theme) {
|
|||
],
|
||||
autocomplete: {
|
||||
background: backgroundColor(theme, 500),
|
||||
cornerRadius: 6,
|
||||
padding: 6,
|
||||
cornerRadius: 8,
|
||||
padding: 4,
|
||||
border: border(theme, "secondary"),
|
||||
item: autocompleteItem,
|
||||
hoveredItem: {
|
||||
|
|
|
@ -4,57 +4,62 @@ import { backgroundColor, border, player, text } from "./components";
|
|||
export default function search(theme: Theme) {
|
||||
const optionButton = {
|
||||
...text(theme, "mono", "secondary"),
|
||||
background: backgroundColor(theme, 300),
|
||||
cornerRadius: 6,
|
||||
border: border(theme, "primary"),
|
||||
background: backgroundColor(theme, "on500"),
|
||||
cornerRadius: 4,
|
||||
border: border(theme, "secondary"),
|
||||
margin: {
|
||||
left: 1,
|
||||
right: 1,
|
||||
left: 2,
|
||||
right: 2,
|
||||
},
|
||||
padding: {
|
||||
bottom: 1,
|
||||
left: 6,
|
||||
right: 6,
|
||||
top: 1,
|
||||
bottom: 3,
|
||||
left: 8,
|
||||
right: 8,
|
||||
top: 3,
|
||||
},
|
||||
};
|
||||
|
||||
const editor = {
|
||||
background: backgroundColor(theme, 500),
|
||||
cornerRadius: 6,
|
||||
cornerRadius: 8,
|
||||
minWidth: 200,
|
||||
maxWidth: 500,
|
||||
placeholderText: text(theme, "mono", "placeholder"),
|
||||
selection: player(theme, 1).selection,
|
||||
text: text(theme, "mono", "primary"),
|
||||
text: text(theme, "mono", "active"),
|
||||
border: border(theme, "secondary"),
|
||||
margin: {
|
||||
right: 5,
|
||||
right: 6,
|
||||
},
|
||||
padding: {
|
||||
top: 3,
|
||||
bottom: 3,
|
||||
left: 14,
|
||||
right: 14,
|
||||
left: 12,
|
||||
right: 8,
|
||||
},
|
||||
};
|
||||
|
||||
return {
|
||||
matchBackground: theme.editor.highlight.match.value,
|
||||
tabIconSpacing: 4,
|
||||
tabIconSpacing: 8,
|
||||
tabIconWidth: 14,
|
||||
activeHoveredOptionButton: {
|
||||
...optionButton,
|
||||
background: backgroundColor(theme, 100),
|
||||
...text(theme, "mono", "active"),
|
||||
background: backgroundColor(theme, "on500", "active"),
|
||||
border: border(theme, "muted"),
|
||||
},
|
||||
activeOptionButton: {
|
||||
...optionButton,
|
||||
background: backgroundColor(theme, 100),
|
||||
...text(theme, "mono", "active"),
|
||||
background: backgroundColor(theme, "on500", "active"),
|
||||
border: border(theme, "muted"),
|
||||
},
|
||||
editor,
|
||||
hoveredOptionButton: {
|
||||
...optionButton,
|
||||
background: backgroundColor(theme, 100),
|
||||
...text(theme, "mono", "active"),
|
||||
border: border(theme, "muted"),
|
||||
},
|
||||
invalidEditor: {
|
||||
...editor,
|
||||
|
@ -67,8 +72,8 @@ export default function search(theme: Theme) {
|
|||
optionButton,
|
||||
optionButtonGroup: {
|
||||
padding: {
|
||||
left: 2,
|
||||
right: 2,
|
||||
left: 4,
|
||||
right: 4,
|
||||
},
|
||||
},
|
||||
resultsStatus: {
|
||||
|
|
|
@ -5,11 +5,11 @@ export default function selectorModal(theme: Theme): Object {
|
|||
const item = {
|
||||
padding: {
|
||||
bottom: 4,
|
||||
left: 16,
|
||||
right: 16,
|
||||
left: 12,
|
||||
right: 12,
|
||||
top: 4,
|
||||
},
|
||||
cornerRadius: 6,
|
||||
cornerRadius: 8,
|
||||
text: text(theme, "sans", "secondary"),
|
||||
highlightText: text(theme, "sans", "feature", { weight: "bold" }),
|
||||
};
|
||||
|
@ -22,7 +22,7 @@ export default function selectorModal(theme: Theme): Object {
|
|||
|
||||
return {
|
||||
background: backgroundColor(theme, 300),
|
||||
cornerRadius: 6,
|
||||
cornerRadius: 8,
|
||||
padding: 8,
|
||||
item,
|
||||
activeItem,
|
||||
|
@ -31,14 +31,14 @@ export default function selectorModal(theme: Theme): Object {
|
|||
text: text(theme, "sans", "placeholder"),
|
||||
padding: {
|
||||
bottom: 4,
|
||||
left: 16,
|
||||
right: 16,
|
||||
left: 12,
|
||||
right: 12,
|
||||
top: 8,
|
||||
},
|
||||
},
|
||||
inputEditor: {
|
||||
background: backgroundColor(theme, 500),
|
||||
cornerRadius: 6,
|
||||
cornerRadius: 8,
|
||||
placeholderText: text(theme, "sans", "placeholder"),
|
||||
selection: player(theme, 1).selection,
|
||||
text: text(theme, "mono", "primary"),
|
||||
|
|
|
@ -4,9 +4,15 @@ import { backgroundColor, border, iconColor, text } from "./components";
|
|||
export default function workspace(theme: Theme) {
|
||||
const signInPrompt = {
|
||||
...text(theme, "sans", "secondary", { size: "xs" }),
|
||||
underline: true,
|
||||
border: border(theme, "primary"),
|
||||
cornerRadius: 6,
|
||||
margin: {
|
||||
top: 1,
|
||||
right: 6,
|
||||
},
|
||||
padding: {
|
||||
right: 8,
|
||||
left: 6,
|
||||
right: 6,
|
||||
},
|
||||
};
|
||||
|
||||
|
@ -18,23 +24,23 @@ export default function workspace(theme: Theme) {
|
|||
iconConflict: iconColor(theme, "warning"),
|
||||
iconDirty: iconColor(theme, "info"),
|
||||
iconWidth: 8,
|
||||
spacing: 10,
|
||||
text: text(theme, "mono", "secondary", { size: "sm" }),
|
||||
spacing: 8,
|
||||
text: text(theme, "sans", "secondary", { size: "sm" }),
|
||||
border: border(theme, "primary", {
|
||||
left: true,
|
||||
bottom: true,
|
||||
overlay: true,
|
||||
}),
|
||||
padding: {
|
||||
left: 12,
|
||||
right: 12,
|
||||
left: 8,
|
||||
right: 8,
|
||||
},
|
||||
};
|
||||
|
||||
const activeTab = {
|
||||
...tab,
|
||||
background: backgroundColor(theme, 500),
|
||||
text: text(theme, "mono", "active", { size: "sm" }),
|
||||
text: text(theme, "sans", "active", { size: "sm" }),
|
||||
border: {
|
||||
...tab.border,
|
||||
bottom: false,
|
||||
|
|
|
@ -21,6 +21,18 @@ const backgroundColor = {
|
|||
active: withOpacity(colors.neutral[0], 0.12),
|
||||
focused: colors.neutral[825],
|
||||
},
|
||||
on300: {
|
||||
base: colors.neutral[850],
|
||||
hovered: colors.neutral[875],
|
||||
active: colors.neutral[900],
|
||||
focused: colors.neutral[875],
|
||||
},
|
||||
on500: {
|
||||
base: colors.neutral[850],
|
||||
hovered: colors.neutral[800],
|
||||
active: colors.neutral[775],
|
||||
focused: colors.neutral[800],
|
||||
},
|
||||
ok: {
|
||||
base: colors.green[600],
|
||||
hovered: colors.green[600],
|
||||
|
|
|
@ -12,7 +12,7 @@ const backgroundColor = {
|
|||
300: {
|
||||
base: colors.neutral[25],
|
||||
hovered: colors.neutral[75],
|
||||
active: colors.neutral[125],
|
||||
active: colors.neutral[100],
|
||||
focused: colors.neutral[75],
|
||||
},
|
||||
500: {
|
||||
|
@ -21,6 +21,18 @@ const backgroundColor = {
|
|||
active: withOpacity(colors.neutral[900], 0.06),
|
||||
focused: colors.neutral[50],
|
||||
},
|
||||
on300: {
|
||||
base: colors.neutral[50],
|
||||
hovered: colors.neutral[100],
|
||||
active: colors.neutral[150],
|
||||
focused: colors.neutral[100],
|
||||
},
|
||||
on500: {
|
||||
base: colors.neutral[50],
|
||||
hovered: colors.neutral[25],
|
||||
active: colors.neutral[0],
|
||||
focused: colors.neutral[25],
|
||||
},
|
||||
ok: {
|
||||
base: colors.green[100],
|
||||
hovered: colors.green[100],
|
||||
|
|
|
@ -63,6 +63,8 @@ export default interface Theme {
|
|||
100: BackgroundColorSet;
|
||||
300: BackgroundColorSet;
|
||||
500: BackgroundColorSet;
|
||||
on300: BackgroundColorSet;
|
||||
on500: BackgroundColorSet;
|
||||
ok: BackgroundColorSet;
|
||||
error: BackgroundColorSet;
|
||||
warning: BackgroundColorSet;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue