68d072bProject picker landing page with per-project file systemsJeremy Magland 1/* Project-picker landing page, themed with the same --vscode-* variables as
2 * the workbench (in the spirit of VS Code's welcome page). */
4.landing {
5 height: 100%;
6 overflow-y: auto;
7 background-color: var(--vscode-editor-background);
8 color: var(--vscode-foreground);
9 font-family: system-ui, 'Ubuntu', 'Droid Sans', sans-serif;
10 font-size: 14px;
11}
13.landing-inner {
14 max-width: 720px;
15 margin: 0 auto;
16 padding: 48px 32px 64px;
17}
19.landing-header h1 {
20 margin: 0 0 6px;
21 font-size: 34px;
22 font-weight: 300;
23 letter-spacing: 0.5px;
24}
26.landing-subtitle {
27 margin: 0 0 4px;
28 color: var(--vscode-descriptionForeground);
29}
31.landing-link {
32 color: var(--vscode-textLink-foreground);
33 text-decoration: none;
34 font-size: 13px;
35}
37.landing-link:hover {
38 text-decoration: underline;
39}
41.landing-section {
42 margin-top: 36px;
43}
45.landing-section h2 {
46 margin: 0 0 12px;
47 font-size: 18px;
48 font-weight: 400;
49 border-bottom: 1px solid var(--vscode-panel-border);
50 padding-bottom: 6px;
51}
53.landing-start {
54 display: flex;
55 gap: 10px;
56}
58.landing-button {
59 padding: 6px 14px;
60 font-size: 13px;
61 font-family: inherit;
62 cursor: pointer;
63 border-radius: 3px;
64 border: 1px solid var(--vscode-button-border, transparent);
65 background-color: var(--vscode-button-secondaryBackground);
66 color: var(--vscode-button-secondaryForeground);
67}
69.landing-button:hover {
70 background-color: var(--vscode-button-secondaryHoverBackground);
71}
73.landing-button.primary {
74 background-color: var(--vscode-button-background);
75 color: var(--vscode-button-foreground);
76}
78.landing-button.primary:hover {
79 background-color: var(--vscode-button-hoverBackground);
80}
82.landing-button:disabled {
83 opacity: 0.6;
84 cursor: default;
85}
87.landing-projects {
88 display: flex;
89 flex-direction: column;
90}
92.landing-empty {
93 color: var(--vscode-descriptionForeground);
94 padding: 8px 0;
95}
97.landing-project {
98 display: flex;
99 align-items: center;
100 gap: 12px;
101 padding: 7px 8px;
102 border-radius: 4px;
103}
105.landing-project:hover {
106 background-color: var(--vscode-list-hoverBackground);
107}
109.landing-project-name {
110 color: var(--vscode-textLink-foreground);
111 text-decoration: none;
112 font-size: 14px;
113 overflow: hidden;
114 text-overflow: ellipsis;
115 white-space: nowrap;
116}
118.landing-project-name:hover {
119 text-decoration: underline;
120}
122.landing-project-meta {
123 color: var(--vscode-descriptionForeground);
124 font-size: 12px;
125 flex: 1;
126}
128.landing-project-actions {
129 display: flex;
130 gap: 2px;
131 visibility: hidden;
132}
134.landing-project:hover .landing-project-actions {
135 visibility: visible;
136}
138.landing-action {
139 background: none;
140 border: none;
141 padding: 2px 7px;
142 font-size: 12px;
143 font-family: inherit;
144 cursor: pointer;
145 border-radius: 3px;
146 color: var(--vscode-textLink-foreground);
147}
149.landing-action:hover {
150 background-color: var(--vscode-toolbar-hoverBackground);
151}