jess
/
Graphite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add note about the September 2025 release to the editor welcome screen

This commit is contained in:
Keavon Chambers 2025-09-20 02:08:41 -07:00
parent ac4665683b
commit f4a0f272dd
3 changed files with 94 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/widgets/labels/TextLabel.svelte
View File

@ -84,5 +84,9 @@
flex: 0 0 30%;
text-align: right;
}
a {
color: inherit;
}
}
</style>

2
frontend/src/components/window/title-bar/WindowButtonsWeb.svelte
View File

@ -9,7 +9,7 @@
const fullscreen = getContext<FullscreenState>("fullscreen");
$: requestFullscreenHotkeys = fullscreen.keyboardLockApiSupported && !$fullscreen.keyboardLocked;
$: requestFullscreenHotkeys = $fullscreen.keyboardLockApiSupported && !$fullscreen.keyboardLocked;
async function handleClick() {
if ($fullscreen.windowFullscreen) fullscreen.exitFullscreen();

142
frontend/src/components/window/workspace/Panel.svelte
View File

@ -159,42 +159,54 @@
<svelte:component this={PANEL_COMPONENTS[panelType]} />
{:else}
<LayoutCol class="empty-panel" on:dragover={(e) => e.preventDefault()} on:drop={dropFile}>
<LayoutCol class="content">
<LayoutRow class="logotype">
<IconLabel icon="GraphiteLogotypeSolid" />
</LayoutRow>
<LayoutRow class="actions">
<table>
<tbody>
<tr>
<td>
<TextButton label="New Document" icon="File" flush={true} action={() => editor.handle.newDocumentDialog()} />
</td>
<td>
<UserInputLabel keysWithLabelsGroups={[[...platformModifiers(true), { key: "KeyN", label: "N" }]]} />
</td>
</tr>
<tr>
<td>
<TextButton label="Open Document" icon="Folder" flush={true} action={() => editor.handle.openDocument()} />
</td>
<td>
<UserInputLabel keysWithLabelsGroups={[[...platformModifiers(false), { key: "KeyO", label: "O" }]]} />
</td>
</tr>
<tr>
<td colspan="2">
<TextButton label="Open Demo Artwork" icon="Image" flush={true} action={() => editor.handle.demoArtworkDialog()} />
</td>
</tr>
<tr>
<td colspan="2">
<TextButton label="Support the Development Fund" icon="Heart" flush={true} action={() => editor.handle.visitUrl("https://graphite.rs/donate/")} />
</td>
</tr>
</tbody>
</table>
</LayoutRow>
<LayoutCol class="top-spacer"></LayoutCol>
<LayoutCol class="content-container">
<LayoutCol class="content">
<LayoutRow class="logotype">
<IconLabel icon="GraphiteLogotypeSolid" />
</LayoutRow>
<LayoutRow class="actions">
<table>
<tbody>
<tr>
<td>
<TextButton label="New Document" icon="File" flush={true} action={() => editor.handle.newDocumentDialog()} />
</td>
<td>
<UserInputLabel keysWithLabelsGroups={[[...platformModifiers(true), { key: "KeyN", label: "N" }]]} />
</td>
</tr>
<tr>
<td>
<TextButton label="Open Document" icon="Folder" flush={true} action={() => editor.handle.openDocument()} />
</td>
<td>
<UserInputLabel keysWithLabelsGroups={[[...platformModifiers(false), { key: "KeyO", label: "O" }]]} />
</td>
</tr>
<tr>
<td colspan="2">
<TextButton label="Open Demo Artwork" icon="Image" flush={true} action={() => editor.handle.demoArtworkDialog()} />
</td>
</tr>
<tr>
<td colspan="2">
<TextButton label="Support the Development Fund" icon="Heart" flush={true} action={() => editor.handle.visitUrl("https://graphite.rs/donate/")} />
</td>
</tr>
</tbody>
</table>
</LayoutRow>
</LayoutCol>
</LayoutCol>
<LayoutCol class="bottom-message">
{#if new Date().getFullYear() === 2025}
<TextLabel italic={true} disabled={true}>
September 2025 release — <a href="https://youtube.com/watch?v=Vl5BA4g3QXM" target="_blank">What's new? (video)</a>
— Note: some older documents may render differently and require manual fixes.
<a href="https://ec6796b4.graphite-editor.pages.dev/" target="_blank">Need the old version?</a>
</TextLabel>
{/if}
</LayoutCol>
</LayoutCol>
{/if}
@ -211,6 +223,7 @@
height: 28px;
min-height: auto;
background: var(--color-1-nearblack); // Needed for the viewport hole punch on desktop
flex-shrink: 0;
&.min-widths .tab-group .tab {
min-width: 120px;
@ -333,30 +346,53 @@
background: var(--color-2-mildblack);
margin: 4px;
border-radius: 2px;
justify-content: center;
justify-content: space-between;
.content {
.content-container {
flex: 0 0 auto;
align-items: center;
justify-content: center;
.logotype {
margin-bottom: 40px;
.content {
flex: 0 0 auto;
align-items: center;
svg {
width: auto;
height: 120px;
}
}
.logotype {
margin-top: 8px;
margin-bottom: 40px;
.actions {
table {
border-spacing: 8px;
margin: -8px;
td {
padding: 0;
svg {
width: auto;
height: 120px;
}
}
.actions {
margin-bottom: 8px;
table {
border-spacing: 8px;
margin: -8px;
td {
padding: 0;
}
}
}
}
}
.top-spacer {
flex: 0 1 48px;
}
.bottom-message {
flex: 0 0 48px;
align-items: center;
justify-content: end;
.text-label {
white-space: wrap;
margin: 0 1em;
}
}
}