UNPKG

vuestic-ui

Version:

Vue 3 UI Framework

vuestic.dev

epicmaxco/vuestic-ui

9 lines (8 loc) • 3.64 kB
1
2
3
4
5
6
7
8
9
import { _ as _sfc_main } from "./VaAlert.vue_vue_type_script_setup_true_lang.js"; import { _ as _export_sfc } from "../../../plugin-vue_export-helper.js"; const _style_0 = ':root,\n:host {\n /* General */\n --va-alert-position: relative;\n --va-alert-display: flex;\n --va-alert-align-items: center;\n --va-alert-margin-y: 0.25rem;\n --va-alert-padding-x: 0.75rem;\n --va-alert-padding-y: 0.75rem;\n --va-alert-padding-y-dense: 0.25rem;\n --va-alert-border-width: 0;\n --va-alert-border-radius: 4px;\n --va-alert-box-shadow: var(--va-box-shadow);\n --va-alert-color: transparent;\n --va-alert-title-font-weight: 600;\n --va-alert-top-border-radius: 4px 4px 0 0;\n --va-alert-right-border-radius: 0 4px 4px 0;\n --va-alert-bottom-border-radius: 0 0 4px 4px;\n --va-alert-left-border-radius: 4px 0 0 4px;\n --va-badge-margin-right: 0.5rem;\n --va-badge-padding-x: 0.5rem;\n --va-badge-padding-y: 0.125rem;\n --va-badge-border-radius: 0.5rem;\n --va-badge-font-size: 0.625rem;\n --va-badge-letter-spacing: 0.0625rem;\n --va-alert-close-padding-x: 0.5rem;\n --va-alert-close-padding-y: 0.0625rem;\n --va-alert-close-font-size: 1rem;\n --va-alert-stripe-border-size: var(--va-stripe-border-size);\n}\n.va-alert {\n position: var(--va-alert-position);\n padding: var(--va-alert-padding-y) var(--va-alert-padding-x);\n margin: var(--va-alert-margin-y) auto;\n display: var(--va-alert-display);\n align-items: var(--va-alert-align-items);\n border: var(--va-alert-border-width, var(--va-control-border)) solid transparent;\n border-radius: var(--va-alert-border-radius, var(--va-block-border-radius));\n font-family: var(--va-font-family);\n}\n.va-alert__border {\n content: "";\n position: absolute;\n}\n.va-alert__border--top {\n border-radius: var(--va-alert-top-border-radius);\n width: 100%;\n height: var(--va-alert-stripe-border-size);\n top: 0;\n left: 0;\n}\n.va-alert__border--right {\n border-radius: var(--va-alert-right-border-radius);\n height: 100%;\n width: var(--va-alert-stripe-border-size);\n bottom: 0;\n right: 0;\n}\n.va-alert__border--bottom {\n border-radius: var(--va-alert-bottom-border-radius);\n width: 100%;\n height: var(--va-alert-stripe-border-size);\n bottom: 0;\n left: 0;\n}\n.va-alert__border--left {\n border-radius: var(--va-alert-left-border-radius);\n height: 100%;\n width: var(--va-alert-stripe-border-size);\n bottom: 0;\n left: 0;\n}\n.va-alert__icon {\n display: flex;\n align-items: center;\n padding-right: var(--va-alert-padding-x);\n}\n.va-alert__title {\n display: flex;\n align-items: center;\n}\n.va-alert__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-grow: 1;\n color: var(--va-alert-color);\n}\n.va-alert:focus-visible {\n outline: 2px solid var(--va-focus) !important;\n border-radius: "inherit";\n}\n.va-alert__close {\n padding-left: var(--va-alert-close-padding-x);\n font-size: var(--va-alert-close-font-size);\n}\n.va-alert__close--closeable {\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.va-alert__close--closeable:focus-visible {\n outline: 2px solid var(--va-focus) !important;\n border-radius: "inherit";\n}\n@media (max-width: 575.98px) {\n.va-alert__content {\n flex-direction: column;\n align-items: flex-start;\n}\n.va-alert__close {\n align-self: flex-start;\n display: flex;\n align-items: flex-start;\n padding: 0 var(--va-alert-close-padding-x) 0 0;\n margin: 0;\n}\n}'; const _VaAlert = /* @__PURE__ */ _export_sfc(_sfc_main, [["styles", [_style_0]]]); export { _VaAlert as _ }; //# sourceMappingURL=VaAlert.js.map