github/directus
1
1
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-04-03 03:00:39 -04:00
Code Issues Packages Projects Releases Wiki Activity

Various style tweaks (#555)

Browse Source 
* icon width

* updated pagination style

* file preview zoom

WIP — shouldn’t show up on MODAL preview

* overlay/modal close button styling

* duplicate key

* bookmark styling

* card fade

also adds an rgb value for the page background variable

* style per page dropdown

* cards per page dropdown color

* inset non-dense notifications within sidebar

* reduce border radius for xs avatars

* hide non-expanded prepend/append

* reduce sidebar padding

this gives content a bit more room

* WIP: split and update comments and revisions

work in progress

* fix collections module name

* fix file library title

* consistent border on disabled

* fix title/breadcrumb positioning

* breadcrumb fixes

* add “open” button to image interface

WIP — this needs the actual logic, and we might want to remove a button

* hide presets delete until selection

* image shadow and subtext color

* Remove breadcrumb calculation

* increase contrast for image subtitle

* fix textarea hover style

* Update src/modules/collections/index.ts

* Fix typing of translateresult to format

* Add undefined check to collection name

* Put v-if on dialog instead of button

* Remove breadcrumb logic

* Remove breadcrumb calculation

* Rename shadow to collapsed in header bar

* fix rating star display going over table header

* show collection breadcrumb for bookmarks

WIP — needs the formatted collection title

* shorter error to avoid wrapping

* remove periods

* Fix standard font-size of divider label, use large in interface

* Add extra date format strings

* Structure comments, support date headers

* Add ability to delete comments

* Add edited on status badge

Co-authored-by: rijkvanzanten <rijkvanzanten@me.com>
This commit is contained in:
Ben Haynes
2020-05-12 20:10:48 -04:00
committed by GitHub
parent ef1912c109
commit 7aa4911caa
50 changed files with 1465 additions and 439 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/interfaces/divider/divider.vue
View File

@@ -6,6 +6,7 @@
'--v-divider-color': color,
'--v-divider-label-color': color,
}"
large
>
<template v-if="icon" #icon><v-icon :name="icon" /></template>
<template v-if="title" #default>{{ title }}</template>

26
src/interfaces/image/image.vue
View File

@@ -4,16 +4,25 @@
<img :src="src" alt="" role="presentation" />
<div class="shadow" />
<div class="actions">
<v-button icon rounded @click="editorActive = true">
<v-icon name="crop_rotate" />
</v-button>
<v-button icon rounded @click="lightboxActive = true">
<v-button icon rounded @click="lightboxActive = true" v-tooltip="$t('zoom')">
<v-icon name="zoom_in" />
</v-button>
<v-button icon rounded :href="image.data.full_url" :download="image.filename_download">
<v-button
icon
rounded
:href="image.data.full_url"
:download="image.filename_download"
v-tooltip="$t('download')"
>
<v-icon name="file_download" />
</v-button>
<v-button icon rounded @click="deselect">
<v-button icon rounded @click="lightboxActive = true" v-tooltip="$t('open')">
<v-icon name="launch" />
</v-button>
<v-button icon rounded @click="editorActive = true" v-tooltip="$t('edit')">
<v-icon name="crop_rotate" />
</v-button>
<v-button icon rounded @click="deselect" v-tooltip="$t('deselect')">
<v-icon name="close" />
</v-button>
</div>
@@ -216,7 +225,7 @@ img {
line-height: 1;
white-space: nowrap;
text-overflow: ellipsis;
background: linear-gradient(180deg, rgba(38, 50, 56, 0) 0%, rgba(38, 50, 56, 0.75) 100%);
background: linear-gradient(180deg, rgba(38, 50, 56, 0) 0%, rgba(38, 50, 56, 0.25) 100%);
transition: height var(--fast) var(--transition);
}
@@ -271,13 +280,14 @@ img {
height: 17px;
max-height: 0;
overflow: hidden;
color: var(--foreground-subdued);
color: rgba(255, 255, 255, 0.75);
transition: max-height var(--fast) var(--transition);
}
.image-preview:hover {
.shadow {
height: 100%;
background: linear-gradient(180deg, rgba(38, 50, 56, 0) 0%, rgba(38, 50, 56, 0.5) 100%);
}
.actions .v-button {