github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-02-05 08:55:20 -05:00
Code Issues Packages Projects Releases Wiki Activity

Various style updates (#7972)

Browse Source 
* fix card selection dot always being on

* new mapbox styles

* updated styles for field notes

* update bookmark icon

* increase currrent user avatar opactiy

* Clean up info notes

* divider style updates

* divider rule styling

* notice styling

* update revision drawer pane order

* tighten up revision drawer list

* notice copy updates

* revision spacing

* revision date divider styling

* shorter revision date in drawer dropdown

* add no value to revision diffs

* v-detail icons

* revisions styling

* fix sort icon hover

* adjust global and private vertical form spacing

* reduce navigation and v-list sizing

* slightly reduce module and info sidebar size
This commit is contained in:
Ben Haynes
2021-09-10 15:01:58 -04:00
committed by GitHub
parent ff2d6aaa07
commit 28868e60f8
30 changed files with 120 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/components/v-avatar/v-avatar.vue
View File

@@ -65,7 +65,7 @@ body {
}
.large {
--v-avatar-size: 64px;
--v-avatar-size: 60px;
}
.x-large {

2
app/src/components/v-button/v-button.vue
View File

@@ -314,7 +314,7 @@ export default defineComponent({
}
.x-large {
--v-button-height: 64px;
--v-button-height: 60px;
--v-button-font-size: 18px;
--v-button-min-width: 180px;

2
app/src/components/v-detail/v-detail.vue
View File

@@ -2,7 +2,7 @@
<div class="v-detail" :class="{ disabled }">
<slot name="activator" v-bind="{ active: internalActive, enable, disable, toggle }">
<v-divider @click="internalActive = !internalActive">
<v-icon v-if="!disabled" :name="internalActive ? 'unfold_less' : 'unfold_more'" small />
<v-icon v-if="!disabled" :name="internalActive ? 'expand_more' : 'chevron_right'" small />
<slot name="title">{{ label }}</slot>
</v-divider>
</slot>

7
app/src/components/v-form/form-field.vue
View File

@@ -50,7 +50,7 @@
</v-card>
</v-dialog>
<small v-if="field.meta && field.meta.note" v-md="field.meta.note" class="note" />
<small v-if="field.meta && field.meta.note" v-md="field.meta.note" class="type-note" />
<small v-if="validationError" class="validation-error">
{{ validationMessage }}
@@ -217,12 +217,11 @@ export default defineComponent({
position: relative;
}
.note {
.type-note {
position: relative;
display: block;
max-width: 520px;
margin-top: 4px;
color: var(--foreground-subdued);
font-style: italic;
}
.invalid {

1
app/src/components/v-info/v-info.vue
View File

@@ -79,6 +79,7 @@ export default defineComponent({
.content {
max-width: 300px;
color: var(--foreground-subdued);
line-height: 22px;
&:not(:last-child) {
margin-bottom: 24px;

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

@@ -130,11 +130,11 @@ export default defineComponent({
body {
--v-list-item-padding-large: 0 8px;
--v-list-item-padding: 0 8px 0 calc(8px + var(--v-list-item-indent, 0px));
--v-list-item-margin-large: 4px 0;
--v-list-item-margin-large: 2px 0;
--v-list-item-margin: 2px 0;
--v-list-item-min-width: none;
--v-list-item-max-width: none;
--v-list-item-min-height-large: 40px;
--v-list-item-min-height-large: 36px;
--v-list-item-min-height: 32px;
--v-list-item-max-height: auto;
--v-list-item-border-radius: var(--border-radius);

5
app/src/components/v-notice/v-notice.vue
View File

@@ -64,6 +64,7 @@ body {
min-height: var(--input-height);
padding: 12px 16px;
color: var(--v-notice-color);
line-height: 22px;
background-color: var(--v-notice-background-color);
border-radius: var(--border-radius);
}
@@ -72,6 +73,10 @@ body {
--v-icon-color: var(--v-notice-icon-color);
}
.v-icon.left {
margin-right: 16px;
}
.info {
--v-notice-icon-color: var(--primary);
--v-notice-background-color: var(--background-normal);