mirror of
https://github.com/directus/directus.git
synced 2026-02-04 03:05:05 -05:00
* no cursor when disabled * consistent disabled styling * divider icon alignment * don’t show last item’s border * notifications spacing * status placeholder * default status icon placeholder * fix textarea focus style * tags styling * proper tags padding when empty * proper input number step hovers * show background color * Fix data-model collections overview name class * Don't use display template for batch mode * Fix headline being hidden * Use formatted name fo bookmarks breadcrumb * Move drawer open to app store * Fix tests * slider value style * Add comments to users/files * Make comments selectable * Move window width drawer state to app parent * Fix private user condition * Allow relationships to system collections * Refresh revisions drawer detail on save and stay * Add disabled support to m2o / user * Center v-infos * Hide default drag image * Ellipsis all the things * Use icon interface for fallback icon * Render icons grid based on available space * Fix ellipsis on cardsl * fix batch edit checkbox styling * Let render template ellipsis its raw values * Fix render template * Default cropping to current aspect ratio * missing translation * secondary button style so sorry, rijk… it’s the only one (promise) * Add image dimensions, add drag mode * track the apology * no elipses on titles * Add cancel crop button * Only show new dimensions on crop * Inform file preview if it's in modal * preview styling * Install pretty-bytes * Show file info in drawer sidebar * Use outline icons in drawer sidebar * don’t confuse null with subdued text value * edge-case justification * Show character count remaining * Fix storybook + typing error * Add length constraints to color * Watch value prop * Fix tags * Open icon on icon click * Fix overflow of title * Show batch editing x items * Fix edits emptying input on cancel * Don't count locked filters in no results message * simple batch edit title * Fix headline being invisible * Add no-options notice to interfaces/displays * Use existing collection preset in browse modal * Don't emit null on invalid hex * Use correct titles in modal-detail * style char remaining * file info sidebar styling * Another attempt at trying to make render template behave in any contetx * Show remaining char count on focus only * Remove fade, prevent jumping * Render skeleton loader in correct height * Fix o2m not fetching items * Pass collection/field to render display in o2m * Add no-items message in table * Add default state to v-table * Allow ISO8601 in datetime interface * Title format selected icon name * avoid blinking bg on load * align characters remaining * Default to tabular in browse modal * Add disabled string * Add center + make gray default notice * Add disabled-no-value state * Export getItems * Expose refresh method on layouts * Fix (batch) deletion from browse) * Fix interface disabled on batch * Add interface not found notice * Add default label (active) for toggle interface * Use options / prop default for toggle * Support ISO 8601 in datetime display * Render edit form in form width * Fix deselecting newly selected item * Undo all selection when closing browse modal * Fix deselecting newly selected item * wider divider * update webhooks table * Fix checkbox label disappearing * Fix tests.. by removing them Co-authored-by: Ben Haynes <ben@rngr.org>
115 lines
2.0 KiB
SCSS
115 lines
2.0 KiB
SCSS
#tooltip {
|
|
$arrow-alignment: 5px;
|
|
|
|
--tooltip-foreground-color: var(--foreground-inverted);
|
|
--tooltip-background-color: var(--background-inverted);
|
|
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 500;
|
|
display: none;
|
|
max-width: 260px;
|
|
padding: 4px 8px;
|
|
color: var(--tooltip-foreground-color);
|
|
background-color: var(--tooltip-background-color);
|
|
border-radius: 4px;
|
|
transition: opacity 200ms;
|
|
|
|
&.inverted {
|
|
--tooltip-foreground-color: var(--foreground-normal);
|
|
--tooltip-background-color: var(--background-subdued);
|
|
}
|
|
|
|
&.visible {
|
|
display: block;
|
|
}
|
|
|
|
&.enter,
|
|
&.leave-active {
|
|
opacity: 0;
|
|
}
|
|
|
|
&.enter-active,
|
|
&.leave {
|
|
opacity: 1;
|
|
}
|
|
|
|
&::after {
|
|
position: absolute;
|
|
top: -5px;
|
|
left: calc(50% - 5px);
|
|
width: 0;
|
|
height: 0;
|
|
border-right: 5px solid transparent;
|
|
border-bottom: 5px solid var(--tooltip-background-color);
|
|
border-left: 5px solid transparent;
|
|
content: '';
|
|
}
|
|
|
|
&.start::after {
|
|
right: $arrow-alignment;
|
|
left: unset;
|
|
}
|
|
|
|
&.end::after {
|
|
left: $arrow-alignment;
|
|
}
|
|
|
|
&.top::after {
|
|
top: unset;
|
|
bottom: -5px;
|
|
left: calc(50% - 5px);
|
|
border-top: 5px solid var(--tooltip-background-color);
|
|
border-right: 5px solid transparent;
|
|
border-bottom: unset;
|
|
border-left: 5px solid transparent;
|
|
}
|
|
|
|
&.top.start::after {
|
|
right: $arrow-alignment;
|
|
left: unset;
|
|
}
|
|
|
|
&.top.end::after {
|
|
left: $arrow-alignment;
|
|
}
|
|
|
|
&.left::after {
|
|
top: calc(50% - 5px);
|
|
right: -5px;
|
|
left: unset;
|
|
border-top: 5px solid transparent;
|
|
border-right: unset;
|
|
border-bottom: 5px solid transparent;
|
|
border-left: 5px solid var(--tooltip-background-color);
|
|
}
|
|
|
|
&.left.start::after {
|
|
top: unset;
|
|
bottom: $arrow-alignment;
|
|
}
|
|
|
|
&.left.end::after {
|
|
top: $arrow-alignment;
|
|
}
|
|
|
|
&.right::after {
|
|
top: calc(50% - 5px);
|
|
left: -5px;
|
|
border-top: 5px solid transparent;
|
|
border-right: 5px solid var(--tooltip-background-color);
|
|
border-bottom: 5px solid transparent;
|
|
border-left: unset;
|
|
}
|
|
|
|
&.right.start::after {
|
|
top: unset;
|
|
bottom: $arrow-alignment;
|
|
}
|
|
|
|
&.right.end::after {
|
|
top: $arrow-alignment;
|
|
}
|
|
}
|