@kelvininc/ui-components
Version:
Kelvin UI Components
56 lines (54 loc) • 1.55 kB
CSS
/** HEADINGS **/
/** LABELS **/
/** SPANS **/
/** PARAGRAPHS **/
/** TODO: CODE/CONSOLE **/
@property --rotation {
syntax: "<angle>";
initial-value: 0deg;
inherits: false;
}
@keyframes rotate-border {
to {
--rotation: 360deg;
}
}
/**
* Design Tokens - Auto-generated by Style Dictionary
* Do not edit manually - run `pnpm tokens:build` to regenerate
*/
kv-dropdown-base:not(.hydrated) > [slot=list] {
display: none;
}
:host {
/**
* @prop --container-white-space: The white space strategy for the tooltip container.
* @prop --container-width: The width for the tooltip container.
* @prop --container-max-width: The max width for the tooltip container.
* @prop --container-background-color: The background color for the tooltip container.
*/
--container-white-space: normal;
--container-width: fit-content;
--container-max-width: 280px;
--container-background-color: var(--tooltip-background-default);
}
.tooltip-container {
height: fit-content;
width: var(--container-width);
max-width: var(--container-max-width);
display: inline-block;
word-wrap: break-word;
background-color: var(--container-background-color);
user-select: none;
border-radius: var(--tooltip-radius-default);
padding: var(--tooltip-padding-y-default) var(--tooltip-padding-x-default);
white-space: var(--container-white-space);
}
.tooltip-container .tooltip-text {
font-family: Proxima Nova;
font-weight: 600;
font-size: 14px;
line-height: 20px;
letter-spacing: 0;
color: var(--tooltip-text-default);
}