workspace.ts

  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"),
  7        size: 13,
  8        underline: true,
  9        padding: {
 10            right: 8,
 11        },
 12    };
 13
 14    const tab = {
 15        height: 32,
 16        background: backgroundColor(theme, 300),
 17        iconClose: iconColor(theme, "muted"),
 18        iconCloseActive: iconColor(theme, "active"),
 19        iconConflict: iconColor(theme, "warning"),
 20        iconDirty: iconColor(theme, "info"),
 21        iconWidth: 8,
 22        spacing: 10,
 23        text: text(theme, "mono", "secondary", { size: "sm" }),
 24        border: border(theme, "primary", {
 25            left: true,
 26            bottom: true,
 27            overlay: true,
 28        }),
 29        padding: {
 30            left: 12,
 31            right: 12,
 32        },
 33    };
 34
 35    const activeTab = {
 36        ...tab,
 37        background: backgroundColor(theme, 500),
 38        text: text(theme, "mono", "active", { size: "sm" }),
 39        border: {
 40            ...tab.border,
 41            bottom: false,
 42        },
 43    };
 44
 45    const sidebarItem = {
 46        height: 32,
 47        iconColor: iconColor(theme, "secondary"),
 48        iconSize: 18,
 49    };
 50    const sidebar = {
 51        width: 30,
 52        background: backgroundColor(theme, 300),
 53        border: border(theme, "primary", { right: true }),
 54        item: sidebarItem,
 55        activeItem: {
 56            ...sidebarItem,
 57            iconColor: iconColor(theme, "active"),
 58        },
 59        resizeHandle: {
 60            background: border(theme, "primary").color,
 61            padding: {
 62                left: 1,
 63            },
 64        },
 65    };
 66
 67    return {
 68        background: backgroundColor(theme, 300),
 69        leaderBorderOpacity: 0.7,
 70        leaderBorderWidth: 2.0,
 71        tab,
 72        activeTab,
 73        leftSidebar: {
 74            ...sidebar,
 75            border: border(theme, "primary", { right: true }),
 76        },
 77        rightSidebar: {
 78            ...sidebar,
 79            border: border(theme, "primary", { left: true }),
 80        },
 81        paneDivider: {
 82            color: border(theme, "secondary").color,
 83            width: 1,
 84        },
 85        status_bar: {
 86            height: 24,
 87            itemSpacing: 8,
 88            padding: {
 89                left: 6,
 90                right: 6,
 91            },
 92            cursorPosition: text(theme, "sans", "muted"),
 93            diagnosticMessage: text(theme, "sans", "muted"),
 94            lspMessage: text(theme, "sans", "muted"),
 95        },
 96        titlebar: {
 97            avatarWidth: 18,
 98            height: 32,
 99            background: backgroundColor(theme, 100),
100            shareIconColor: iconColor(theme, "secondary"),
101            shareIconActiveColor: iconColor(theme, "feature"),
102            title: text(theme, "sans", "primary"),
103            avatar: {
104                cornerRadius: 10,
105                border: {
106                    color: "#00000088",
107                    width: 1,
108                },
109            },
110            avatarRibbon: {
111                height: 3,
112                width: 12,
113                // TODO: The background for this ideally should be 
114                // set with a token, not hardcoded in rust
115            },
116            border: border(theme, "primary", { bottom: true }),
117            signInPrompt,
118            hoveredSignInPrompt: {
119                ...signInPrompt,
120                ...text(theme, "sans", "active"),
121                size: 13,
122            },
123            offlineIcon: {
124                color: iconColor(theme, "secondary"),
125                width: 16,
126                padding: {
127                    right: 4,
128                },
129            },
130            outdatedWarning: {
131                ...text(theme, "sans", "warning"),
132                size: 13,
133            },
134        },
135        toolbar: {
136            height: 34,
137            background: backgroundColor(theme, 500),
138            border: border(theme, "secondary", { bottom: true }),
139            itemSpacing: 8,
140            padding: { left: 16, right: 8, top: 4, bottom: 4 },
141        },
142        breadcrumbs: {
143            ...text(theme, "mono", "secondary"),
144            padding: { left: 6 },
145        },
146        disconnectedOverlay: {
147            ...text(theme, "sans", "active"),
148            background: "#000000aa",
149        },
150    };
151}