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

Move layouts definitions to backend and fix Firefox overlay scrollbars (#647)

Browse Source 
* Fix two-axis scrollbars in scrollable regions on Firefox

* Move Document Mode dropdown to the backend; and related code cleanup

* Port the Layer Tree options bar layout to the backend

* Port the tool shelf to the backend

* Clean up initialization and wasm wrapper

* Fix crash

* Fix missing document bar

* Remove unused functions in api.rs

* Code review

* Tool initalisation

* Remove some frontend functions

* Initalise -> Init so en-US/GB doesn't have to matter :)

* Remove blend_mode and opacity from LayerPanelEntry

Co-authored-by: 0hypercube <0hypercube@gmail.com>
This commit is contained in:
Keavon Chambers
2022-05-17 13:12:52 -07:00
co-authored by 0hypercube
parent 95435d8bf1
commit a8f09da5a2
50 changed files with 1034 additions and 978 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/widgets/WidgetRow.vue
+22 -4
View File
@@ -1,6 +1,6 @@
<template>
<div class="widget-row">
<template v-for="(component, index) in widgetData.widgets" :key="index">
<div :class="`widget-${direction}`">
<template v-for="(component, index) in widgets" :key="index">
<!-- TODO: Use `<component :is="" v-bind="attributesObject"></component>` to avoid all the separate components with `v-if` -->
<CheckboxInput v-if="component.kind === 'CheckboxInput'" v-bind="component.props" @update:checked="(value: boolean) => updateLayout(component.widget_id, value)" />
<ColorInput v-if="component.kind === 'ColorInput'" v-bind="component.props" @update:value="(value: string) => updateLayout(component.widget_id, value)" />
@@ -35,6 +35,12 @@
</template>
<style lang="scss">
.widget-column {
flex: 0 0 auto;
display: flex;
flex-direction: column;
}
.widget-row {
flex: 0 0 auto;
display: flex;
@@ -63,7 +69,7 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
import { WidgetRow } from "@/dispatcher/js-messages";
import { WidgetColumn, WidgetRow, isWidgetColumn, isWidgetRow } from "@/dispatcher/js-messages";
import IconButton from "@/components/widgets/buttons/IconButton.vue";
import PopoverButton from "@/components/widgets/buttons/PopoverButton.vue";
@@ -84,9 +90,21 @@ import Separator from "@/components/widgets/separators/Separator.vue";
export default defineComponent({
inject: ["editor"],
props: {
widgetData: { type: Object as PropType<WidgetRow>, required: true },
widgetData: { type: Object as PropType<WidgetColumn | WidgetRow>, required: true },
layoutTarget: { required: true },
},
computed: {
direction() {
if (isWidgetColumn(this.widgetData)) return "column";
if (isWidgetRow(this.widgetData)) return "row";
return "ERROR";
},
widgets() {
if (isWidgetColumn(this.widgetData)) return this.widgetData.columnWidgets;
if (isWidgetRow(this.widgetData)) return this.widgetData.rowWidgets;
return [];
},
},
methods: {
updateLayout(widgetId: BigInt, value: unknown) {
this.editor.instance.update_layout(this.layoutTarget, widgetId, value);