mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-26 19:38:13 +08:00
* 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>
73 lines
1.9 KiB
Vue
73 lines
1.9 KiB
Vue
<template>
|
|
<LayoutRow class="title-bar">
|
|
<LayoutRow class="header-part">
|
|
<WindowButtonsMac :maximized="maximized" v-if="platform === 'Mac'" />
|
|
<MenuBarInput v-if="platform !== 'Mac'" />
|
|
</LayoutRow>
|
|
<LayoutRow class="header-part">
|
|
<WindowTitle :text="`${activeDocumentDisplayName} - Graphite`" />
|
|
</LayoutRow>
|
|
<LayoutRow class="header-part">
|
|
<WindowButtonsWindows :maximized="maximized" v-if="platform === 'Windows' || platform === 'Linux'" />
|
|
<WindowButtonsWeb :maximized="maximized" v-if="platform === 'Web'" />
|
|
</LayoutRow>
|
|
</LayoutRow>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.title-bar {
|
|
height: 28px;
|
|
flex: 0 0 auto;
|
|
|
|
.header-part {
|
|
flex: 1 1 100%;
|
|
|
|
&:nth-child(1) {
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
&:nth-child(2) {
|
|
justify-content: center;
|
|
}
|
|
|
|
&:nth-child(3) {
|
|
justify-content: flex-end;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, PropType } from "vue";
|
|
|
|
import LayoutRow from "@/components/layout/LayoutRow.vue";
|
|
import MenuBarInput from "@/components/widgets/inputs/MenuBarInput.vue";
|
|
import WindowButtonsMac from "@/components/window/title-bar/WindowButtonsMac.vue";
|
|
import WindowButtonsWeb from "@/components/window/title-bar/WindowButtonsWeb.vue";
|
|
import WindowButtonsWindows from "@/components/window/title-bar/WindowButtonsWindows.vue";
|
|
import WindowTitle from "@/components/window/title-bar/WindowTitle.vue";
|
|
|
|
export type Platform = "Windows" | "Mac" | "Linux" | "Web";
|
|
|
|
export default defineComponent({
|
|
inject: ["documents"],
|
|
props: {
|
|
platform: { type: String as PropType<Platform>, required: true },
|
|
maximized: { type: Boolean as PropType<boolean>, required: true },
|
|
},
|
|
computed: {
|
|
activeDocumentDisplayName() {
|
|
return this.documents.state.documents[this.documents.state.activeDocumentIndex].displayName;
|
|
},
|
|
},
|
|
components: {
|
|
MenuBarInput,
|
|
WindowTitle,
|
|
WindowButtonsWindows,
|
|
WindowButtonsMac,
|
|
WindowButtonsWeb,
|
|
LayoutRow,
|
|
},
|
|
});
|
|
</script>
|