fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-24 03:08:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

Migrate dialogs to Rust and add a New File dialog (#623)

Browse Source 
* Migrate coming soon and about dialog to Rust

* Migrate confirm close and close all

* Migrate dialog error

* Improve keyboard navigation throughout UI

* Cleanup and fix panic dialog

* Reduce css spacing to better match old dialogs

* Add new document modal

* Fix crash when generating default name

* Populate rust about graphite data on startup

* Code review changes

* Move one more :focus CSS rule into App.vue

* Add a dialog message and move dialogs

* Split out keyboard input navigation from this branch

* Improvements including simplifying panic dialog code

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
0HyperCube
2022-05-07 09:59:52 +01:00
committed by Keavon Chambers
co-authored by Keavon Chambers
parent 1a8cc9654a
commit 4b7d8b7ab0
44 changed files with 1017 additions and 390 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/widgets/inputs/CheckboxInput.vue
+3 -1
View File
@@ -1,6 +1,6 @@
<template>
<LayoutRow class="checkbox-input" :class="{ 'outline-style': outlineStyle }">
<input type="checkbox" :id="`checkbox-input-${id}`" :checked="checked" @input="(e) => $emit('update:checked', (e.target as HTMLInputElement).checked)" />
<input type="checkbox" :id="`checkbox-input-${id}`" :checked="checked" @change="(e) => $emit('update:checked', (e.target as HTMLInputElement).checked)" />
<label :for="`checkbox-input-${id}`">
<LayoutRow class="checkbox-box">
<IconLabel :icon="icon" />
@@ -12,6 +12,7 @@
<style lang="scss">
.checkbox-input {
flex: 0 0 auto;
align-items: center;
input {
display: none;
@@ -19,6 +20,7 @@
label {
display: flex;
height: 16px;
.checkbox-box {
flex: 0 0 auto;
frontend/src/components/widgets/inputs/FontInput.vue
+2 -2
View File
@@ -1,5 +1,5 @@
<template>
<LayoutRow class="dropdown-input">
<LayoutRow class="font-input">
<LayoutRow class="dropdown-box" :class="{ disabled }" :style="{ minWidth: `${minWidth}px` }" @click="() => clickDropdownBox()" data-hover-menu-spawner>
<span>{{ activeEntry.label }}</span>
<IconLabel class="dropdown-arrow" :icon="'DropdownArrow'" />
@@ -16,7 +16,7 @@
</template>
<style lang="scss">
.dropdown-input {
.font-input {
position: relative;
.dropdown-box {
frontend/src/components/widgets/inputs/MenuBarInput.vue
+7 -10
View File
@@ -65,15 +65,7 @@ function makeMenuEntries(editor: EditorState): MenuListEntries {
ref: undefined,
children: [
[
{ label: "New", icon: "File", shortcut: ["KeyControl", "KeyN"], shortcutRequiresLock: true, action: (): void => editor.instance.new_document() },
{
label: "New 1920x1080",
icon: "File",
action: (): void => {
editor.instance.new_document();
editor.instance.create_artboard_and_fit_to_viewport(0, 0, 1920, 1080);
},
},
{ label: "New…", icon: "File", shortcut: ["KeyControl", "KeyN"], shortcutRequiresLock: true, action: (): void => editor.instance.request_new_document_dialog() },
{ label: "Open…", shortcut: ["KeyControl", "KeyO"], action: (): void => editor.instance.open_document() },
{
label: "Open Recent",
@@ -168,7 +160,12 @@ function makeMenuEntries(editor: EditorState): MenuListEntries {
label: "Help",
ref: undefined,
children: [
[{ label: "About Graphite", action: async (): Promise<void> => editor.instance.request_about_graphite_dialog() }],
[
{
label: "About Graphite",
action: async (): Promise<void> => editor.instance.request_about_graphite_dialog(),
},
],
[
{ label: "Report a Bug", action: (): unknown => window.open("https://github.com/GraphiteEditor/Graphite/issues/new", "_blank") },
{ label: "Visit on GitHub", action: (): unknown => window.open("https://github.com/GraphiteEditor/Graphite", "_blank") },