@dataloop-ai/components 0.18.35 → 0.18.37
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -14,7 +14,7 @@ import { defineComponent, PropType } from 'vue-demi'
|
|
|
14
14
|
import { getColor } from '../../../utils'
|
|
15
15
|
import { DlTransformOptions } from '../../shared/types'
|
|
16
16
|
|
|
17
|
-
type Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p'
|
|
17
|
+
type Variant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'div'
|
|
18
18
|
|
|
19
19
|
const sizes = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'body', 'small']
|
|
20
20
|
|
|
@@ -77,7 +77,7 @@ export default defineComponent({
|
|
|
77
77
|
}
|
|
78
78
|
} else {
|
|
79
79
|
if (sizes.includes(this.variant)) {
|
|
80
|
-
classes.push(`dl-typography--${this.
|
|
80
|
+
classes.push(`dl-typography--${this.variant}`)
|
|
81
81
|
} else {
|
|
82
82
|
classes.push(`dl-typography--body`)
|
|
83
83
|
}
|
|
@@ -121,6 +121,7 @@ export default defineComponent({
|
|
|
121
121
|
font-size: var(--dl-font-size-small);
|
|
122
122
|
}
|
|
123
123
|
|
|
124
|
+
// important needed above for sizing of h tags.. quasar conflict
|
|
124
125
|
// to deal with quasar conflicts.
|
|
125
126
|
line-height: initial !important;
|
|
126
127
|
}
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
<dl-page-layout>
|
|
18
18
|
<template #header>
|
|
19
19
|
<dl-page-layout-header
|
|
20
|
+
title="testsetest"
|
|
20
21
|
:counters="[
|
|
21
22
|
{
|
|
22
23
|
value: 200,
|
|
@@ -36,12 +37,12 @@
|
|
|
36
37
|
}
|
|
37
38
|
]"
|
|
38
39
|
>
|
|
39
|
-
<template #
|
|
40
|
-
test title
|
|
40
|
+
<template #actions>
|
|
41
41
|
<dl-button
|
|
42
|
-
label="testsetests"
|
|
43
42
|
outlined
|
|
44
|
-
|
|
43
|
+
style="margin-left: 10px"
|
|
44
|
+
padding="5px"
|
|
45
|
+
label="Switch to Basic Browser"
|
|
45
46
|
/>
|
|
46
47
|
</template>
|
|
47
48
|
<template #subtitle>
|
|
@@ -1,23 +1,25 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="page-layout-header">
|
|
3
|
-
<div class="page-layout-header__title">
|
|
3
|
+
<div class="page-layout-header__title-container">
|
|
4
4
|
<dl-typography
|
|
5
5
|
color="dl-color-lighter"
|
|
6
|
-
|
|
6
|
+
variant="h6"
|
|
7
7
|
>
|
|
8
8
|
<slot name="subtitle">
|
|
9
9
|
{{ subTitle }}
|
|
10
10
|
</slot>
|
|
11
11
|
</dl-typography>
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
12
|
+
<div class="page-layout-header__title">
|
|
13
|
+
<dl-typography
|
|
14
|
+
color="dl-color-darker"
|
|
15
|
+
variant="h1"
|
|
16
|
+
>
|
|
17
|
+
<slot name="title">
|
|
18
|
+
{{ title }}
|
|
19
|
+
</slot>
|
|
20
|
+
</dl-typography>
|
|
21
|
+
<slot name="actions" />
|
|
22
|
+
</div>
|
|
21
23
|
</div>
|
|
22
24
|
<div
|
|
23
25
|
v-if="counters.length > 0"
|
|
@@ -69,7 +71,7 @@ export default defineComponent({
|
|
|
69
71
|
justify-content: center;
|
|
70
72
|
background-color: var(--dl-color-body-background);
|
|
71
73
|
|
|
72
|
-
&__title {
|
|
74
|
+
&__title-container {
|
|
73
75
|
display: flex;
|
|
74
76
|
height: 100%;
|
|
75
77
|
padding-left: 25px;
|
|
@@ -78,11 +80,17 @@ export default defineComponent({
|
|
|
78
80
|
flex-grow: 1;
|
|
79
81
|
}
|
|
80
82
|
|
|
83
|
+
&__title {
|
|
84
|
+
padding-bottom: 10px;
|
|
85
|
+
display: flex;
|
|
86
|
+
align-items: center;
|
|
87
|
+
}
|
|
88
|
+
|
|
81
89
|
&__counters {
|
|
82
90
|
display: flex;
|
|
83
91
|
height: 100%;
|
|
84
92
|
align-items: center;
|
|
85
|
-
justify-content: end;
|
|
93
|
+
justify-content: flex-end;
|
|
86
94
|
padding-right: 10px;
|
|
87
95
|
}
|
|
88
96
|
}
|