@helpwave/hightide 0.8.0 → 0.8.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/index.d.mts +13 -1
- package/dist/index.d.ts +13 -1
- package/dist/index.js +20 -14
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +198 -192
- package/dist/index.mjs.map +1 -1
- package/dist/style/globals.css +71 -0
- package/dist/style/uncompiled/theme/components/index.css +2 -1
- package/package.json +1 -1
package/dist/style/globals.css
CHANGED
|
@@ -5081,6 +5081,77 @@
|
|
|
5081
5081
|
}
|
|
5082
5082
|
}
|
|
5083
5083
|
}
|
|
5084
|
+
@layer components {
|
|
5085
|
+
[data-name="date-time-input"] {
|
|
5086
|
+
display: flex;
|
|
5087
|
+
flex-direction: row;
|
|
5088
|
+
column-gap: calc(var(--spacing) * 2);
|
|
5089
|
+
height: var(--spacing-element-md);
|
|
5090
|
+
width: 100%;
|
|
5091
|
+
border-style: var(--tw-border-style);
|
|
5092
|
+
border-width: 2px;
|
|
5093
|
+
--focus-outline: none;
|
|
5094
|
+
--focus-outline-offset: 0;
|
|
5095
|
+
--focus-outline-transition: none;
|
|
5096
|
+
--focus-box-shadow: none;
|
|
5097
|
+
--focus-border-color: inherit;
|
|
5098
|
+
--focus-border-color: var(--color-focus);
|
|
5099
|
+
--focus-box-shadow: 0 0 8px 2px color-mix(in srgb, #694BB4 70%, transparent);
|
|
5100
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
5101
|
+
--focus-box-shadow: 0 0 8px 2px color-mix(in srgb, var(--color-focus) 70%, transparent);
|
|
5102
|
+
}
|
|
5103
|
+
&:not([data-disabled]):not([data-invalid]) {
|
|
5104
|
+
background-color: var(--color-input-background);
|
|
5105
|
+
&:hover {
|
|
5106
|
+
@media (hover: hover) {
|
|
5107
|
+
border-color: var(--color-primary-hover);
|
|
5108
|
+
}
|
|
5109
|
+
}
|
|
5110
|
+
&:not([data-value]) {
|
|
5111
|
+
color: var(--color-placeholder);
|
|
5112
|
+
}
|
|
5113
|
+
&[data-value] {
|
|
5114
|
+
color: var(--color-input-text);
|
|
5115
|
+
}
|
|
5116
|
+
}
|
|
5117
|
+
&:not([data-disabled])[data-invalid] {
|
|
5118
|
+
border-color: var(--color-negative);
|
|
5119
|
+
background-color: color-mix(in srgb, #DC576D 20%, transparent);
|
|
5120
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
5121
|
+
background-color: color-mix(in oklab, var(--color-negative) 20%, transparent);
|
|
5122
|
+
}
|
|
5123
|
+
&:hover {
|
|
5124
|
+
@media (hover: hover) {
|
|
5125
|
+
border-color: var(--color-negative-hover);
|
|
5126
|
+
}
|
|
5127
|
+
}
|
|
5128
|
+
--color-focus: var(--color-negative);
|
|
5129
|
+
&[data-value] {
|
|
5130
|
+
color: var(--color-negative);
|
|
5131
|
+
}
|
|
5132
|
+
&:not([data-value]) {
|
|
5133
|
+
color: var(--color-placeholder);
|
|
5134
|
+
}
|
|
5135
|
+
}
|
|
5136
|
+
&[data-disabled] {
|
|
5137
|
+
cursor: not-allowed;
|
|
5138
|
+
border-color: var(--color-disabled);
|
|
5139
|
+
background-color: var(--color-disabled);
|
|
5140
|
+
color: var(--color-on-disabled);
|
|
5141
|
+
&::placeholder {
|
|
5142
|
+
color: transparent;
|
|
5143
|
+
}
|
|
5144
|
+
}
|
|
5145
|
+
align-items: center;
|
|
5146
|
+
justify-content: space-between;
|
|
5147
|
+
border-radius: var(--radius-md);
|
|
5148
|
+
padding-inline: calc(var(--spacing) * 3);
|
|
5149
|
+
padding-right: calc(var(--spacing) * 10);
|
|
5150
|
+
&:hover {
|
|
5151
|
+
cursor: pointer;
|
|
5152
|
+
}
|
|
5153
|
+
}
|
|
5154
|
+
}
|
|
5084
5155
|
:root {
|
|
5085
5156
|
--spacing: 0.25rem;
|
|
5086
5157
|
--drawer-indent: calc(4 * var(--spacing));
|