1import Theme from "../themes/theme";
2import { backgroundColor, border, iconColor, text } from "./components";
3
4export default function workspace(theme: Theme) {
5 const signInPrompt = {
6 ...text(theme, "sans", "secondary", { size: "xs" }),
7 border: border(theme, "primary"),
8 cornerRadius: 6,
9 margin: {
10 top: 1,
11 right: 6,
12 },
13 padding: {
14 left: 6,
15 right: 6,
16 },
17 };
18
19 const tab = {
20 height: 32,
21 background: backgroundColor(theme, 300),
22 iconClose: iconColor(theme, "muted"),
23 iconCloseActive: iconColor(theme, "active"),
24 iconConflict: iconColor(theme, "warning"),
25 iconDirty: iconColor(theme, "info"),
26 iconWidth: 8,
27 spacing: 8,
28 text: text(theme, "sans", "secondary", { size: "sm" }),
29 border: border(theme, "primary", {
30 left: true,
31 bottom: true,
32 overlay: true,
33 }),
34 padding: {
35 left: 8,
36 right: 8,
37 },
38 };
39
40 const activeTab = {
41 ...tab,
42 background: backgroundColor(theme, 500),
43 text: text(theme, "sans", "active", { size: "sm" }),
44 border: {
45 ...tab.border,
46 bottom: false,
47 },
48 };
49
50 const diagnosticSummary = {
51 cornerRadius: 6,
52 padding: { left: 6, right: 6 },
53 ...text(theme, "sans", "primary", { size: "sm" }),
54 };
55 const shareIcon = {
56 cornerRadius: 6,
57 margin: { top: 3, bottom: 2 },
58 };
59
60 return {
61 background: backgroundColor(theme, 300),
62 leaderBorderOpacity: 0.7,
63 leaderBorderWidth: 2.0,
64 tab,
65 activeTab,
66 modal: {
67 margin: {
68 bottom: 52,
69 top: 52,
70 },
71 cursor: "Arrow"
72 },
73 sidebarResizeHandle: {
74 background: border(theme, "primary").color,
75 padding: {
76 left: 1,
77 },
78 },
79 paneDivider: {
80 color: border(theme, "secondary").color,
81 width: 1,
82 },
83 statusBar: {
84 height: 30,
85 itemSpacing: 8,
86 padding: {
87 top: 1,
88 bottom: 1,
89 left: 6,
90 right: 6,
91 },
92 border: border(theme, "primary", { top: true, overlay: true }),
93 cursorPosition: text(theme, "sans", "muted"),
94 autoUpdateProgressMessage: text(theme, "sans", "muted"),
95 autoUpdateDoneMessage: text(theme, "sans", "muted"),
96 lspStatus: {
97 iconSpacing: 4,
98 iconWidth: 14,
99 height: 18,
100 cornerRadius: 6,
101 padding: { left: 6, right: 6 },
102 message: text(theme, "sans", "muted"),
103 iconColor: iconColor(theme, "muted"),
104 hover: {
105 message: text(theme, "sans", "primary"),
106 iconColor: iconColor(theme, "primary"),
107 background: backgroundColor(theme, 300, "hovered"),
108 }
109 },
110 diagnostics: {
111 height: 16,
112 summaryOk: {
113 ...diagnosticSummary,
114 hover: {
115 background: backgroundColor(theme, 300, "hovered"),
116 }
117 },
118 summaryWarning: {
119 ...diagnosticSummary,
120 background: backgroundColor(theme, "warning"),
121 border: border(theme, "warning"),
122 hover: {
123 background: backgroundColor(theme, "warning", "hovered"),
124 }
125 },
126 summaryError: {
127 ...diagnosticSummary,
128 background: backgroundColor(theme, "error"),
129 border: border(theme, "error"),
130 hover: {
131 background: backgroundColor(theme, "error", "hovered"),
132 }
133 },
134 message: {
135 ...text(theme, "sans", "muted"),
136 hover: text(theme, "sans", "secondary"),
137 },
138 iconColorOk: iconColor(theme, "secondary"),
139 iconColorWarning: iconColor(theme, "warning"),
140 iconColorError: iconColor(theme, "error"),
141 iconWidth: 14,
142 iconSpacing: 2,
143 summarySpacing: 6,
144 },
145 sidebarButtons: {
146 groupLeft: {},
147 groupRight: {},
148 item: {
149 iconSize: 14,
150 padding: { top: 3, bottom: 3, left: 6, right: 6 },
151 cornerRadius: 6,
152 iconColor: iconColor(theme, "secondary"),
153 hover: {
154 iconColor: iconColor(theme, "primary"),
155 background: backgroundColor(theme, 300, "hovered"),
156 },
157 active: {
158 iconColor: iconColor(theme, "active"),
159 background: backgroundColor(theme, 300, "active"),
160 }
161 },
162 },
163 },
164 titlebar: {
165 avatarWidth: 18,
166 height: 32,
167 background: backgroundColor(theme, 100),
168 padding: {
169 left: 80,
170 },
171 title: text(theme, "sans", "primary"),
172 avatar: {
173 cornerRadius: 10,
174 border: {
175 color: "#00000088",
176 width: 1,
177 },
178 },
179 avatarRibbon: {
180 height: 3,
181 width: 12,
182 // TODO: The background for this ideally should be
183 // set with a token, not hardcoded in rust
184 },
185 border: border(theme, "primary", { bottom: true }),
186 signInPrompt,
187 hoveredSignInPrompt: {
188 ...signInPrompt,
189 ...text(theme, "sans", "active", { size: "xs" }),
190 },
191 offlineIcon: {
192 color: iconColor(theme, "secondary"),
193 width: 16,
194 padding: {
195 right: 4,
196 },
197 },
198 shareIcon: {
199 ...shareIcon,
200 color: iconColor(theme, "secondary")
201 },
202 hoveredShareIcon: {
203 ...shareIcon,
204 background: backgroundColor(theme, 100, "hovered"),
205 color: iconColor(theme, "secondary"),
206 },
207 hoveredActiveShareIcon: {
208 ...shareIcon,
209 background: backgroundColor(theme, 100, "hovered"),
210 color: iconColor(theme, "active"),
211 },
212 activeShareIcon: {
213 ...shareIcon,
214 background: backgroundColor(theme, 100, "active"),
215 color: iconColor(theme, "active"),
216 },
217 outdatedWarning: {
218 ...text(theme, "sans", "warning"),
219 size: 13,
220 margin: { right: 6 }
221 },
222 },
223 toolbar: {
224 height: 34,
225 background: backgroundColor(theme, 500),
226 border: border(theme, "secondary", { bottom: true }),
227 itemSpacing: 8,
228 padding: { left: 16, right: 8, top: 4, bottom: 4 },
229 },
230 breadcrumbs: {
231 ...text(theme, "mono", "secondary"),
232 padding: { left: 6 },
233 },
234 disconnectedOverlay: {
235 ...text(theme, "sans", "active"),
236 background: "#000000aa",
237 },
238 };
239}