mirror of
https://github.com/directus/directus.git
synced 2026-02-16 03:55:19 -05:00
Use items (#354)
* Extract tabular items logic into composition * Fix racing condition in watchers * Remove empty test * Use v-select in detail sidebar tabular * Fix pagination styles * Reset to page 1 on sort / limit changes * Cast limit to string * Fix button test * Add content padding to tabular layout
This commit is contained in:
@@ -41,7 +41,7 @@ describe('Button', () => {
|
||||
},
|
||||
});
|
||||
|
||||
expect(component.find('.button').classes()).toContain('full-width');
|
||||
expect(component.classes()).toContain('full-width');
|
||||
});
|
||||
|
||||
it('Adds the rounded class for rounded buttons', () => {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="v-button">
|
||||
<div class="v-button" :class="{ secondary, 'full-width': fullWidth }">
|
||||
<slot name="prepend-outer" />
|
||||
<component
|
||||
:is="component"
|
||||
@@ -10,12 +10,10 @@
|
||||
sizeClass,
|
||||
`align-${align}`,
|
||||
{
|
||||
'full-width': fullWidth,
|
||||
rounded,
|
||||
icon,
|
||||
outlined,
|
||||
loading,
|
||||
secondary,
|
||||
active,
|
||||
dashed,
|
||||
tile,
|
||||
@@ -139,6 +137,20 @@ export default defineComponent({
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
&.secondary {
|
||||
--v-button-color: var(--foreground-color);
|
||||
--v-button-color-hover: var(--foreground-color);
|
||||
--v-button-color-activated: var(--foreground-color);
|
||||
--v-button-background-color: var(--background-normal-alt);
|
||||
--v-button-background-color-hover: var(--background-normal-alt);
|
||||
--v-button-background-color-activated: var(--background-normal-alt);
|
||||
}
|
||||
|
||||
&.full-width {
|
||||
display: flex;
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.button {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@@ -170,15 +182,6 @@ export default defineComponent({
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
&.secondary {
|
||||
--v-button-color: var(--foreground-color);
|
||||
--v-button-color-hover: var(--foreground-color);
|
||||
--v-button-color-activated: var(--foreground-color);
|
||||
--v-button-background-color: var(--background-normal-alt);
|
||||
--v-button-background-color-hover: var(--background-normal-alt);
|
||||
--v-button-background-color-activated: var(--background-normal-alt);
|
||||
}
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
}
|
||||
@@ -253,11 +256,6 @@ export default defineComponent({
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&.full-width {
|
||||
display: flex;
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.content,
|
||||
.spinner {
|
||||
max-width: 100%;
|
||||
|
||||
Reference in New Issue
Block a user