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

Add suffix widget non-rounding; add disabled state to many widgets

Browse Source
This commit is contained in:
Keavon Chambers
2022-11-04 15:03:22 -07:00
parent ff75e0eae9
commit a1e061fa14
28 changed files with 218 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/widgets/labels/IconLabel.vue
+6 -1
View File
@@ -1,5 +1,5 @@
<template>
<LayoutRow :class="['icon-label', iconSizeClass]" :title="tooltip">
<LayoutRow :class="['icon-label', iconSizeClass, { disabled }]" :title="tooltip">
<component :is="icon" />
</LayoutRow>
</template>
@@ -9,6 +9,10 @@
flex: 0 0 auto;
fill: var(--color-e-nearwhite);
&.disabled {
fill: var(--color-8-uppergray);
}
&.size-12 {
width: 12px;
height: 12px;
@@ -36,6 +40,7 @@ import LayoutRow from "@/components/layout/LayoutRow.vue";
export default defineComponent({
props: {
icon: { type: String as PropType<IconName>, required: true },
disabled: { type: Boolean as PropType<boolean>, default: false },
tooltip: { type: String as PropType<string | undefined>, required: false },
},
computed: {
frontend/src/components/widgets/labels/TextLabel.vue
+6 -1
View File
@@ -1,5 +1,5 @@
<template>
<span class="text-label" :class="{ bold, italic, multiline, 'table-align': tableAlign }" :style="minWidth > 0 ? `min-width: ${minWidth}px` : ''" :title="tooltip">
<span class="text-label" :class="{ disabled, bold, italic, multiline, 'table-align': tableAlign }" :style="minWidth > 0 ? `min-width: ${minWidth}px` : ''" :title="tooltip">
<slot></slot>
</span>
</template>
@@ -9,6 +9,10 @@
line-height: 18px;
white-space: nowrap;
&.disabled {
color: var(--color-8-uppergray);
}
&.bold {
font-weight: 700;
}
@@ -34,6 +38,7 @@ import { defineComponent, type PropType } from "vue";
export default defineComponent({
props: {
disabled: { type: Boolean as PropType<boolean>, default: false },
bold: { type: Boolean as PropType<boolean>, default: false },
italic: { type: Boolean as PropType<boolean>, default: false },
tableAlign: { type: Boolean as PropType<boolean>, default: false },