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

Replace the Vue frontend with Svelte

Browse Source
This commit is contained in:
Keavon Chambers
2023-03-10 03:54:39 -08:00
parent e539e43483
commit 6e20ea538b
83 changed files with 10013 additions and 19687 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/window/title-bar/WindowButtonsWindows.svelte
+34 -43
View File
@@ -1,55 +1,46 @@
<script lang="ts">
import { defineComponent, type PropType } from "vue";
import LayoutRow from "@/components/layout/LayoutRow.svelte";
import IconLabel from "@/components/widgets/labels/IconLabel.svelte";
import LayoutRow from "@/components/layout/LayoutRow.vue";
import IconLabel from "@/components/widgets/labels/IconLabel.vue";
export default defineComponent({
props: {
maximized: { type: Boolean as PropType<boolean>, default: false },
},
components: {
IconLabel,
LayoutRow,
},
});
export let maximized = false;
</script>
<template>
<LayoutRow class="window-button windows minimize" title="Minimize">
<IconLabel :icon="'WindowButtonWinMinimize'" />
<LayoutRow class="window-button windows minimize" tooltip="Minimize">
<IconLabel icon={"WindowButtonWinMinimize"} />
</LayoutRow>
{#if !maximized}
<LayoutRow class="window-button windows maximize" tooltip="Maximize">
<IconLabel icon={"WindowButtonWinMaximize"} />
</LayoutRow>
<LayoutRow class="window-button windows maximize" title="Maximize" v-if="!maximized">
<IconLabel :icon="'WindowButtonWinMaximize'" />
{:else}
<LayoutRow class="window-button windows restore-down" tooltip="Restore Down">
<IconLabel icon={"WindowButtonWinRestoreDown"} />
</LayoutRow>
<LayoutRow class="window-button windows restore-down" title="Restore Down" v-if="maximized">
<IconLabel :icon="'WindowButtonWinRestoreDown'" />
</LayoutRow>
<LayoutRow class="window-button windows close" title="Close">
<IconLabel :icon="'WindowButtonWinClose'" />
</LayoutRow>
</template>
{/if}
<LayoutRow class="window-button windows close" tooltip="Close">
<IconLabel icon={"WindowButtonWinClose"} />
</LayoutRow>
<style lang="scss">
.window-button.windows {
flex: 0 0 auto;
align-items: center;
padding: 0 17px;
svg {
fill: var(--color-e-nearwhite);
}
&:hover {
background: var(--color-6-lowergray);
<style lang="scss" global>
.window-button.windows {
flex: 0 0 auto;
align-items: center;
padding: 0 17px;
svg {
fill: var(--color-f-white);
fill: var(--color-e-nearwhite);
}
&:hover {
background: var(--color-6-lowergray);
svg {
fill: var(--color-f-white);
}
}
&.close:hover {
background: #e81123;
}
}
&.close:hover {
background: #e81123;
}
}
</style>