github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-01-27 14:28:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

Rearrange field-select

Browse Source
This commit is contained in:
rijkvanzanten
2020-09-02 13:46:04 -04:00
parent 1b71dd294e
commit 35cdf3a6cb
2 changed files with 35 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
app/src/components/v-list/v-list-item-icon.vue
View File

@@ -17,6 +17,12 @@ export default defineComponent({
});
</script>
<style>
body {
--v-list-item-icon-color: var(--foreground-subdued);
}
</style>
<style lang="scss" scoped>
.v-list-item-icon {
$this: &;
@@ -62,8 +68,8 @@ export default defineComponent({
}
}
&.dense:not(.nav) #{$this} {
color: var(--foreground-subdued);
&.dense:not(.nav) #{$this} .v-icon {
--v-icon-color: var(--v-list-item-icon-color);
}
}
}

42
app/src/modules/settings/routes/data-model/fields/components/field-select.vue
View File

@@ -34,20 +34,7 @@
</v-list-item-icon>
<v-list-item-content>{{ $t('duplicate_field') }}</v-list-item-content>
</v-list-item>
<v-divider />
<v-list-item @click="setWidth('half')" :disabled="hidden || field.meta.width === 'half'">
<v-list-item-icon><v-icon name="border_vertical" /></v-list-item-icon>
<v-list-item-content>{{ $t('half_width') }}</v-list-item-content>
</v-list-item>
<v-list-item @click="setWidth('full')" :disabled="hidden || field.meta.width === 'full'">
<v-list-item-icon><v-icon name="border_right" /></v-list-item-icon>
<v-list-item-content>{{ $t('full_width') }}</v-list-item-content>
</v-list-item>
<v-list-item @click="setWidth('fill')" :disabled="hidden || field.meta.width === 'fill'">
<v-list-item-icon><v-icon name="aspect_ratio" /></v-list-item-icon>
<v-list-item-content>{{ $t('fill_width') }}</v-list-item-content>
</v-list-item>
<v-divider />
<v-list-item @click="toggleVisibility">
<template v-if="hidden === false">
<v-list-item-icon><v-icon name="visibility_off" /></v-list-item-icon>
@@ -59,7 +46,26 @@
</template>
</v-list-item>
<v-list-item @click="deleteActive = true">
<v-divider />
<v-list-item @click="setWidth('half')" :disabled="hidden || field.meta.width === 'half'">
<v-list-item-icon><v-icon name="border_vertical" /></v-list-item-icon>
<v-list-item-content>{{ $t('half_width') }}</v-list-item-content>
</v-list-item>
<v-list-item @click="setWidth('full')" :disabled="hidden || field.meta.width === 'full'">
<v-list-item-icon><v-icon name="border_right" /></v-list-item-icon>
<v-list-item-content>{{ $t('full_width') }}</v-list-item-content>
</v-list-item>
<v-list-item @click="setWidth('fill')" :disabled="hidden || field.meta.width === 'fill'">
<v-list-item-icon><v-icon name="aspect_ratio" /></v-list-item-icon>
<v-list-item-content>{{ $t('fill_width') }}</v-list-item-content>
</v-list-item>
<v-divider />
<v-list-item @click="deleteActive = true" class="danger">
<v-list-item-icon><v-icon name="delete" outline /></v-list-item-icon>
<v-list-item-content>
{{ $t('delete_field') }}
@@ -296,4 +302,10 @@ export default defineComponent({
}
}
}
.v-list-item.danger {
--v-list-item-color: var(--danger);
--v-list-item-color-hover: var(--danger);
--v-list-item-icon-color: var(--danger);
}
</style>