@resee-movies/nuxt-ux 0.11.0 → 0.11.1
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/dist/module.json +1 -1
- package/dist/runtime/components/Card.vue +1 -1
- package/dist/runtime/components/Dialog.vue +1 -1
- package/dist/runtime/components/Drawer.vue +1 -1
- package/dist/runtime/components/Icon.vue +1 -1
- package/dist/runtime/components/IconTextPair.vue +1 -1
- package/dist/runtime/components/Image.vue +1 -1
- package/dist/runtime/components/LayoutPageColumn.vue +1 -1
- package/dist/runtime/components/LayoutPageContainer.vue +27 -5
- package/dist/runtime/components/LayoutPageContainer.vue.d.ts +6 -2
- package/dist/runtime/components/Message.vue +1 -1
- package/dist/runtime/components/ProgressBar.vue +1 -1
- package/dist/runtime/components/ProgressSpinner.vue +1 -1
- package/dist/runtime/components/Tag.vue +1 -1
- package/dist/runtime/theme/css/brand/button.css +1 -1
- package/package.json +1 -1
package/dist/module.json
CHANGED
|
@@ -26,5 +26,5 @@ const slots = useSlots();
|
|
|
26
26
|
</script>
|
|
27
27
|
|
|
28
28
|
<style scoped>
|
|
29
|
-
@reference "tailwindcss"
|
|
29
|
+
@reference "tailwindcss";@layer components{.card{border:2px solid var(--color-background-scale-c);border-bottom-left-radius:--spacing(2);border-top-right-radius:--spacing(2);overflow:clip}.card .content{padding:--spacing(1.5)}.card.interactive{transition-duration:.5s;transition-property:border-color,border-radius,box-shadow;transition-timing-function:var(--default-transition-timing-function);-webkit-user-select:none;-moz-user-select:none;user-select:none}.card.interactive:focus-within,.card.interactive:hover{border-color:var(--color-background-scale-f);border-radius:0;box-shadow:var(--shadow-heavy)}}
|
|
30
30
|
</style>
|
|
@@ -119,5 +119,5 @@ const passthroughProps = computed(() => {
|
|
|
119
119
|
</script>
|
|
120
120
|
|
|
121
121
|
<style>
|
|
122
|
-
@reference "tailwindcss"
|
|
122
|
+
@reference "tailwindcss";@layer components{.dialog{margin:--spacing(2);width:100%}.dialog .header{align-items:center;display:flex;gap:--spacing(3);padding-bottom:--spacing(3)}.dialog .header .title{flex-grow:1;font-size:var(--text-lg)}.dialog .content{overflow-y:auto}.dialog.dialog-styles{background-color:var(--color-global-background);border:1px solid var(--color-global-background-accent);border-radius:var(--radius-md);height:calc(100% - --spacing(4));overflow:clip;@variant sm{box-shadow:var(--shadow-heavy);height:auto}}.dialog.dialog-styles .header{margin-inline:--spacing(3);margin-top:--spacing(3)}.dialog.dialog-styles .header.header-styles{border-bottom:1px solid var(--color-global-background-accent)}.dialog.dialog-styles .content{padding:--spacing(3)}}
|
|
123
123
|
</style>
|
|
@@ -73,5 +73,5 @@ const passthroughProps = computed(() => {
|
|
|
73
73
|
</script>
|
|
74
74
|
|
|
75
75
|
<style>
|
|
76
|
-
@reference "tailwindcss"
|
|
76
|
+
@reference "tailwindcss";@layer components{.drawer{--outgoing-scrollbar-width:0px;--drawer-border-radius:--spacing(3);--drawer-spacing:15px;--drawer-spacing-end:calc(var(--drawer-spacing) - var(--outgoing-scrollbar-width) + var(--p-scrollbar-width));background:var(--color-global-background);border-color:var(--color-global-background-accent);display:flex;flex-direction:column;gap:var(--drawer-spacing);padding-block:var(--drawer-spacing);padding-inline-end:var(--drawer-spacing-end);padding-inline-start:var(--drawer-spacing)}.drawer.drawer-left{--drawer-spacing-end:var(--drawer-spacing);border-bottom-right-radius:var(--drawer-border-radius);border-right-width:1px;border-top-right-radius:var(--drawer-border-radius);box-shadow:var(--shadow-heavy-right);height:100%;width:--spacing(80)}.drawer.drawer-right{border-bottom-left-radius:var(--drawer-border-radius);border-left-width:1px;border-top-left-radius:var(--drawer-border-radius);box-shadow:var(--shadow-heavy-left);height:100%;width:calc(--spacing(80) + var(--p-scrollbar-width))}.drawer.drawer-top{border-bottom-left-radius:var(--drawer-border-radius);border-bottom-right-radius:var(--drawer-border-radius);border-bottom-width:1px;box-shadow:var(--shadow-heavy);max-height:--spacing(100);width:100%}.drawer.drawer-bottom{border-top-left-radius:var(--drawer-border-radius);border-top-right-radius:var(--drawer-border-radius);border-top-width:1px;box-shadow:var(--shadow-heavy-top);max-height:--spacing(100);width:100%}.drawer .header{align-items:center;border-bottom:1px solid var(--color-global-background-accent);display:flex;padding-bottom:var(--drawer-spacing)}.drawer .header .title{flex-grow:1;font-size:var(--text-lg)}.drawer .content{flex-grow:1;overflow-y:auto}}
|
|
77
77
|
</style>
|
|
@@ -44,5 +44,5 @@ const props = defineProps({
|
|
|
44
44
|
</script>
|
|
45
45
|
|
|
46
46
|
<style scoped>
|
|
47
|
-
.icon{align-items:center;display:inline-flex}.icon:before{content:var(--zero-width-space)}.icon.sm{font-size:var(--icon-size-small)}.icon.md{font-size:var(--icon-size-medium)}.icon.lg{font-size:var(--icon-size-large)}.icon.xl{font-size:var(--icon-size-jumbo)}.icon.color-cycle{--resee-color-cycle-timing:cubic-bezier(0,.5,1,.5);animation-duration:8s;animation-iteration-count:infinite;animation-name:resee-color-cycle}@keyframes resee-color-cycle{0%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-red)}6.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-orange)}18.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-yellow)}31.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-green)}43.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-seaweed)}56.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-aqua)}68.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-blue)}81.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-indigo)}93.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-violet)}to{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-red)}}
|
|
47
|
+
@layer components{.icon{align-items:center;display:inline-flex}.icon:before{content:var(--zero-width-space)}.icon.sm{font-size:var(--icon-size-small)}.icon.md{font-size:var(--icon-size-medium)}.icon.lg{font-size:var(--icon-size-large)}.icon.xl{font-size:var(--icon-size-jumbo)}.icon.color-cycle{--resee-color-cycle-timing:cubic-bezier(0,.5,1,.5);animation-duration:8s;animation-iteration-count:infinite;animation-name:resee-color-cycle}@keyframes resee-color-cycle{0%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-red)}6.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-orange)}18.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-yellow)}31.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-green)}43.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-seaweed)}56.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-aqua)}68.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-blue)}81.25%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-indigo)}93.75%{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-violet)}to{animation-timing-function:var(--resee-color-cycle-timing);color:var(--color-resee-red)}}}
|
|
48
48
|
</style>
|
|
@@ -50,5 +50,5 @@ const slots = useSlots();
|
|
|
50
50
|
</script>
|
|
51
51
|
|
|
52
52
|
<style scoped>
|
|
53
|
-
@reference "tailwindcss"
|
|
53
|
+
@reference "tailwindcss";@layer components{.pair{--element-spacing:--spacing(1);align-items:baseline;display:inline}.pair.spacing-none{--element-spacing:0}.pair.spacing-wide{--element-spacing:--spacing(2)}.pair :deep(.leading-icon)>*{margin-inline-end:var(--element-spacing)}.pair :deep(.trailing-icon)>*{margin-inline-start:var(--element-spacing)}@variant max-md{.pair:is(.responsive-shrink .pair):deep(.leading-icon)>*{margin-inline-end:0}.pair:is(.responsive-shrink .pair):deep(.trailing-icon)>*{margin-inline-start:0}}}
|
|
54
54
|
</style>
|
|
@@ -145,5 +145,5 @@ const altText = computed(() => {
|
|
|
145
145
|
</script>
|
|
146
146
|
|
|
147
147
|
<style scoped>
|
|
148
|
-
@reference "tailwindcss"
|
|
148
|
+
@reference "tailwindcss";@layer components{.image{background-color:#fff;max-width:-moz-fit-content;max-width:fit-content;overflow:clip;position:relative;width:100%;@variant dark{background-color:#000}}.image.bordered{border:2px solid var(--color-global-background-accent)}.image.beveled{border-bottom-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl)}.image.raised{box-shadow:var(--shadow-heavy)}.image.glass:after{background-image:linear-gradient(110deg,transparent 25%,hsla(0,0%,100%,.15) 80%,transparent);content:var(--zero-width-space);inset:0;position:absolute}.image :deep(.icon){color:var(--color-global-background-accent);left:50%;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%)}}
|
|
149
149
|
</style>
|
|
@@ -19,5 +19,5 @@ const props = defineProps({
|
|
|
19
19
|
</script>
|
|
20
20
|
|
|
21
21
|
<style scoped>
|
|
22
|
-
@reference "tailwindcss"
|
|
22
|
+
@reference "tailwindcss";@layer components{:global(:root){--page-column-gutter:calc(var(--spacing)*3);--page-column-pad-y:calc(var(--spacing)*12);--page-column-pad-vista:calc(var(--spacing)*52)}.page-column{margin-left:auto;margin-right:auto;padding:var(--page-column-gutter)}.page-column.layout-main:where(:has(:first-child.page-container)){padding-bottom:0;padding-top:0}.page-column.layout-vista:where(:has(:last-child.page-container)){padding-bottom:0}@variant sm{.page-column{max-width:var(--container-3xl)}.page-column.layout-main{padding-top:var(--page-column-pad-y)}.page-column.layout-main,.page-column.layout-vista{padding-bottom:var(--page-column-pad-y)}}@variant lg{.page-column{max-width:var(--container-5xl)}.page-column.layout-vista{padding-top:var(--page-column-pad-vista)}}@variant portrait{.page-column.layout-vista{padding-top:min(calc(var(--spacing)*52),calc(56.25vw - 110px))}}}
|
|
23
23
|
</style>
|
|
@@ -5,11 +5,22 @@
|
|
|
5
5
|
>
|
|
6
6
|
<div
|
|
7
7
|
v-if = "showTitleBar"
|
|
8
|
-
:class = "[
|
|
8
|
+
:class = "[
|
|
9
|
+
'mb-6',
|
|
10
|
+
props.headerClass,
|
|
11
|
+
{
|
|
12
|
+
'prose-layout-container': props.prose,
|
|
13
|
+
'sm': props.prose === 'sm'
|
|
14
|
+
}
|
|
15
|
+
]"
|
|
9
16
|
>
|
|
10
17
|
<div v-if="showHeading || slots.actions" class="flex gap-4 items-center">
|
|
11
18
|
<slot name="heading">
|
|
12
|
-
<Heading
|
|
19
|
+
<Heading
|
|
20
|
+
:text = "props.headingText"
|
|
21
|
+
:level = "props.headingLevel"
|
|
22
|
+
class = "grow"
|
|
23
|
+
/>
|
|
13
24
|
</slot>
|
|
14
25
|
|
|
15
26
|
<div v-if="slots.actions">
|
|
@@ -24,7 +35,15 @@
|
|
|
24
35
|
</div>
|
|
25
36
|
</div>
|
|
26
37
|
|
|
27
|
-
<div
|
|
38
|
+
<div
|
|
39
|
+
:class="[
|
|
40
|
+
props.contentClass,
|
|
41
|
+
{
|
|
42
|
+
'prose-container': props.prose,
|
|
43
|
+
'sm': props.prose === 'sm'
|
|
44
|
+
}
|
|
45
|
+
]"
|
|
46
|
+
>
|
|
28
47
|
<slot name="default" />
|
|
29
48
|
</div>
|
|
30
49
|
</Component>
|
|
@@ -42,9 +61,12 @@ const props = defineProps({
|
|
|
42
61
|
is: { type: String, required: false, default: "div" },
|
|
43
62
|
glassEffect: { type: Boolean, required: false, default: false },
|
|
44
63
|
accentColor: { type: String, required: false, default: void 0 },
|
|
64
|
+
prose: { type: [Boolean, String], required: false, default: false },
|
|
45
65
|
headingText: { type: String, required: false, default: void 0 },
|
|
66
|
+
headingLevel: { type: [String, Number], required: false },
|
|
46
67
|
subheadingText: { type: String, required: false, default: void 0 },
|
|
47
|
-
|
|
68
|
+
headerClass: { type: null, required: false },
|
|
69
|
+
contentClass: { type: null, required: false }
|
|
48
70
|
});
|
|
49
71
|
const showSubheading = computed(
|
|
50
72
|
() => !!(props.subheadingText || slots.subheading)
|
|
@@ -58,5 +80,5 @@ const showTitleBar = computed(
|
|
|
58
80
|
</script>
|
|
59
81
|
|
|
60
82
|
<style scoped>
|
|
61
|
-
@reference "tailwindcss"
|
|
83
|
+
@reference "tailwindcss";@layer components{:global(:root){--page-container-pad-y:calc(var(--page-column-gutter)*2);--page-container-pad-x:var(--page-container-pad-y);--page-container-radius:calc(var(--spacing)*1)}.page-container{--custom-accent-color:v-bind(accentColor);--page-container-accent-color:var(--custom-accent-color,var(--color-global-foreground-accent));background-color:var(--color-global-background);border:1px solid var(--page-container-accent-color);border-radius:var(--page-container-radius);box-shadow:var(--shadow-heavy);padding:var(--page-container-pad-y) var(--page-container-pad-x);transition:border-color;transition-duration:var(--default-transition-duration)}@variant sm{.page-container.glass-effect{backdrop-filter:blur(var(--blur-sm));background-color:color-mix(in srgb-linear,transparent 40%,var(--color-global-background))}}@variant max-sm{.page-container:where(.page-column>.page-container){border-bottom:none;border-left:none;border-radius:0;border-right:none;box-shadow:none;margin-left:calc(var(--page-column-gutter)*-1);margin-right:calc(var(--page-column-gutter)*-1);padding-left:var(--page-column-gutter);padding-right:var(--page-column-gutter)}.page-container:not(.page-container+.page-container):where(.page-column:not(.layout-vista)>.page-container){border-top:none}}}
|
|
62
84
|
</style>
|
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
import type { HintedString } from '../types/index.js';
|
|
1
|
+
import type { HintedString, HTMLElementClassNames } from '../types/index.js';
|
|
2
|
+
import type { HeadingProps } from './Heading.vue.js';
|
|
2
3
|
export interface LayoutPageContainerProps {
|
|
3
4
|
is?: HintedString<'div' | 'main' | 'section' | 'article' | 'nav'>;
|
|
4
5
|
glassEffect?: boolean;
|
|
5
6
|
accentColor?: string;
|
|
7
|
+
prose?: boolean | 'md' | 'sm';
|
|
6
8
|
headingText?: string;
|
|
9
|
+
headingLevel?: HeadingProps['level'];
|
|
7
10
|
subheadingText?: string;
|
|
8
|
-
|
|
11
|
+
headerClass?: HTMLElementClassNames;
|
|
12
|
+
contentClass?: HTMLElementClassNames;
|
|
9
13
|
}
|
|
10
14
|
declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LayoutPageContainerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LayoutPageContainerProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
|
|
11
15
|
heading?: (props: {}) => any;
|
|
@@ -50,5 +50,5 @@ const passthroughProps = computed(() => {
|
|
|
50
50
|
</script>
|
|
51
51
|
|
|
52
52
|
<style scoped>
|
|
53
|
-
@reference "tailwindcss"
|
|
53
|
+
@reference "tailwindcss";@layer components{.message:deep(.content){align-items:center;display:flex;gap:--spacing(2.5);padding:--spacing(2) --spacing(2.5)}.message:deep(.icon){flex-shrink:0;font-size:1.25rem}.message:deep(.text){flex-grow:1}.message:deep(.close){align-self:start}}
|
|
54
54
|
</style>
|
|
@@ -26,5 +26,5 @@ const mode = computed(() => {
|
|
|
26
26
|
</script>
|
|
27
27
|
|
|
28
28
|
<style scoped>
|
|
29
|
-
@reference "tailwindcss"
|
|
29
|
+
@reference "tailwindcss";@layer components{.progress{background:var(--color-global-background-accent);border-radius:var(--radius-full);box-shadow:var(--inset-shadow-sm);height:--spacing(1.5);overflow:clip}.progress.determinate:deep(.value){background:var(--custom-accent-color,var(--color-global-foreground));border-radius:var(--radius-full);height:--spacing(1.5);transition:width;transition-duration:var(--default-transition-duration);transition-timing-function:var(--default-transition-timing-function)}.progress.indeterminate:deep(.value){position:relative}.progress.indeterminate:deep(.value):after,.progress.indeterminate:deep(.value):before{background:var(--custom-accent-color,var(--color-global-foreground));border-radius:var(--radius-full);content:"";height:--spacing(1.5);inset-inline-end:0;inset-inline-start:0;position:absolute;will-change:auto}.progress.indeterminate:deep(.value):before{animation:indeterminate-before 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.progress.indeterminate:deep(.value):after{animation:indeterminate-after 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate-before{0%{inset-inline-end:100%;inset-inline-start:-35%}60%{inset-inline-end:-90%;inset-inline-start:100%}to{inset-inline-end:-90%;inset-inline-start:100%}}@keyframes indeterminate-after{0%{inset-inline-end:100%;inset-inline-start:-200%}60%{inset-inline-end:-8%;inset-inline-start:107%}to{inset-inline-end:-8%;inset-inline-start:107%}}}
|
|
30
30
|
</style>
|
|
@@ -14,5 +14,5 @@ const props = defineProps({
|
|
|
14
14
|
</script>
|
|
15
15
|
|
|
16
16
|
<style scoped>
|
|
17
|
-
@reference "tailwindcss"
|
|
17
|
+
@reference "tailwindcss";@layer components{.indicator.sm{height:var(--icon-size-small);width:var(--icon-size-small)}.indicator.sm:deep(circle){stroke-width:7}.indicator.md{height:var(--icon-size-medium);width:var(--icon-size-medium)}.indicator.md:deep(circle){stroke-width:7}.indicator.lg{height:var(--icon-size-large);width:var(--icon-size-large)}.indicator.lg:deep(circle){stroke-width:5}.indicator.xl{height:var(--icon-size-jumbo);width:var(--icon-size-jumbo)}.indicator.xl:deep(circle){stroke-width:4}.indicator :deep(svg){animation:var(--animate-spin);animation-duration:2s}.indicator :deep(circle){animation:resee-color-wheel 12s ease-in-out infinite,dashed-wheel 6s var(--default-transition-timing-function) infinite;stroke-linecap:round}@keyframes resee-color-wheel{0%{stroke:var(--color-resee-red)}11%{stroke:var(--color-resee-orange)}22%{stroke:var(--color-resee-yellow)}33%{stroke:var(--color-resee-green)}44%{stroke:var(--color-resee-seaweed)}55%{stroke:var(--color-resee-aqua)}66%{stroke:var(--color-resee-blue)}77%{stroke:var(--color-resee-indigo)}88%{stroke:var(--color-resee-violet)}to{stroke:var(--color-resee-red)}}@keyframes dashed-wheel{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:120,150;stroke-dashoffset:-35px}to{stroke-dasharray:120,150;stroke-dashoffset:-124px}}}
|
|
18
18
|
</style>
|
|
@@ -31,5 +31,5 @@ const props = defineProps({
|
|
|
31
31
|
</script>
|
|
32
32
|
|
|
33
33
|
<style scoped>
|
|
34
|
-
@reference "tailwindcss"
|
|
34
|
+
@reference "tailwindcss";@layer components{.tag{cursor:default;padding:--spacing(.5) --spacing(1);-webkit-user-select:all;-moz-user-select:all;user-select:all}.tag.sm{font-size:.85rem}.tag.lg{font-size:1.1rem}.tag.has-tooltip{cursor:help}}
|
|
35
35
|
</style>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer components{@property --btn-background-color{syntax:"<color>";inherits:false;initial-value:transparent}.btn,.btn.default,.prose button:not([class]),.prose-container button:not([class]){--btn-border-width:2px;--btn-background-color:var(--color-background-scale-a);--btn-background-focus-color:var(--color-background-scale-c);--btn-border-color:var(--color-background-scale-g);--btn-bg-image-background-layer:linear-gradient(to right,var(--btn-background-color),var(--btn-background-color));--btn-bg-image-border-layer:linear-gradient(to right,var(--btn-border-color),var(--btn-border-color));--btn-bg-image-color-layer:linear-gradient(to right,var(--colorscale-resee-linear));--btn-background-image:var(--btn-bg-image-background-layer),var(--btn-bg-image-border-layer),var(--btn-bg-image-color-layer);@variant dark{--btn-bg-image-color-layer:linear-gradient(to right,var(--colorscale-resee-lite-linear))}}.btn.default.icon-only,.btn.icon-only,.prose button:not([class]).icon-only,.prose-container button:not([class]).icon-only{--btn-bg-image-color-layer:conic-gradient(from 0deg,var(--colorscale-resee-conic));@variant dark{--btn-bg-image-color-layer:conic-gradient(from 0deg,var(--colorscale-resee-lite-conic))}}.btn,.prose button:not([class]),.prose-container button:not([class]){background-clip:padding-box,border-box,border-box;background-image:var(--btn-background-image);background-origin:border-box;background-position:100% 100%;background-repeat:no-repeat;background-size:100%,100% 100%,100%;border:solid var(--btn-border-width) var(--btn-border-color);border-radius:var(--radius-full);cursor:pointer;display:inline-block;padding:--spacing(1) --spacing(5);text-align:center;transition:box-shadow,background-size,--btn-background-color,border-color;transition-duration:.3s;transition-timing-function:ease-in-out}.btn:focus-visible,.prose button:not([class]):focus-visible,.prose-container button:not([class]):focus-visible{outline:none}.btn:where(:disabled,.disabled,[aria-disabled=true]):not(.loading),.prose button:not([class]):where(:disabled,.disabled,[aria-disabled=true]):not(.loading),.prose-container button:not([class]):where(:disabled,.disabled,[aria-disabled=true]):not(.loading){cursor:not-allowed;opacity:.4}.btn.borderless,.prose button:not([class]).borderless,.prose-container button:not([class]).borderless{background-clip:border-box;background-image:var(--btn-bg-image-background-layer);border:2px solid transparent}.btn.icon-only,.prose button:not([class]).icon-only,.prose-container button:not([class]).icon-only{line-height:1;padding:--spacing(2)}.btn.icon-only .label,.prose button:not([class]).icon-only .label,.prose-container button:not([class]).icon-only .label{display:none}.btn.small,.prose button:not([class]).small,.prose-container button:not([class]).small{font-size:var(--icon-size-small)}.btn.small.icon-only,.prose button:not([class]).small.icon-only,.prose-container button:not([class]).small.icon-only{padding:--spacing(1.75)}.btn.small:not(.icon-only),.prose button:not([class]).small:not(.icon-only),.prose-container button:not([class]).small:not(.icon-only){padding:--spacing(.5) --spacing(4)}.btn.large,.prose button:not([class]).large,.prose-container button:not([class]).large{font-size:var(--icon-size-large)}.btn.large.icon-only,.prose button:not([class]).large.icon-only,.prose-container button:not([class]).large.icon-only{padding:--spacing(1.5)}.btn.large:not(.icon-only),.prose button:not([class]).large:not(.icon-only),.prose-container button:not([class]).large:not(.icon-only){padding:--spacing(1.5) --spacing(6)}.btn.loading,.prose button:not([class]).loading,.prose-container button:not([class]).loading{cursor:progress}.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible,.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):hover,.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible,.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover,.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible,.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover{--btn-background-color:var(--btn-background-focus-color);background-size:100%,0 100%,100%;border-color:transparent}.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible:not(.borderless),.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):hover:not(.borderless),.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible:not(.borderless),.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover:not(.borderless),.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible:not(.borderless),.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover:not(.borderless){box-shadow:var(--shadow)}.btn,.prose button:not([class]),.prose-container button:not([class]){@variant max-md{&.responsive-grow{padding:.5rem;width:100%}&.responsive-shrink{line-height:1;padding:--spacing(2)}&.responsive-shrink
|
|
1
|
+
@layer components{@property --btn-background-color{syntax:"<color>";inherits:false;initial-value:transparent}.btn,.btn.default,.prose button:not([class]),.prose-container button:not([class]){--btn-border-width:2px;--btn-background-color:var(--color-background-scale-a);--btn-background-focus-color:var(--color-background-scale-c);--btn-border-color:var(--color-background-scale-g);--btn-bg-image-background-layer:linear-gradient(to right,var(--btn-background-color),var(--btn-background-color));--btn-bg-image-border-layer:linear-gradient(to right,var(--btn-border-color),var(--btn-border-color));--btn-bg-image-color-layer:linear-gradient(to right,var(--colorscale-resee-linear));--btn-background-image:var(--btn-bg-image-background-layer),var(--btn-bg-image-border-layer),var(--btn-bg-image-color-layer);@variant dark{--btn-bg-image-color-layer:linear-gradient(to right,var(--colorscale-resee-lite-linear))}}.btn.default.icon-only,.btn.icon-only,.prose button:not([class]).icon-only,.prose-container button:not([class]).icon-only{--btn-bg-image-color-layer:conic-gradient(from 0deg,var(--colorscale-resee-conic));@variant dark{--btn-bg-image-color-layer:conic-gradient(from 0deg,var(--colorscale-resee-lite-conic))}}.btn,.prose button:not([class]),.prose-container button:not([class]){background-clip:padding-box,border-box,border-box;background-image:var(--btn-background-image);background-origin:border-box;background-position:100% 100%;background-repeat:no-repeat;background-size:100%,100% 100%,100%;border:solid var(--btn-border-width) var(--btn-border-color);border-radius:var(--radius-full);cursor:pointer;display:inline-block;padding:--spacing(1) --spacing(5);text-align:center;transition:box-shadow,background-size,--btn-background-color,border-color;transition-duration:.3s;transition-timing-function:ease-in-out}.btn:focus-visible,.prose button:not([class]):focus-visible,.prose-container button:not([class]):focus-visible{outline:none}.btn:where(:disabled,.disabled,[aria-disabled=true]):not(.loading),.prose button:not([class]):where(:disabled,.disabled,[aria-disabled=true]):not(.loading),.prose-container button:not([class]):where(:disabled,.disabled,[aria-disabled=true]):not(.loading){cursor:not-allowed;opacity:.4}.btn.borderless,.prose button:not([class]).borderless,.prose-container button:not([class]).borderless{background-clip:border-box;background-image:var(--btn-bg-image-background-layer);border:2px solid transparent}.btn.icon-only,.prose button:not([class]).icon-only,.prose-container button:not([class]).icon-only{line-height:1;padding:--spacing(2)}.btn.icon-only .label,.prose button:not([class]).icon-only .label,.prose-container button:not([class]).icon-only .label{display:none}.btn.small,.prose button:not([class]).small,.prose-container button:not([class]).small{font-size:var(--icon-size-small)}.btn.small.icon-only,.prose button:not([class]).small.icon-only,.prose-container button:not([class]).small.icon-only{padding:--spacing(1.75)}.btn.small:not(.icon-only),.prose button:not([class]).small:not(.icon-only),.prose-container button:not([class]).small:not(.icon-only){padding:--spacing(.5) --spacing(4)}.btn.large,.prose button:not([class]).large,.prose-container button:not([class]).large{font-size:var(--icon-size-large)}.btn.large.icon-only,.prose button:not([class]).large.icon-only,.prose-container button:not([class]).large.icon-only{padding:--spacing(1.5)}.btn.large:not(.icon-only),.prose button:not([class]).large:not(.icon-only),.prose-container button:not([class]).large:not(.icon-only){padding:--spacing(1.5) --spacing(6)}.btn.loading,.prose button:not([class]).loading,.prose-container button:not([class]).loading{cursor:progress}.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible,.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):hover,.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible,.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover,.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible,.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover{--btn-background-color:var(--btn-background-focus-color);background-size:100%,0 100%,100%;border-color:transparent}.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible:not(.borderless),.btn:not(:disabled,.disabled,[aria-disabled=true],.loading):hover:not(.borderless),.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible:not(.borderless),.prose button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover:not(.borderless),.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):focus-visible:not(.borderless),.prose-container button:not([class]):not(:disabled,.disabled,[aria-disabled=true],.loading):hover:not(.borderless){box-shadow:var(--shadow)}.btn,.prose button:not([class]),.prose-container button:not([class]){@variant max-md{&.responsive-grow{padding:.5rem;width:100%}&.responsive-shrink{line-height:1;padding:--spacing(2)}&.responsive-shrink .label{display:none}}}}
|
package/package.json
CHANGED