@vonage/vivid 3.0.0-next.4 → 3.0.0-next.7
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/.babelrc +3 -0
- package/.eslintrc.json +70 -0
- package/.stylelintrc.json +8 -0
- package/CHANGELOG.json +343 -0
- package/CHANGELOG.md +45 -0
- package/jest.config.cjs +20 -0
- package/package.json +7 -12
- package/playwright.config.dev.ts +21 -0
- package/playwright.config.ts +34 -0
- package/project.json +122 -0
- package/rollup.config.prod.ts +50 -0
- package/setupJestTests.js +17 -0
- package/{index.d.ts → src/index.ts} +2 -2
- package/src/lib/accordion/README.md +55 -0
- package/src/lib/accordion/accordion.scss +10 -0
- package/src/lib/accordion/accordion.spec.ts +91 -0
- package/src/lib/accordion/accordion.template.ts +23 -0
- package/src/lib/accordion/accordion.ts +49 -0
- package/src/lib/accordion/index.ts +14 -0
- package/src/lib/accordion/ui.test.ts +37 -0
- package/src/lib/accordion/ui.test.ts-snapshots/snapshots-accordion-Chrome-Stable-darwin.png +0 -0
- package/src/lib/accordion/ui.test.ts-snapshots/snapshots-accordion-Chrome-Stable-linux.png +0 -0
- package/src/lib/accordion/ui.test.ts-snapshots/snapshots-accordion-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/accordion/ui.test.ts-snapshots/snapshots-accordion-Desktop-Firefox-linux.png +0 -0
- package/src/lib/accordion/ui.test.ts-snapshots/snapshots-accordion-Desktop-Safari-darwin.png +0 -0
- package/src/lib/accordion/ui.test.ts-snapshots/snapshots-accordion-Desktop-Safari-linux.png +0 -0
- package/src/lib/accordion-item/README.md +113 -0
- package/src/lib/accordion-item/accordion-item.scss +91 -0
- package/src/lib/accordion-item/accordion-item.spec.ts +103 -0
- package/src/lib/accordion-item/accordion-item.template.ts +62 -0
- package/src/lib/accordion-item/accordion-item.ts +67 -0
- package/src/lib/accordion-item/index.ts +14 -0
- package/src/lib/accordion-item/partials/variables.scss +1 -0
- package/src/lib/accordion-item/ui.test.ts +37 -0
- package/src/lib/accordion-item/ui.test.ts-snapshots/snapshots-accordion-item-Chrome-Stable-darwin.png +0 -0
- package/src/lib/accordion-item/ui.test.ts-snapshots/snapshots-accordion-item-Chrome-Stable-linux.png +0 -0
- package/src/lib/accordion-item/ui.test.ts-snapshots/snapshots-accordion-item-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/accordion-item/ui.test.ts-snapshots/snapshots-accordion-item-Desktop-Firefox-linux.png +0 -0
- package/src/lib/accordion-item/ui.test.ts-snapshots/snapshots-accordion-item-Desktop-Safari-darwin.png +0 -0
- package/src/lib/accordion-item/ui.test.ts-snapshots/snapshots-accordion-item-Desktop-Safari-linux.png +0 -0
- package/src/lib/badge/README.md +112 -0
- package/src/lib/badge/badge.scss +64 -0
- package/src/lib/badge/badge.spec.ts +114 -0
- package/src/lib/badge/badge.template.ts +36 -0
- package/src/lib/badge/badge.ts +97 -0
- package/src/lib/badge/index.ts +23 -0
- package/src/lib/badge/ui.test.ts +28 -0
- package/src/lib/badge/ui.test.ts-snapshots/snapshots-badge-Chrome-Stable-darwin.png +0 -0
- package/src/lib/badge/ui.test.ts-snapshots/snapshots-badge-Chrome-Stable-linux.png +0 -0
- package/src/lib/badge/ui.test.ts-snapshots/snapshots-badge-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/badge/ui.test.ts-snapshots/snapshots-badge-Desktop-Firefox-linux.png +0 -0
- package/src/lib/badge/ui.test.ts-snapshots/snapshots-badge-Desktop-Safari-darwin.png +0 -0
- package/src/lib/badge/ui.test.ts-snapshots/snapshots-badge-Desktop-Safari-linux.png +0 -0
- package/src/lib/banner/README.md +117 -0
- package/src/lib/banner/banner.scss +71 -0
- package/src/lib/banner/banner.spec.ts +355 -0
- package/src/lib/banner/banner.template.ts +61 -0
- package/src/lib/banner/banner.ts +77 -0
- package/src/lib/banner/index.ts +14 -0
- package/src/lib/banner/ui.test.ts +64 -0
- package/src/lib/banner/ui.test.ts-snapshots/snapshots-banner-Chrome-Stable-darwin.png +0 -0
- package/src/lib/banner/ui.test.ts-snapshots/snapshots-banner-Chrome-Stable-linux.png +0 -0
- package/src/lib/banner/ui.test.ts-snapshots/snapshots-banner-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/banner/ui.test.ts-snapshots/snapshots-banner-Desktop-Firefox-linux.png +0 -0
- package/src/lib/banner/ui.test.ts-snapshots/snapshots-banner-Desktop-Safari-darwin.png +0 -0
- package/src/lib/banner/ui.test.ts-snapshots/snapshots-banner-Desktop-Safari-linux.png +0 -0
- package/src/lib/breadcrumb/README.md +25 -0
- package/src/lib/breadcrumb/breadcrumb.scss +3 -0
- package/src/lib/breadcrumb/breadcrumb.spec.ts +78 -0
- package/src/lib/breadcrumb/breadcrumb.ts +10 -0
- package/src/lib/breadcrumb/index.ts +13 -0
- package/src/lib/breadcrumb/ui.test.ts +36 -0
- package/src/lib/breadcrumb/ui.test.ts-snapshots/snapshots-breadcrumb-Chrome-Stable-darwin.png +0 -0
- package/src/lib/breadcrumb/ui.test.ts-snapshots/snapshots-breadcrumb-Chrome-Stable-linux.png +0 -0
- package/src/lib/breadcrumb/ui.test.ts-snapshots/snapshots-breadcrumb-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/breadcrumb/ui.test.ts-snapshots/snapshots-breadcrumb-Desktop-Firefox-linux.png +0 -0
- package/src/lib/breadcrumb/ui.test.ts-snapshots/snapshots-breadcrumb-Desktop-Safari-darwin.png +0 -0
- package/src/lib/breadcrumb/ui.test.ts-snapshots/snapshots-breadcrumb-Desktop-Safari-linux.png +0 -0
- package/src/lib/breadcrumb-item/README.md +40 -0
- package/src/lib/breadcrumb-item/breadcrumb-item.scss +28 -0
- package/src/lib/breadcrumb-item/breadcrumb-item.spec.ts +192 -0
- package/src/lib/breadcrumb-item/breadcrumb-item.template.ts +37 -0
- package/src/lib/breadcrumb-item/breadcrumb-item.ts +15 -0
- package/src/lib/breadcrumb-item/index.ts +16 -0
- package/src/lib/breadcrumb-item/ui.test.ts +38 -0
- package/src/lib/breadcrumb-item/ui.test.ts-snapshots/snapshots-breadcrumb-item-Chrome-Stable-darwin.png +0 -0
- package/src/lib/breadcrumb-item/ui.test.ts-snapshots/snapshots-breadcrumb-item-Chrome-Stable-linux.png +0 -0
- package/src/lib/breadcrumb-item/ui.test.ts-snapshots/snapshots-breadcrumb-item-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/breadcrumb-item/ui.test.ts-snapshots/snapshots-breadcrumb-item-Desktop-Firefox-linux.png +0 -0
- package/src/lib/breadcrumb-item/ui.test.ts-snapshots/snapshots-breadcrumb-item-Desktop-Safari-darwin.png +0 -0
- package/src/lib/breadcrumb-item/ui.test.ts-snapshots/snapshots-breadcrumb-item-Desktop-Safari-linux.png +0 -0
- package/src/lib/button/README.md +120 -0
- package/src/lib/button/button.scss +142 -0
- package/src/lib/button/button.spec.ts +131 -0
- package/src/lib/button/button.template.ts +89 -0
- package/src/lib/button/button.ts +95 -0
- package/src/lib/button/index.ts +25 -0
- package/src/lib/button/partials/variables.scss +2 -0
- package/src/lib/button/ui.test.ts +32 -0
- package/src/lib/button/ui.test.ts-snapshots/snapshots-button-Chrome-Stable-darwin.png +0 -0
- package/src/lib/button/ui.test.ts-snapshots/snapshots-button-Chrome-Stable-linux.png +0 -0
- package/src/lib/button/ui.test.ts-snapshots/snapshots-button-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/button/ui.test.ts-snapshots/snapshots-button-Desktop-Firefox-linux.png +0 -0
- package/src/lib/button/ui.test.ts-snapshots/snapshots-button-Desktop-Safari-darwin.png +0 -0
- package/src/lib/button/ui.test.ts-snapshots/snapshots-button-Desktop-Safari-linux.png +0 -0
- package/src/lib/calendar/README.md +70 -0
- package/src/lib/calendar/calendar.scss +176 -0
- package/src/lib/calendar/calendar.spec.ts +341 -0
- package/src/lib/calendar/calendar.template.ts +93 -0
- package/src/lib/calendar/calendar.ts +139 -0
- package/src/lib/calendar/helpers/calendar.date-functions.ts +31 -0
- package/src/lib/calendar/helpers/calendar.event-context.ts +72 -0
- package/src/lib/calendar/helpers/calendar.keyboard-interactions.ts +65 -0
- package/src/lib/calendar/index.ts +16 -0
- package/src/lib/calendar/partials/_variables.scss +15 -0
- package/src/lib/calendar/ui.test.ts +32 -0
- package/src/lib/calendar/ui.test.ts-snapshots/snapshots-calendar-Chrome-Stable-darwin.png +0 -0
- package/src/lib/calendar/ui.test.ts-snapshots/snapshots-calendar-Chrome-Stable-linux.png +0 -0
- package/src/lib/calendar/ui.test.ts-snapshots/snapshots-calendar-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/calendar/ui.test.ts-snapshots/snapshots-calendar-Desktop-Firefox-linux.png +0 -0
- package/src/lib/calendar/ui.test.ts-snapshots/snapshots-calendar-Desktop-Safari-darwin.png +0 -0
- package/src/lib/calendar/ui.test.ts-snapshots/snapshots-calendar-Desktop-Safari-linux.png +0 -0
- package/src/lib/components.spec.ts +7 -0
- package/{lib/components.d.ts → src/lib/components.ts} +16 -16
- package/src/lib/elevation/README.md +99 -0
- package/src/lib/elevation/elevation.scss +15 -0
- package/src/lib/elevation/elevation.spec.ts +55 -0
- package/src/lib/elevation/elevation.template.ts +26 -0
- package/src/lib/elevation/elevation.ts +17 -0
- package/src/lib/elevation/index.ts +17 -0
- package/src/lib/elevation/partials/_elevation.mixin.scss +4 -0
- package/src/lib/elevation/ui.test.ts +32 -0
- package/src/lib/elevation/ui.test.ts-snapshots/snapshots-elevation-Chrome-Stable-darwin.png +0 -0
- package/src/lib/elevation/ui.test.ts-snapshots/snapshots-elevation-Chrome-Stable-linux.png +0 -0
- package/src/lib/elevation/ui.test.ts-snapshots/snapshots-elevation-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/elevation/ui.test.ts-snapshots/snapshots-elevation-Desktop-Firefox-linux.png +0 -0
- package/src/lib/elevation/ui.test.ts-snapshots/snapshots-elevation-Desktop-Safari-darwin.png +0 -0
- package/src/lib/elevation/ui.test.ts-snapshots/snapshots-elevation-Desktop-Safari-linux.png +0 -0
- package/src/lib/enums.ts +55 -0
- package/src/lib/focus/README.md +1 -0
- package/src/lib/focus/focus.scss +17 -0
- package/src/lib/focus/focus.template.ts +16 -0
- package/src/lib/focus/focus.ts +10 -0
- package/src/lib/focus/index.ts +21 -0
- package/src/lib/focus/partials/variables.scss +2 -0
- package/src/lib/icon/README.md +70 -0
- package/src/lib/icon/__snapshots__/icon.spec.ts.snap +16 -0
- package/src/lib/icon/icon.placeholder.ts +12 -0
- package/src/lib/icon/icon.scss +52 -0
- package/src/lib/icon/icon.spec.ts +106 -0
- package/src/lib/icon/icon.template.ts +23 -0
- package/src/lib/icon/icon.ts +93 -0
- package/src/lib/icon/index.ts +14 -0
- package/src/lib/layout/README.md +154 -0
- package/src/lib/layout/index.ts +18 -0
- package/src/lib/layout/layout.scss +40 -0
- package/src/lib/layout/layout.spec.ts +73 -0
- package/src/lib/layout/layout.template.ts +29 -0
- package/src/lib/layout/layout.ts +46 -0
- package/src/lib/layout/partials/_functions.scss +15 -0
- package/src/lib/layout/partials/_mixins.scss +5 -0
- package/src/lib/layout/partials/_variables.scss +23 -0
- package/src/lib/layout/ui.test.ts +32 -0
- package/src/lib/layout/ui.test.ts-snapshots/snapshots-layout-Chrome-Stable-darwin.png +0 -0
- package/src/lib/layout/ui.test.ts-snapshots/snapshots-layout-Chrome-Stable-linux.png +0 -0
- package/src/lib/layout/ui.test.ts-snapshots/snapshots-layout-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/layout/ui.test.ts-snapshots/snapshots-layout-Desktop-Firefox-linux.png +0 -0
- package/src/lib/layout/ui.test.ts-snapshots/snapshots-layout-Desktop-Safari-darwin.png +0 -0
- package/src/lib/layout/ui.test.ts-snapshots/snapshots-layout-Desktop-Safari-linux.png +0 -0
- package/src/lib/popup/README.md +261 -0
- package/src/lib/popup/index.ts +21 -0
- package/src/lib/popup/popup.scss +43 -0
- package/src/lib/popup/popup.spec.ts +265 -0
- package/src/lib/popup/popup.template.ts +41 -0
- package/src/lib/popup/popup.ts +158 -0
- package/src/lib/popup/ui.test.ts +111 -0
- package/src/lib/popup/ui.test.ts-snapshots/snapshots-popup-Chrome-Stable-darwin.png +0 -0
- package/src/lib/popup/ui.test.ts-snapshots/snapshots-popup-Chrome-Stable-linux.png +0 -0
- package/src/lib/popup/ui.test.ts-snapshots/snapshots-popup-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/popup/ui.test.ts-snapshots/snapshots-popup-Desktop-Firefox-linux.png +0 -0
- package/src/lib/popup/ui.test.ts-snapshots/snapshots-popup-Desktop-Safari-darwin.png +0 -0
- package/src/lib/popup/ui.test.ts-snapshots/snapshots-popup-Desktop-Safari-linux.png +0 -0
- package/src/lib/progress/README.md +107 -0
- package/src/lib/progress/index.ts +14 -0
- package/src/lib/progress/progress.scss +133 -0
- package/src/lib/progress/progress.spec.ts +173 -0
- package/src/lib/progress/progress.template.ts +62 -0
- package/src/lib/progress/progress.ts +25 -0
- package/src/lib/progress/ui.test.ts +70 -0
- package/src/lib/progress/ui.test.ts-snapshots/snapshots-progress-Chrome-Stable-darwin.png +0 -0
- package/src/lib/progress/ui.test.ts-snapshots/snapshots-progress-Chrome-Stable-linux.png +0 -0
- package/src/lib/progress/ui.test.ts-snapshots/snapshots-progress-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/progress/ui.test.ts-snapshots/snapshots-progress-Desktop-Firefox-linux.png +0 -0
- package/src/lib/progress/ui.test.ts-snapshots/snapshots-progress-Desktop-Safari-darwin.png +0 -0
- package/src/lib/progress/ui.test.ts-snapshots/snapshots-progress-Desktop-Safari-linux.png +0 -0
- package/src/lib/progress-ring/README.md +90 -0
- package/src/lib/progress-ring/index.ts +15 -0
- package/src/lib/progress-ring/progress-ring.scss +75 -0
- package/src/lib/progress-ring/progress-ring.spec.ts +139 -0
- package/src/lib/progress-ring/progress-ring.template.ts +82 -0
- package/src/lib/progress-ring/progress-ring.ts +18 -0
- package/src/lib/progress-ring/ui.test.ts +35 -0
- package/src/lib/progress-ring/ui.test.ts-snapshots/snapshots-progress-ring-Chrome-Stable-darwin.png +0 -0
- package/src/lib/progress-ring/ui.test.ts-snapshots/snapshots-progress-ring-Chrome-Stable-linux.png +0 -0
- package/src/lib/progress-ring/ui.test.ts-snapshots/snapshots-progress-ring-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/progress-ring/ui.test.ts-snapshots/snapshots-progress-ring-Desktop-Firefox-linux.png +0 -0
- package/src/lib/progress-ring/ui.test.ts-snapshots/snapshots-progress-ring-Desktop-Safari-darwin.png +0 -0
- package/src/lib/progress-ring/ui.test.ts-snapshots/snapshots-progress-ring-Desktop-Safari-linux.png +0 -0
- package/src/lib/side-drawer/README.md +304 -0
- package/src/lib/side-drawer/index.ts +16 -0
- package/src/lib/side-drawer/partials/variables.scss +6 -0
- package/src/lib/side-drawer/side-drawer.scss +109 -0
- package/src/lib/side-drawer/side-drawer.spec.ts +118 -0
- package/src/lib/side-drawer/side-drawer.template.ts +51 -0
- package/src/lib/side-drawer/side-drawer.ts +58 -0
- package/src/lib/side-drawer/ui.test.ts +102 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-Chrome-Stable-darwin.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-Chrome-Stable-linux.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-Desktop-Firefox-linux.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-Desktop-Safari-darwin.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-Desktop-Safari-linux.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-modal-Chrome-Stable-darwin.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-modal-Chrome-Stable-linux.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-modal-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-modal-Desktop-Firefox-linux.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-modal-Desktop-Safari-darwin.png +0 -0
- package/src/lib/side-drawer/ui.test.ts-snapshots/snapshots-side-drawer-modal-Desktop-Safari-linux.png +0 -0
- package/src/lib/sidenav-item/README.md +41 -0
- package/src/lib/sidenav-item/index.ts +20 -0
- package/src/lib/sidenav-item/sidenav-item.scss +51 -0
- package/src/lib/sidenav-item/sidenav-item.spec.ts +64 -0
- package/src/lib/sidenav-item/sidenav-item.template.ts +25 -0
- package/src/lib/sidenav-item/sidenav-item.ts +15 -0
- package/src/lib/sidenav-item/ui.test.ts +32 -0
- package/src/lib/sidenav-item/ui.test.ts-snapshots/snapshots-sidenav-item-Chrome-Stable-darwin.png +0 -0
- package/src/lib/sidenav-item/ui.test.ts-snapshots/snapshots-sidenav-item-Chrome-Stable-linux.png +0 -0
- package/src/lib/sidenav-item/ui.test.ts-snapshots/snapshots-sidenav-item-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/sidenav-item/ui.test.ts-snapshots/snapshots-sidenav-item-Desktop-Firefox-linux.png +0 -0
- package/src/lib/sidenav-item/ui.test.ts-snapshots/snapshots-sidenav-item-Desktop-Safari-darwin.png +0 -0
- package/src/lib/sidenav-item/ui.test.ts-snapshots/snapshots-sidenav-item-Desktop-Safari-linux.png +0 -0
- package/src/lib/text/README.md +119 -0
- package/src/lib/text/index.ts +14 -0
- package/src/lib/text/text.scss +92 -0
- package/src/lib/text/text.spec.ts +54 -0
- package/src/lib/text/text.template.ts +28 -0
- package/src/lib/text/text.ts +55 -0
- package/src/lib/text/ui.test.ts +39 -0
- package/src/lib/text/ui.test.ts-snapshots/snapshots-text-Chrome-Stable-darwin.png +0 -0
- package/src/lib/text/ui.test.ts-snapshots/snapshots-text-Chrome-Stable-linux.png +0 -0
- package/src/lib/text/ui.test.ts-snapshots/snapshots-text-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/text/ui.test.ts-snapshots/snapshots-text-Desktop-Firefox-linux.png +0 -0
- package/src/lib/text/ui.test.ts-snapshots/snapshots-text-Desktop-Safari-darwin.png +0 -0
- package/src/lib/text/ui.test.ts-snapshots/snapshots-text-Desktop-Safari-linux.png +0 -0
- package/src/lib/text-anchor/README.md +5 -0
- package/src/lib/text-anchor/index.ts +12 -0
- package/src/lib/text-anchor/text-anchor.spec.ts +153 -0
- package/src/lib/text-anchor/text-anchor.template.ts +66 -0
- package/src/lib/text-anchor/text-anchor.ts +22 -0
- package/src/lib/tooltip/README.md +132 -0
- package/src/lib/tooltip/index.ts +16 -0
- package/src/lib/tooltip/partials/variables.scss +1 -0
- package/src/lib/tooltip/tooltip.scss +18 -0
- package/src/lib/tooltip/tooltip.spec.ts +70 -0
- package/src/lib/tooltip/tooltip.template.ts +30 -0
- package/src/lib/tooltip/tooltip.ts +44 -0
- package/src/lib/tooltip/ui.test.ts +53 -0
- package/src/lib/tooltip/ui.test.ts-snapshots/snapshots-tooltip-Chrome-Stable-darwin.png +0 -0
- package/src/lib/tooltip/ui.test.ts-snapshots/snapshots-tooltip-Chrome-Stable-linux.png +0 -0
- package/src/lib/tooltip/ui.test.ts-snapshots/snapshots-tooltip-Desktop-Firefox-darwin.png +0 -0
- package/src/lib/tooltip/ui.test.ts-snapshots/snapshots-tooltip-Desktop-Firefox-linux.png +0 -0
- package/src/lib/tooltip/ui.test.ts-snapshots/snapshots-tooltip-Desktop-Safari-darwin.png +0 -0
- package/src/lib/tooltip/ui.test.ts-snapshots/snapshots-tooltip-Desktop-Safari-linux.png +0 -0
- package/src/shared/design-system/index.ts +12 -0
- package/src/shared/patterns/affix.ts +56 -0
- package/{shared/patterns/index.d.ts → src/shared/patterns/index.ts} +1 -1
- package/src/types/extract-gfm.d.ts +5 -0
- package/src/types/style.d.ts +4 -0
- package/src/visual-tests/visual-tests-utils.ts +76 -0
- package/tsconfig.json +36 -0
- package/tsconfig.lib.json +11 -0
- package/tsconfig.spec.json +16 -0
- package/accordion/index.js +0 -61
- package/accordion-item/index.js +0 -125
- package/badge/index.js +0 -64
- package/banner/index.js +0 -212
- package/breadcrumb/index.js +0 -100
- package/breadcrumb-item/index.js +0 -55
- package/button/index.js +0 -761
- package/calendar/index.js +0 -1521
- package/elevation/index.js +0 -31
- package/focus/index.js +0 -3
- package/icon/index.js +0 -34
- package/index.js +0 -32
- package/layout/index.js +0 -53
- package/lib/accordion/accordion.d.ts +0 -9
- package/lib/accordion/accordion.template.d.ts +0 -4
- package/lib/accordion/index.d.ts +0 -2
- package/lib/accordion-item/accordion-item.d.ts +0 -13
- package/lib/accordion-item/accordion-item.template.d.ts +0 -4
- package/lib/accordion-item/index.d.ts +0 -3
- package/lib/badge/badge.d.ts +0 -17
- package/lib/badge/badge.template.d.ts +0 -4
- package/lib/badge/index.d.ts +0 -3
- package/lib/banner/banner.d.ts +0 -20
- package/lib/banner/banner.template.d.ts +0 -6
- package/lib/banner/index.d.ts +0 -2
- package/lib/breadcrumb/breadcrumb.d.ts +0 -3
- package/lib/breadcrumb/index.d.ts +0 -2
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +0 -5
- package/lib/breadcrumb-item/breadcrumb-item.template.d.ts +0 -4
- package/lib/breadcrumb-item/index.d.ts +0 -3
- package/lib/button/button.d.ts +0 -17
- package/lib/button/button.template.d.ts +0 -4
- package/lib/button/index.d.ts +0 -21
- package/lib/calendar/calendar.d.ts +0 -11
- package/lib/calendar/calendar.template.d.ts +0 -4
- package/lib/calendar/helpers/calendar.date-functions.d.ts +0 -2
- package/lib/calendar/helpers/calendar.event-context.d.ts +0 -6
- package/lib/calendar/helpers/calendar.keyboard-interactions.d.ts +0 -9
- package/lib/calendar/index.d.ts +0 -3
- package/lib/elevation/elevation.d.ts +0 -4
- package/lib/elevation/elevation.template.d.ts +0 -4
- package/lib/elevation/index.d.ts +0 -2
- package/lib/enums.d.ts +0 -45
- package/lib/focus/focus.d.ts +0 -3
- package/lib/focus/focus.template.d.ts +0 -4
- package/lib/focus/index.d.ts +0 -2
- package/lib/icon/icon.d.ts +0 -11
- package/lib/icon/icon.placeholder.d.ts +0 -1
- package/lib/icon/icon.template.d.ts +0 -4
- package/lib/icon/index.d.ts +0 -2
- package/lib/layout/index.d.ts +0 -2
- package/lib/layout/layout.d.ts +0 -16
- package/lib/layout/layout.template.d.ts +0 -4
- package/lib/popup/index.d.ts +0 -4
- package/lib/popup/popup.d.ts +0 -29
- package/lib/popup/popup.template.d.ts +0 -4
- package/lib/progress/index.d.ts +0 -2
- package/lib/progress/progress.d.ts +0 -9
- package/lib/progress/progress.template.d.ts +0 -5
- package/lib/side-drawer/index.d.ts +0 -2
- package/lib/side-drawer/side-drawer.d.ts +0 -12
- package/lib/side-drawer/side-drawer.template.d.ts +0 -4
- package/lib/sidenav-item/index.d.ts +0 -3
- package/lib/sidenav-item/sidenav-item.d.ts +0 -6
- package/lib/sidenav-item/sidenav-item.template.d.ts +0 -4
- package/lib/text/index.d.ts +0 -2
- package/lib/text/text.d.ts +0 -10
- package/lib/text/text.template.d.ts +0 -4
- package/lib/text-anchor/index.d.ts +0 -2
- package/lib/text-anchor/text-anchor.d.ts +0 -7
- package/lib/text-anchor/text-anchor.template.d.ts +0 -4
- package/lib/tooltip/index.d.ts +0 -3
- package/lib/tooltip/tooltip.d.ts +0 -10
- package/lib/tooltip/tooltip.template.d.ts +0 -4
- package/popup/index.js +0 -2087
- package/progress/index.js +0 -159
- package/shared/_has.js +0 -58
- package/shared/affix.js +0 -29
- package/shared/anchor.js +0 -78
- package/shared/apply-mixins.js +0 -22
- package/shared/aria-global.js +0 -156
- package/shared/breadcrumb-item.js +0 -25
- package/shared/class-names.js +0 -15
- package/shared/design-system/index.d.ts +0 -3
- package/shared/es.object.assign.js +0 -68
- package/shared/icon.js +0 -1393
- package/shared/index.js +0 -4991
- package/shared/index2.js +0 -21
- package/shared/patterns/affix.d.ts +0 -9
- package/shared/slotted.js +0 -119
- package/shared/style-inject.es.js +0 -28
- package/shared/text-anchor.js +0 -21
- package/shared/text-anchor.template.js +0 -54
- package/shared/web.dom-collections.iterator.js +0 -1479
- package/shared/when.js +0 -15
- package/side-drawer/index.js +0 -103
- package/sidenav-item/index.js +0 -38
- package/styles/fonts/spezia.css +0 -23
- package/styles/themes/dark.css +0 -193
- package/styles/themes/light.css +0 -193
- package/text/index.js +0 -45
- package/text-anchor/index.js +0 -19
- package/tooltip/index.js +0 -73
package/shared/when.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* A directive that enables basic conditional rendering in a template.
|
|
3
|
-
* @param binding - The condition to test for rendering.
|
|
4
|
-
* @param templateOrTemplateBinding - The template or a binding that gets
|
|
5
|
-
* the template to render when the condition is true.
|
|
6
|
-
* @public
|
|
7
|
-
*/
|
|
8
|
-
function when(binding, templateOrTemplateBinding) {
|
|
9
|
-
const getTemplate = typeof templateOrTemplateBinding === "function"
|
|
10
|
-
? templateOrTemplateBinding
|
|
11
|
-
: () => templateOrTemplateBinding;
|
|
12
|
-
return (source, context) => binding(source, context) ? getTemplate(source, context) : null;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
export { when as w };
|
package/side-drawer/index.js
DELETED
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index.js';
|
|
2
|
-
import '../shared/web.dom-collections.iterator.js';
|
|
3
|
-
import { s as styleInject } from '../shared/style-inject.es.js';
|
|
4
|
-
import { s as slotted } from '../shared/slotted.js';
|
|
5
|
-
import { c as classNames } from '../shared/class-names.js';
|
|
6
|
-
|
|
7
|
-
class SideDrawer extends FoundationElement {
|
|
8
|
-
constructor() {
|
|
9
|
-
super(...arguments);
|
|
10
|
-
this.alternate = false;
|
|
11
|
-
this.modal = false;
|
|
12
|
-
this.open = false;
|
|
13
|
-
|
|
14
|
-
this.handleScrimClick = () => {
|
|
15
|
-
if (this.modal && this.open) {
|
|
16
|
-
this.hide();
|
|
17
|
-
}
|
|
18
|
-
};
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
show() {
|
|
22
|
-
this.open = true;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
hide() {
|
|
26
|
-
this.open = false;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
handleKeydown({
|
|
30
|
-
key
|
|
31
|
-
}) {
|
|
32
|
-
if (this.open && key === 'Escape') {
|
|
33
|
-
this.hide();
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
__decorate([attr({
|
|
40
|
-
mode: 'boolean'
|
|
41
|
-
}), __metadata("design:type", Object)], SideDrawer.prototype, "alternate", void 0);
|
|
42
|
-
|
|
43
|
-
__decorate([attr({
|
|
44
|
-
mode: 'boolean'
|
|
45
|
-
}), __metadata("design:type", Object)], SideDrawer.prototype, "modal", void 0);
|
|
46
|
-
|
|
47
|
-
__decorate([attr({
|
|
48
|
-
mode: 'boolean'
|
|
49
|
-
}), __metadata("design:type", Object)], SideDrawer.prototype, "open", void 0);
|
|
50
|
-
|
|
51
|
-
__decorate([attr, __metadata("design:type", String)], SideDrawer.prototype, "position", void 0);
|
|
52
|
-
|
|
53
|
-
var css_248z = "/*\n Do not edit directly\n Generated on Sun, 23 Jan 2022 11:15:05 GMT\n*/\n:host {\n display: flex;\n block-size: 100vh;\n}\n\n:host([position=end]) {\n flex-direction: row-reverse;\n}\n\n.control {\n position: fixed;\n z-index: var(--side-drawer-z-index, 6);\n top: auto;\n bottom: 0;\n display: flex;\n overflow: auto;\n flex-direction: column;\n flex-shrink: 0;\n background-color: var(--side-drawer-background-color, var(--vvd-color-canvas));\n block-size: inherit;\n color: var(--side-drawer-color, var(--vvd-color-on-canvas));\n inline-size: var(--side-drawer-inline-size, 280px);\n}\n.control.alternate {\n background-color: var(--vvd-color-canvas);\n}\n.control:not(.open).end {\n transform: translateX(100%);\n}\n.control:not(.open):not(.end) {\n transform: translateX(-100%);\n}\n.control.control.open:not(.modal) + .side-drawer-app-content {\n font: 400 ultra-condensed 16px / 24px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n margin-inline-start: var(--side-drawer-inline-size, 280px);\n}\n.control.control.open:not(.modal) + .side-drawer-app-content ::slotted(vwc-top-app-bar),\n.control.control.open:not(.modal) + .side-drawer-app-content ::slotted(vwc-top-app-bar-fixed) {\n --mdc-top-app-bar-width: calc(100% - var(--side-drawer-inline-size, 280px));\n}\n.control.control.open:not(.modal).end + .side-drawer-app-content {\n margin-inline-end: var(--side-drawer-inline-size, 280px);\n margin-inline-start: 0;\n}\n@media (prefers-reduced-motion: no-preference) {\n .control {\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n }\n}\n\n.side-drawer-top-bar {\n font: 500 condensed 26px / 36px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n display: flex;\n flex-shrink: 0;\n align-items: center;\n padding-inline-end: var(--side-drawer-padding-top-bar, 16px);\n padding-inline-start: var(--side-drawer-padding-top-bar, 16px);\n}\n\n.side-drawer-content {\n background-color: inherit;\n overflow-y: auto;\n padding-inline-end: var(--side-drawer-padding-body, 16px);\n padding-inline-start: var(--side-drawer-padding-body, 16px);\n}\n\n.modal:not(.end) {\n inset-inline-start: 0;\n}\n.modal.end {\n inset-inline-end: 0;\n}\n\n.scrim {\n background-color: var(--vvd-color-on-canvas);\n opacity: 0.5;\n position: fixed;\n z-index: calc(6 - 1);\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n}";
|
|
54
|
-
styleInject(css_248z);
|
|
55
|
-
|
|
56
|
-
let _ = t => t,
|
|
57
|
-
_t,
|
|
58
|
-
_t2,
|
|
59
|
-
_t3;
|
|
60
|
-
|
|
61
|
-
const getClasses = ({
|
|
62
|
-
alternate,
|
|
63
|
-
modal,
|
|
64
|
-
open,
|
|
65
|
-
position
|
|
66
|
-
}) => classNames('control', ['alternate', alternate], ['modal', modal], ['open', open], ['end', position === 'end']);
|
|
67
|
-
|
|
68
|
-
const sideDrawerTemplate = (context, definition) => html(_t || (_t = _`
|
|
69
|
-
<aside class="${0}" part="${0}"
|
|
70
|
-
@keydown="${0}">
|
|
71
|
-
|
|
72
|
-
${0}
|
|
73
|
-
|
|
74
|
-
<div class="side-drawer-content">
|
|
75
|
-
<slot></slot>
|
|
76
|
-
</div>
|
|
77
|
-
</aside>
|
|
78
|
-
|
|
79
|
-
<div class="side-drawer-app-content">
|
|
80
|
-
<slot name="app-content"></slot>
|
|
81
|
-
</div>
|
|
82
|
-
|
|
83
|
-
${0}
|
|
84
|
-
`), getClasses, x => x.alternate ? 'vvd-theme-alternate' : '', (x, c) => x.handleKeydown(c.event), renderTopBar(), x => x.modal && x.open ? renderScrim() : '');
|
|
85
|
-
|
|
86
|
-
const renderTopBar = () => html(_t2 || (_t2 = _`
|
|
87
|
-
<header class="side-drawer-top-bar" part="side-drawer-top-bar">
|
|
88
|
-
<slot name="top-bar" ${0}></slot>
|
|
89
|
-
</header>`), slotted('hasTopBar'));
|
|
90
|
-
|
|
91
|
-
const renderScrim = () => {
|
|
92
|
-
return html(_t3 || (_t3 = _`
|
|
93
|
-
<div class="scrim" @click="${0}" @keydown="${0}"></div>`), x => x.handleScrimClick(), x => x.handleScrimClick());
|
|
94
|
-
};
|
|
95
|
-
|
|
96
|
-
const VIVIDSideDrawer = SideDrawer.compose({
|
|
97
|
-
baseName: 'side-drawer',
|
|
98
|
-
template: sideDrawerTemplate,
|
|
99
|
-
styles: css_248z
|
|
100
|
-
});
|
|
101
|
-
designSystem.register(VIVIDSideDrawer());
|
|
102
|
-
|
|
103
|
-
export { VIVIDSideDrawer };
|
package/sidenav-item/index.js
DELETED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import '../icon/index.js';
|
|
2
|
-
import { h as html, d as designSystem } from '../shared/index.js';
|
|
3
|
-
import { s as styleInject } from '../shared/style-inject.es.js';
|
|
4
|
-
import { b as AffixIcon } from '../shared/affix.js';
|
|
5
|
-
import { T as TextAnchor } from '../shared/text-anchor.js';
|
|
6
|
-
import { a as applyMixins } from '../shared/apply-mixins.js';
|
|
7
|
-
import { t as textAnchorTemplate } from '../shared/text-anchor.template.js';
|
|
8
|
-
import '../shared/icon.js';
|
|
9
|
-
import '../shared/web.dom-collections.iterator.js';
|
|
10
|
-
import '../shared/_has.js';
|
|
11
|
-
import '../shared/when.js';
|
|
12
|
-
import '../shared/class-names.js';
|
|
13
|
-
import '../shared/anchor.js';
|
|
14
|
-
import '../shared/aria-global.js';
|
|
15
|
-
|
|
16
|
-
var css_248z = "/*\n Do not edit directly\n Generated on Sun, 23 Jan 2022 11:15:05 GMT\n*/\n.control {\n font: 400 ultra-condensed 14px / 20px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n position: relative;\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n background-color: transparent;\n border-radius: 6px;\n color: var(--vvd-color-on-canvas);\n gap: 8px;\n -webkit-hyphens: auto;\n hyphens: auto;\n inline-size: 100%;\n min-block-size: 40px;\n outline: 0 none;\n padding-block: 10px;\n padding-inline: 8px;\n text-decoration: none;\n vertical-align: middle;\n word-break: break-word;\n}\n:host, .control {\n outline: 0 none;\n}\n\n.control.icon-only {\n display: flex;\n block-size: 40px;\n inline-size: 40px;\n place-content: center;\n}\n\n.control:focus {\n background-color: var(--vvd-color-neutral-20);\n}\n\n.control:focus-visible {\n box-shadow: inset 0 0 0 1px darkorange;\n}\n\n.icon {\n font-size: 20px;\n}";
|
|
17
|
-
styleInject(css_248z);
|
|
18
|
-
|
|
19
|
-
class SidenavItem extends TextAnchor {}
|
|
20
|
-
applyMixins(SidenavItem, AffixIcon);
|
|
21
|
-
|
|
22
|
-
let _ = t => t,
|
|
23
|
-
_t;
|
|
24
|
-
const SidenavItemTemplate = (context, definition) => html(_t || (_t = _`
|
|
25
|
-
${0}
|
|
26
|
-
`), textAnchorTemplate(context));
|
|
27
|
-
|
|
28
|
-
const vividSidenavItem = SidenavItem.compose({
|
|
29
|
-
baseName: 'sidenav-item',
|
|
30
|
-
template: SidenavItemTemplate,
|
|
31
|
-
styles: css_248z,
|
|
32
|
-
shadowOptions: {
|
|
33
|
-
delegatesFocus: true
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
designSystem.register(vividSidenavItem());
|
|
37
|
-
|
|
38
|
-
export { vividSidenavItem };
|
package/styles/fonts/spezia.css
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--vvd-font-family-spezia: SpeziaWebVariable;
|
|
3
|
-
--vvd-font-family-spezia-mono: SpeziaMonoWebVariable;
|
|
4
|
-
}
|
|
5
|
-
|
|
6
|
-
@font-face {
|
|
7
|
-
font-display: block;
|
|
8
|
-
font-family: SpeziaWebVariable;
|
|
9
|
-
font-stretch: 50% 200%;
|
|
10
|
-
font-style: normal;
|
|
11
|
-
font-weight: 1 1000;
|
|
12
|
-
src: url("https://fonts.resources.vonage.com/fonts/v1/Spezia_Web_Complete_Upright.woff2") format("woff2-variations");
|
|
13
|
-
}
|
|
14
|
-
@font-face {
|
|
15
|
-
font-display: block;
|
|
16
|
-
font-family: SpeziaMonoWebVariable;
|
|
17
|
-
font-stretch: 50% 200%;
|
|
18
|
-
font-style: normal;
|
|
19
|
-
font-weight: 1 1000;
|
|
20
|
-
src: url("https://fonts.resources.vonage.com/fonts/v1/Spezia_Web_Monospace_Complete.woff2") format("woff2-variations");
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
/*# sourceMappingURL=spezia.css.map */
|
package/styles/themes/dark.css
DELETED
|
@@ -1,193 +0,0 @@
|
|
|
1
|
-
:root, .vvd-theme-main, ::part(vvd-theme-main) {
|
|
2
|
-
--vvd-sizing-4px-scale-3xs: 8px;
|
|
3
|
-
--vvd-sizing-4px-scale-2xs: 12px;
|
|
4
|
-
--vvd-sizing-4px-scale-xs: 16px;
|
|
5
|
-
--vvd-sizing-4px-scale-sm: 20px;
|
|
6
|
-
--vvd-sizing-4px-scale-md: 24px;
|
|
7
|
-
--vvd-sizing-4px-scale-lg: 28px;
|
|
8
|
-
--vvd-sizing-4px-scale-xl: 32px;
|
|
9
|
-
--vvd-sizing-4px-scale-2xl: 36px;
|
|
10
|
-
--vvd-sizing-4px-scale-3xl: 40px;
|
|
11
|
-
--vvd-sizing-8px-scale-3xs: 8px;
|
|
12
|
-
--vvd-sizing-8px-scale-2xs: 16px;
|
|
13
|
-
--vvd-sizing-8px-scale-xs: 24px;
|
|
14
|
-
--vvd-sizing-8px-scale-sm: 32px;
|
|
15
|
-
--vvd-sizing-8px-scale-md: 40px;
|
|
16
|
-
--vvd-sizing-8px-scale-lg: 48px;
|
|
17
|
-
--vvd-sizing-8px-scale-xl: 56px;
|
|
18
|
-
--vvd-sizing-8px-scale-2xl: 64px;
|
|
19
|
-
--vvd-sizing-8px-scale-3xl: 72px;
|
|
20
|
-
--vvd-color-surface-0dp: rgba(13, 13, 13, 1);
|
|
21
|
-
--vvd-color-surface-2dp: rgba(28, 28, 28, 1);
|
|
22
|
-
--vvd-color-surface-4dp: rgba(32, 32, 32, 1);
|
|
23
|
-
--vvd-color-surface-8dp: rgba(37, 37, 37, 1);
|
|
24
|
-
--vvd-color-surface-12dp: rgba(42, 42, 42, 1);
|
|
25
|
-
--vvd-color-surface-16dp: rgba(47, 47, 47, 1);
|
|
26
|
-
--vvd-color-surface-24dp: rgba(52, 52, 52, 1);
|
|
27
|
-
--vvd-color-canvas: rgb(13,13,13);
|
|
28
|
-
--vvd-color-on-canvas: rgb(255,255,255);
|
|
29
|
-
--vvd-color-primary: rgb(255,255,255);
|
|
30
|
-
--vvd-color-on-primary: rgb(0,0,0);
|
|
31
|
-
--vvd-color-neutral: rgb(146,146,146);
|
|
32
|
-
--vvd-color-on-neutral: rgb(0,0,0);
|
|
33
|
-
--vvd-color-neutral-10: rgb(26,26,26);
|
|
34
|
-
--vvd-color-neutral-20: rgb(51,51,51);
|
|
35
|
-
--vvd-color-neutral-30: rgb(77,77,77);
|
|
36
|
-
--vvd-color-neutral-40: rgb(102,102,102);
|
|
37
|
-
--vvd-color-neutral-50: rgb(117,117,117);
|
|
38
|
-
--vvd-color-neutral-70: rgb(179,179,179);
|
|
39
|
-
--vvd-color-neutral-80: rgb(204,204,204);
|
|
40
|
-
--vvd-color-neutral-90: rgb(230,230,230);
|
|
41
|
-
--vvd-color-cta: rgb(178,123,242);
|
|
42
|
-
--vvd-color-on-cta: rgb(0,0,0);
|
|
43
|
-
--vvd-color-cta-10: rgb(38,4,77);
|
|
44
|
-
--vvd-color-cta-20: rgb(68,2,145);
|
|
45
|
-
--vvd-color-cta-30: rgb(100,5,209);
|
|
46
|
-
--vvd-color-cta-70: rgb(203,161,250);
|
|
47
|
-
--vvd-color-cta-90: rgb(236,226,250);
|
|
48
|
-
--vvd-color-success: rgb(48,168,73);
|
|
49
|
-
--vvd-color-on-success: rgb(0,0,0);
|
|
50
|
-
--vvd-color-success-10: rgb(10,30,17);
|
|
51
|
-
--vvd-color-success-20: rgb(24,58,30);
|
|
52
|
-
--vvd-color-success-30: rgb(21,89,35);
|
|
53
|
-
--vvd-color-success-70: rgb(83,202,106);
|
|
54
|
-
--vvd-color-success-90: rgb(207,238,212);
|
|
55
|
-
--vvd-color-alert: rgb(247,89,89);
|
|
56
|
-
--vvd-color-on-alert: rgb(0,0,0);
|
|
57
|
-
--vvd-color-alert-10: rgb(62,0,4);
|
|
58
|
-
--vvd-color-alert-20: rgb(110,0,0);
|
|
59
|
-
--vvd-color-alert-30: rgb(159,2,2);
|
|
60
|
-
--vvd-color-alert-70: rgb(254,150,150);
|
|
61
|
-
--vvd-color-alert-90: rgb(254,223,223);
|
|
62
|
-
--vvd-color-warning: rgb(224,121,2);
|
|
63
|
-
--vvd-color-on-warning: rgb(0,0,0);
|
|
64
|
-
--vvd-color-warning-10: rgb(42,21,2);
|
|
65
|
-
--vvd-color-warning-20: rgb(82,40,1);
|
|
66
|
-
--vvd-color-warning-30: rgb(128,56,7);
|
|
67
|
-
--vvd-color-warning-70: rgb(250,159,0);
|
|
68
|
-
--vvd-color-warning-90: rgb(253,231,109);
|
|
69
|
-
--vvd-color-info: rgb(41,151,240);
|
|
70
|
-
--vvd-color-on-info: rgb(0,0,0);
|
|
71
|
-
--vvd-color-info-10: rgb(7,25,57);
|
|
72
|
-
--vvd-color-info-20: rgb(14,48,109);
|
|
73
|
-
--vvd-color-info-30: rgb(9,74,158);
|
|
74
|
-
--vvd-color-info-70: rgb(101,186,255);
|
|
75
|
-
--vvd-color-info-90: rgb(211,233,252);
|
|
76
|
-
--vvd-color-announcement: rgb(229,96,187);
|
|
77
|
-
--vvd-color-on-announcement: rgb(0,0,0);
|
|
78
|
-
--vvd-color-announcement-10: rgb(50,8,44);
|
|
79
|
-
--vvd-color-announcement-20: rgb(98,2,86);
|
|
80
|
-
--vvd-color-announcement-30: rgb(143,22,105);
|
|
81
|
-
--vvd-color-announcement-70: rgb(251,143,216);
|
|
82
|
-
--vvd-color-announcement-90: rgb(255,220,247);
|
|
83
|
-
--vvd-shadow-surface-0dp: drop-shadow(1px 0 0 rgba(77, 77, 77, 1)) drop-shadow(0 1px 0 rgba(77, 77, 77, 1)) drop-shadow(0 -1px 0 rgba(77, 77, 77, 1)) drop-shadow(-1px 0 0 rgba(77, 77, 77, 1));
|
|
84
|
-
--vvd-shadow-surface-2dp: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 1px rgba(0, 0, 0, 0.25));
|
|
85
|
-
--vvd-shadow-surface-4dp: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
|
|
86
|
-
--vvd-shadow-surface-8dp: drop-shadow(0 2px 16px rgba(19, 20, 21, 0.25)) drop-shadow(0 8px 8px rgba(19, 20, 21, 0.25)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
|
|
87
|
-
--vvd-shadow-surface-12dp: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.25)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.25)) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.25));
|
|
88
|
-
--vvd-shadow-surface-16dp: drop-shadow(0 6px 32px rgba(0, 0, 0, 0.25)) drop-shadow(0 16px 24px rgba(0, 0, 0, 0.25)) drop-shadow(0 8px 12px rgba(0, 0, 0, 0.25));
|
|
89
|
-
--vvd-shadow-surface-24dp: drop-shadow(0 12px 48px rgba(0, 0, 0, 0.25)) drop-shadow(0 24px 32px rgba(0, 0, 0, 0.25)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.25));
|
|
90
|
-
}
|
|
91
|
-
@supports (color-scheme: dark) {
|
|
92
|
-
:root, .vvd-theme-main, ::part(vvd-theme-main) {
|
|
93
|
-
color-scheme: dark;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.vvd-theme-alternate, ::part(vvd-theme-alternate) {
|
|
98
|
-
--vvd-sizing-4px-scale-3xs: 8px;
|
|
99
|
-
--vvd-sizing-4px-scale-2xs: 12px;
|
|
100
|
-
--vvd-sizing-4px-scale-xs: 16px;
|
|
101
|
-
--vvd-sizing-4px-scale-sm: 20px;
|
|
102
|
-
--vvd-sizing-4px-scale-md: 24px;
|
|
103
|
-
--vvd-sizing-4px-scale-lg: 28px;
|
|
104
|
-
--vvd-sizing-4px-scale-xl: 32px;
|
|
105
|
-
--vvd-sizing-4px-scale-2xl: 36px;
|
|
106
|
-
--vvd-sizing-4px-scale-3xl: 40px;
|
|
107
|
-
--vvd-sizing-8px-scale-3xs: 8px;
|
|
108
|
-
--vvd-sizing-8px-scale-2xs: 16px;
|
|
109
|
-
--vvd-sizing-8px-scale-xs: 24px;
|
|
110
|
-
--vvd-sizing-8px-scale-sm: 32px;
|
|
111
|
-
--vvd-sizing-8px-scale-md: 40px;
|
|
112
|
-
--vvd-sizing-8px-scale-lg: 48px;
|
|
113
|
-
--vvd-sizing-8px-scale-xl: 56px;
|
|
114
|
-
--vvd-sizing-8px-scale-2xl: 64px;
|
|
115
|
-
--vvd-sizing-8px-scale-3xl: 72px;
|
|
116
|
-
--vvd-color-surface-0dp: rgba(255, 255, 255, 1);
|
|
117
|
-
--vvd-color-surface-2dp: rgba(255, 255, 255, 1);
|
|
118
|
-
--vvd-color-surface-4dp: rgba(255, 255, 255, 1);
|
|
119
|
-
--vvd-color-surface-8dp: rgba(255, 255, 255, 1);
|
|
120
|
-
--vvd-color-surface-12dp: rgba(255, 255, 255, 1);
|
|
121
|
-
--vvd-color-surface-16dp: rgba(255, 255, 255, 1);
|
|
122
|
-
--vvd-color-surface-24dp: rgba(255, 255, 255, 1);
|
|
123
|
-
--vvd-color-canvas: rgb(255,255,255);
|
|
124
|
-
--vvd-color-on-canvas: rgb(0,0,0);
|
|
125
|
-
--vvd-color-primary: rgb(0,0,0);
|
|
126
|
-
--vvd-color-on-primary: rgb(255,255,255);
|
|
127
|
-
--vvd-color-neutral: rgb(117,117,117);
|
|
128
|
-
--vvd-color-on-neutral: rgb(255,255,255);
|
|
129
|
-
--vvd-color-neutral-10: rgb(242,242,242);
|
|
130
|
-
--vvd-color-neutral-20: rgb(230,230,230);
|
|
131
|
-
--vvd-color-neutral-30: rgb(204,204,204);
|
|
132
|
-
--vvd-color-neutral-40: rgb(179,179,179);
|
|
133
|
-
--vvd-color-neutral-50: rgb(146,146,146);
|
|
134
|
-
--vvd-color-neutral-70: rgb(102,102,102);
|
|
135
|
-
--vvd-color-neutral-80: rgb(77,77,77);
|
|
136
|
-
--vvd-color-neutral-90: rgb(51,51,51);
|
|
137
|
-
--vvd-color-cta: rgb(153,65,255);
|
|
138
|
-
--vvd-color-on-cta: rgb(255,255,255);
|
|
139
|
-
--vvd-color-cta-10: rgb(245,240,253);
|
|
140
|
-
--vvd-color-cta-20: rgb(236,226,250);
|
|
141
|
-
--vvd-color-cta-30: rgb(220,193,252);
|
|
142
|
-
--vvd-color-cta-70: rgb(135,30,255);
|
|
143
|
-
--vvd-color-cta-90: rgb(68,2,145);
|
|
144
|
-
--vvd-color-success: rgb(28,135,49);
|
|
145
|
-
--vvd-color-on-success: rgb(255,255,255);
|
|
146
|
-
--vvd-color-success-10: rgb(225,248,229);
|
|
147
|
-
--vvd-color-success-20: rgb(207,238,212);
|
|
148
|
-
--vvd-color-success-30: rgb(134,224,144);
|
|
149
|
-
--vvd-color-success-70: rgb(22,118,41);
|
|
150
|
-
--vvd-color-success-90: rgb(24,58,30);
|
|
151
|
-
--vvd-color-alert: rgb(230,29,29);
|
|
152
|
-
--vvd-color-on-alert: rgb(255,255,255);
|
|
153
|
-
--vvd-color-alert-10: rgb(255,238,242);
|
|
154
|
-
--vvd-color-alert-20: rgb(254,223,223);
|
|
155
|
-
--vvd-color-alert-30: rgb(255,187,187);
|
|
156
|
-
--vvd-color-alert-70: rgb(205,13,13);
|
|
157
|
-
--vvd-color-alert-90: rgb(110,0,0);
|
|
158
|
-
--vvd-color-warning: rgb(250,159,0);
|
|
159
|
-
--vvd-color-on-warning: rgb(0,0,0);
|
|
160
|
-
--vvd-color-warning-10: rgb(252,245,167);
|
|
161
|
-
--vvd-color-warning-20: rgb(253,231,109);
|
|
162
|
-
--vvd-color-warning-30: rgb(255,195,33);
|
|
163
|
-
--vvd-color-warning-70: rgb(166,76,3);
|
|
164
|
-
--vvd-color-warning-90: rgb(82,40,1);
|
|
165
|
-
--vvd-color-info: rgb(2,118,213);
|
|
166
|
-
--vvd-color-on-info: rgb(255,255,255);
|
|
167
|
-
--vvd-color-info-10: rgb(232,244,251);
|
|
168
|
-
--vvd-color-info-20: rgb(211,233,252);
|
|
169
|
-
--vvd-color-info-30: rgb(157,210,254);
|
|
170
|
-
--vvd-color-info-70: rgb(14,101,194);
|
|
171
|
-
--vvd-color-info-90: rgb(14,48,109);
|
|
172
|
-
--vvd-color-announcement: rgb(214,33,156);
|
|
173
|
-
--vvd-color-on-announcement: rgb(255,255,255);
|
|
174
|
-
--vvd-color-announcement-10: rgb(255,237,251);
|
|
175
|
-
--vvd-color-announcement-20: rgb(255,220,247);
|
|
176
|
-
--vvd-color-announcement-30: rgb(248,185,231);
|
|
177
|
-
--vvd-color-announcement-70: rgb(187,30,137);
|
|
178
|
-
--vvd-color-announcement-90: rgb(98,2,86);
|
|
179
|
-
--vvd-shadow-surface-0dp: drop-shadow(1px 0 0 rgba(204, 204, 204, 1)) drop-shadow(0 1px 0 rgba(204, 204, 204, 1)) drop-shadow(0 -1px 0 rgba(204, 204, 204, 1)) drop-shadow(-1px 0 0 rgba(204, 204, 204, 1));
|
|
180
|
-
--vvd-shadow-surface-2dp: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.1)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.05)) drop-shadow(0 2px 1px rgba(0, 0, 0, 0.05));
|
|
181
|
-
--vvd-shadow-surface-4dp: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.1)) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.05)) drop-shadow(0 4px 2px rgba(0, 0, 0, 0.05));
|
|
182
|
-
--vvd-shadow-surface-8dp: drop-shadow(0 2px 16px rgba(0, 0, 0, 0.1)) drop-shadow(0 8px 8px rgba(0, 0, 0, 0.05)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.05));
|
|
183
|
-
--vvd-shadow-surface-12dp: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.1)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.05)) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.05));
|
|
184
|
-
--vvd-shadow-surface-16dp: drop-shadow(0 6px 32px rgba(0, 0, 0, 0.1)) drop-shadow(0 16px 24px rgba(0, 0, 0, 0.05)) drop-shadow(0 8px 12px rgba(0, 0, 0, 0.05));
|
|
185
|
-
--vvd-shadow-surface-24dp: drop-shadow(0 12px 48px rgba(0, 0, 0, 0.2)) drop-shadow(0 24px 32px rgba(0, 0, 0, 0.05)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.05));
|
|
186
|
-
}
|
|
187
|
-
@supports (color-scheme: light) {
|
|
188
|
-
.vvd-theme-alternate, ::part(vvd-theme-alternate) {
|
|
189
|
-
color-scheme: light;
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
/*# sourceMappingURL=dark.css.map */
|
package/styles/themes/light.css
DELETED
|
@@ -1,193 +0,0 @@
|
|
|
1
|
-
:root, .vvd-theme-main, ::part(vvd-theme-main) {
|
|
2
|
-
--vvd-sizing-4px-scale-3xs: 8px;
|
|
3
|
-
--vvd-sizing-4px-scale-2xs: 12px;
|
|
4
|
-
--vvd-sizing-4px-scale-xs: 16px;
|
|
5
|
-
--vvd-sizing-4px-scale-sm: 20px;
|
|
6
|
-
--vvd-sizing-4px-scale-md: 24px;
|
|
7
|
-
--vvd-sizing-4px-scale-lg: 28px;
|
|
8
|
-
--vvd-sizing-4px-scale-xl: 32px;
|
|
9
|
-
--vvd-sizing-4px-scale-2xl: 36px;
|
|
10
|
-
--vvd-sizing-4px-scale-3xl: 40px;
|
|
11
|
-
--vvd-sizing-8px-scale-3xs: 8px;
|
|
12
|
-
--vvd-sizing-8px-scale-2xs: 16px;
|
|
13
|
-
--vvd-sizing-8px-scale-xs: 24px;
|
|
14
|
-
--vvd-sizing-8px-scale-sm: 32px;
|
|
15
|
-
--vvd-sizing-8px-scale-md: 40px;
|
|
16
|
-
--vvd-sizing-8px-scale-lg: 48px;
|
|
17
|
-
--vvd-sizing-8px-scale-xl: 56px;
|
|
18
|
-
--vvd-sizing-8px-scale-2xl: 64px;
|
|
19
|
-
--vvd-sizing-8px-scale-3xl: 72px;
|
|
20
|
-
--vvd-color-surface-0dp: rgba(255, 255, 255, 1);
|
|
21
|
-
--vvd-color-surface-2dp: rgba(255, 255, 255, 1);
|
|
22
|
-
--vvd-color-surface-4dp: rgba(255, 255, 255, 1);
|
|
23
|
-
--vvd-color-surface-8dp: rgba(255, 255, 255, 1);
|
|
24
|
-
--vvd-color-surface-12dp: rgba(255, 255, 255, 1);
|
|
25
|
-
--vvd-color-surface-16dp: rgba(255, 255, 255, 1);
|
|
26
|
-
--vvd-color-surface-24dp: rgba(255, 255, 255, 1);
|
|
27
|
-
--vvd-color-canvas: rgb(255,255,255);
|
|
28
|
-
--vvd-color-on-canvas: rgb(0,0,0);
|
|
29
|
-
--vvd-color-primary: rgb(0,0,0);
|
|
30
|
-
--vvd-color-on-primary: rgb(255,255,255);
|
|
31
|
-
--vvd-color-neutral: rgb(117,117,117);
|
|
32
|
-
--vvd-color-on-neutral: rgb(255,255,255);
|
|
33
|
-
--vvd-color-neutral-10: rgb(242,242,242);
|
|
34
|
-
--vvd-color-neutral-20: rgb(230,230,230);
|
|
35
|
-
--vvd-color-neutral-30: rgb(204,204,204);
|
|
36
|
-
--vvd-color-neutral-40: rgb(179,179,179);
|
|
37
|
-
--vvd-color-neutral-50: rgb(146,146,146);
|
|
38
|
-
--vvd-color-neutral-70: rgb(102,102,102);
|
|
39
|
-
--vvd-color-neutral-80: rgb(77,77,77);
|
|
40
|
-
--vvd-color-neutral-90: rgb(51,51,51);
|
|
41
|
-
--vvd-color-cta: rgb(153,65,255);
|
|
42
|
-
--vvd-color-on-cta: rgb(255,255,255);
|
|
43
|
-
--vvd-color-cta-10: rgb(245,240,253);
|
|
44
|
-
--vvd-color-cta-20: rgb(236,226,250);
|
|
45
|
-
--vvd-color-cta-30: rgb(220,193,252);
|
|
46
|
-
--vvd-color-cta-70: rgb(135,30,255);
|
|
47
|
-
--vvd-color-cta-90: rgb(68,2,145);
|
|
48
|
-
--vvd-color-success: rgb(28,135,49);
|
|
49
|
-
--vvd-color-on-success: rgb(255,255,255);
|
|
50
|
-
--vvd-color-success-10: rgb(225,248,229);
|
|
51
|
-
--vvd-color-success-20: rgb(207,238,212);
|
|
52
|
-
--vvd-color-success-30: rgb(134,224,144);
|
|
53
|
-
--vvd-color-success-70: rgb(22,118,41);
|
|
54
|
-
--vvd-color-success-90: rgb(24,58,30);
|
|
55
|
-
--vvd-color-alert: rgb(230,29,29);
|
|
56
|
-
--vvd-color-on-alert: rgb(255,255,255);
|
|
57
|
-
--vvd-color-alert-10: rgb(255,238,242);
|
|
58
|
-
--vvd-color-alert-20: rgb(254,223,223);
|
|
59
|
-
--vvd-color-alert-30: rgb(255,187,187);
|
|
60
|
-
--vvd-color-alert-70: rgb(205,13,13);
|
|
61
|
-
--vvd-color-alert-90: rgb(110,0,0);
|
|
62
|
-
--vvd-color-warning: rgb(250,159,0);
|
|
63
|
-
--vvd-color-on-warning: rgb(0,0,0);
|
|
64
|
-
--vvd-color-warning-10: rgb(252,245,167);
|
|
65
|
-
--vvd-color-warning-20: rgb(253,231,109);
|
|
66
|
-
--vvd-color-warning-30: rgb(255,195,33);
|
|
67
|
-
--vvd-color-warning-70: rgb(166,76,3);
|
|
68
|
-
--vvd-color-warning-90: rgb(82,40,1);
|
|
69
|
-
--vvd-color-info: rgb(2,118,213);
|
|
70
|
-
--vvd-color-on-info: rgb(255,255,255);
|
|
71
|
-
--vvd-color-info-10: rgb(232,244,251);
|
|
72
|
-
--vvd-color-info-20: rgb(211,233,252);
|
|
73
|
-
--vvd-color-info-30: rgb(157,210,254);
|
|
74
|
-
--vvd-color-info-70: rgb(14,101,194);
|
|
75
|
-
--vvd-color-info-90: rgb(14,48,109);
|
|
76
|
-
--vvd-color-announcement: rgb(214,33,156);
|
|
77
|
-
--vvd-color-on-announcement: rgb(255,255,255);
|
|
78
|
-
--vvd-color-announcement-10: rgb(255,237,251);
|
|
79
|
-
--vvd-color-announcement-20: rgb(255,220,247);
|
|
80
|
-
--vvd-color-announcement-30: rgb(248,185,231);
|
|
81
|
-
--vvd-color-announcement-70: rgb(187,30,137);
|
|
82
|
-
--vvd-color-announcement-90: rgb(98,2,86);
|
|
83
|
-
--vvd-shadow-surface-0dp: drop-shadow(1px 0 0 rgba(204, 204, 204, 1)) drop-shadow(0 1px 0 rgba(204, 204, 204, 1)) drop-shadow(0 -1px 0 rgba(204, 204, 204, 1)) drop-shadow(-1px 0 0 rgba(204, 204, 204, 1));
|
|
84
|
-
--vvd-shadow-surface-2dp: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.1)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.05)) drop-shadow(0 2px 1px rgba(0, 0, 0, 0.05));
|
|
85
|
-
--vvd-shadow-surface-4dp: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.1)) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.05)) drop-shadow(0 4px 2px rgba(0, 0, 0, 0.05));
|
|
86
|
-
--vvd-shadow-surface-8dp: drop-shadow(0 2px 16px rgba(0, 0, 0, 0.1)) drop-shadow(0 8px 8px rgba(0, 0, 0, 0.05)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.05));
|
|
87
|
-
--vvd-shadow-surface-12dp: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.1)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.05)) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.05));
|
|
88
|
-
--vvd-shadow-surface-16dp: drop-shadow(0 6px 32px rgba(0, 0, 0, 0.1)) drop-shadow(0 16px 24px rgba(0, 0, 0, 0.05)) drop-shadow(0 8px 12px rgba(0, 0, 0, 0.05));
|
|
89
|
-
--vvd-shadow-surface-24dp: drop-shadow(0 12px 48px rgba(0, 0, 0, 0.2)) drop-shadow(0 24px 32px rgba(0, 0, 0, 0.05)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.05));
|
|
90
|
-
}
|
|
91
|
-
@supports (color-scheme: light) {
|
|
92
|
-
:root, .vvd-theme-main, ::part(vvd-theme-main) {
|
|
93
|
-
color-scheme: light;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.vvd-theme-alternate, ::part(vvd-theme-alternate) {
|
|
98
|
-
--vvd-sizing-4px-scale-3xs: 8px;
|
|
99
|
-
--vvd-sizing-4px-scale-2xs: 12px;
|
|
100
|
-
--vvd-sizing-4px-scale-xs: 16px;
|
|
101
|
-
--vvd-sizing-4px-scale-sm: 20px;
|
|
102
|
-
--vvd-sizing-4px-scale-md: 24px;
|
|
103
|
-
--vvd-sizing-4px-scale-lg: 28px;
|
|
104
|
-
--vvd-sizing-4px-scale-xl: 32px;
|
|
105
|
-
--vvd-sizing-4px-scale-2xl: 36px;
|
|
106
|
-
--vvd-sizing-4px-scale-3xl: 40px;
|
|
107
|
-
--vvd-sizing-8px-scale-3xs: 8px;
|
|
108
|
-
--vvd-sizing-8px-scale-2xs: 16px;
|
|
109
|
-
--vvd-sizing-8px-scale-xs: 24px;
|
|
110
|
-
--vvd-sizing-8px-scale-sm: 32px;
|
|
111
|
-
--vvd-sizing-8px-scale-md: 40px;
|
|
112
|
-
--vvd-sizing-8px-scale-lg: 48px;
|
|
113
|
-
--vvd-sizing-8px-scale-xl: 56px;
|
|
114
|
-
--vvd-sizing-8px-scale-2xl: 64px;
|
|
115
|
-
--vvd-sizing-8px-scale-3xl: 72px;
|
|
116
|
-
--vvd-color-surface-0dp: rgba(13, 13, 13, 1);
|
|
117
|
-
--vvd-color-surface-2dp: rgba(28, 28, 28, 1);
|
|
118
|
-
--vvd-color-surface-4dp: rgba(32, 32, 32, 1);
|
|
119
|
-
--vvd-color-surface-8dp: rgba(37, 37, 37, 1);
|
|
120
|
-
--vvd-color-surface-12dp: rgba(42, 42, 42, 1);
|
|
121
|
-
--vvd-color-surface-16dp: rgba(47, 47, 47, 1);
|
|
122
|
-
--vvd-color-surface-24dp: rgba(52, 52, 52, 1);
|
|
123
|
-
--vvd-color-canvas: rgb(13,13,13);
|
|
124
|
-
--vvd-color-on-canvas: rgb(255,255,255);
|
|
125
|
-
--vvd-color-primary: rgb(255,255,255);
|
|
126
|
-
--vvd-color-on-primary: rgb(0,0,0);
|
|
127
|
-
--vvd-color-neutral: rgb(146,146,146);
|
|
128
|
-
--vvd-color-on-neutral: rgb(0,0,0);
|
|
129
|
-
--vvd-color-neutral-10: rgb(26,26,26);
|
|
130
|
-
--vvd-color-neutral-20: rgb(51,51,51);
|
|
131
|
-
--vvd-color-neutral-30: rgb(77,77,77);
|
|
132
|
-
--vvd-color-neutral-40: rgb(102,102,102);
|
|
133
|
-
--vvd-color-neutral-50: rgb(117,117,117);
|
|
134
|
-
--vvd-color-neutral-70: rgb(179,179,179);
|
|
135
|
-
--vvd-color-neutral-80: rgb(204,204,204);
|
|
136
|
-
--vvd-color-neutral-90: rgb(230,230,230);
|
|
137
|
-
--vvd-color-cta: rgb(178,123,242);
|
|
138
|
-
--vvd-color-on-cta: rgb(0,0,0);
|
|
139
|
-
--vvd-color-cta-10: rgb(38,4,77);
|
|
140
|
-
--vvd-color-cta-20: rgb(68,2,145);
|
|
141
|
-
--vvd-color-cta-30: rgb(100,5,209);
|
|
142
|
-
--vvd-color-cta-70: rgb(203,161,250);
|
|
143
|
-
--vvd-color-cta-90: rgb(236,226,250);
|
|
144
|
-
--vvd-color-success: rgb(48,168,73);
|
|
145
|
-
--vvd-color-on-success: rgb(0,0,0);
|
|
146
|
-
--vvd-color-success-10: rgb(10,30,17);
|
|
147
|
-
--vvd-color-success-20: rgb(24,58,30);
|
|
148
|
-
--vvd-color-success-30: rgb(21,89,35);
|
|
149
|
-
--vvd-color-success-70: rgb(83,202,106);
|
|
150
|
-
--vvd-color-success-90: rgb(207,238,212);
|
|
151
|
-
--vvd-color-alert: rgb(247,89,89);
|
|
152
|
-
--vvd-color-on-alert: rgb(0,0,0);
|
|
153
|
-
--vvd-color-alert-10: rgb(62,0,4);
|
|
154
|
-
--vvd-color-alert-20: rgb(110,0,0);
|
|
155
|
-
--vvd-color-alert-30: rgb(159,2,2);
|
|
156
|
-
--vvd-color-alert-70: rgb(254,150,150);
|
|
157
|
-
--vvd-color-alert-90: rgb(254,223,223);
|
|
158
|
-
--vvd-color-warning: rgb(224,121,2);
|
|
159
|
-
--vvd-color-on-warning: rgb(0,0,0);
|
|
160
|
-
--vvd-color-warning-10: rgb(42,21,2);
|
|
161
|
-
--vvd-color-warning-20: rgb(82,40,1);
|
|
162
|
-
--vvd-color-warning-30: rgb(128,56,7);
|
|
163
|
-
--vvd-color-warning-70: rgb(250,159,0);
|
|
164
|
-
--vvd-color-warning-90: rgb(253,231,109);
|
|
165
|
-
--vvd-color-info: rgb(41,151,240);
|
|
166
|
-
--vvd-color-on-info: rgb(0,0,0);
|
|
167
|
-
--vvd-color-info-10: rgb(7,25,57);
|
|
168
|
-
--vvd-color-info-20: rgb(14,48,109);
|
|
169
|
-
--vvd-color-info-30: rgb(9,74,158);
|
|
170
|
-
--vvd-color-info-70: rgb(101,186,255);
|
|
171
|
-
--vvd-color-info-90: rgb(211,233,252);
|
|
172
|
-
--vvd-color-announcement: rgb(229,96,187);
|
|
173
|
-
--vvd-color-on-announcement: rgb(0,0,0);
|
|
174
|
-
--vvd-color-announcement-10: rgb(50,8,44);
|
|
175
|
-
--vvd-color-announcement-20: rgb(98,2,86);
|
|
176
|
-
--vvd-color-announcement-30: rgb(143,22,105);
|
|
177
|
-
--vvd-color-announcement-70: rgb(251,143,216);
|
|
178
|
-
--vvd-color-announcement-90: rgb(255,220,247);
|
|
179
|
-
--vvd-shadow-surface-0dp: drop-shadow(1px 0 0 rgba(77, 77, 77, 1)) drop-shadow(0 1px 0 rgba(77, 77, 77, 1)) drop-shadow(0 -1px 0 rgba(77, 77, 77, 1)) drop-shadow(-1px 0 0 rgba(77, 77, 77, 1));
|
|
180
|
-
--vvd-shadow-surface-2dp: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 1px rgba(0, 0, 0, 0.25));
|
|
181
|
-
--vvd-shadow-surface-4dp: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.25)) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
|
|
182
|
-
--vvd-shadow-surface-8dp: drop-shadow(0 2px 16px rgba(19, 20, 21, 0.25)) drop-shadow(0 8px 8px rgba(19, 20, 21, 0.25)) drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
|
|
183
|
-
--vvd-shadow-surface-12dp: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.25)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.25)) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.25));
|
|
184
|
-
--vvd-shadow-surface-16dp: drop-shadow(0 6px 32px rgba(0, 0, 0, 0.25)) drop-shadow(0 16px 24px rgba(0, 0, 0, 0.25)) drop-shadow(0 8px 12px rgba(0, 0, 0, 0.25));
|
|
185
|
-
--vvd-shadow-surface-24dp: drop-shadow(0 12px 48px rgba(0, 0, 0, 0.25)) drop-shadow(0 24px 32px rgba(0, 0, 0, 0.25)) drop-shadow(0 12px 16px rgba(0, 0, 0, 0.25));
|
|
186
|
-
}
|
|
187
|
-
@supports (color-scheme: dark) {
|
|
188
|
-
.vvd-theme-alternate, ::part(vvd-theme-alternate) {
|
|
189
|
-
color-scheme: dark;
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
/*# sourceMappingURL=light.css.map */
|
package/text/index.js
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index.js';
|
|
2
|
-
import { s as styleInject } from '../shared/style-inject.es.js';
|
|
3
|
-
import '../shared/web.dom-collections.iterator.js';
|
|
4
|
-
import { c as classNames } from '../shared/class-names.js';
|
|
5
|
-
|
|
6
|
-
var css_248z = "/*\n Do not edit directly\n Generated on Sun, 23 Jan 2022 11:15:05 GMT\n*/\n.control:not(.tight):not(.font-face-body-1, .font-face-body-1-bold, .font-face-body-1-code, .font-face-body-1-link, .font-face-body-2, .font-face-body-2-bold, .font-face-body-2-code, .font-face-body-2-link, .font-face-button, .font-face-button-dense, .font-face-button-enlarge, .font-face-caption, .font-face-caption-bold, .font-face-caption-code, .font-face-caption-link, .font-face-headline-1, .font-face-headline-2, .font-face-subtitle-1, .font-face-subtitle-2, .font-face-title-1, .font-face-title-2), .control.font-face-body-1:not(.tight), .control.font-face-body-1-bold:not(.tight), .control.font-face-body-1-code:not(.tight), .control.font-face-body-1-link:not(.tight), .control.font-face-body-2:not(.tight), .control.font-face-body-2-bold:not(.tight), .control.font-face-body-2-code:not(.tight), .control.font-face-body-2-link:not(.tight), .control.font-face-subtitle-1:not(.tight), .control.font-face-subtitle-2:not(.tight), .control.font-face-title-1:not(.tight), .control.font-face-title-2:not(.tight), .control.font-face-headline-1:not(.tight), .control.font-face-headline-2:not(.tight) {\n display: block;\n margin: var(--font-face-margin, 0);\n}\n\n.control {\n color: var(--connotation);\n}\n.control.font-face-body-1 {\n font: 400 ultra-condensed 16px / 24px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-body-1-bold {\n font: 600 ultra-condensed 16px / 24px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-body-1-code {\n font: 400 ultra-condensed 16px / 24px SpeziaMonoWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-body-1-link {\n font: 400 ultra-condensed 16px / 24px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: underline;\n text-transform: none;\n}\n.control.font-face-body-2 {\n font: 400 ultra-condensed 14px / 20px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-body-2-bold {\n font: 600 ultra-condensed 14px / 20px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-body-2-code {\n font: 400 ultra-condensed 14px / 20px SpeziaMonoWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-body-2-link {\n font: 400 ultra-condensed 14px / 20px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: underline;\n text-transform: none;\n}\n.control.font-face-button {\n font: 600 ultra-condensed 14px / 100% SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-button-dense {\n font: 600 ultra-condensed 12px / 100% SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-button-enlarge {\n font: 600 ultra-condensed 16px / 100% SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-caption {\n font: 400 ultra-condensed 12px / 16px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-caption-bold {\n font: 600 ultra-condensed 12px / 16px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-caption-code {\n font: 400 ultra-condensed 12px / 16px SpeziaMonoWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-caption-link {\n font: 400 ultra-condensed 12px / 16px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: underline;\n text-transform: none;\n}\n.control.font-face-headline-1 {\n font: 500 condensed 66px / 88px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-headline-2 {\n font: 500 condensed 52px / 68px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-subtitle-1 {\n font: 500 condensed 26px / 36px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-subtitle-2 {\n font: 500 condensed 20px / 28px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-title-1 {\n font: 500 condensed 40px / 52px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.font-face-title-2 {\n font: 500 condensed 32px / 44px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control:not(.font-face-body-1, .font-face-body-1-bold, .font-face-body-1-code, .font-face-body-1-link, .font-face-body-2, .font-face-body-2-bold, .font-face-body-2-code, .font-face-body-2-link, .font-face-button, .font-face-button-dense, .font-face-button-enlarge, .font-face-caption, .font-face-caption-bold, .font-face-caption-code, .font-face-caption-link, .font-face-headline-1, .font-face-headline-2, .font-face-subtitle-1, .font-face-subtitle-2, .font-face-title-1, .font-face-title-2) {\n font: 400 ultra-condensed 16px / 24px SpeziaWebVariable;\n letter-spacing: 0px;\n text-decoration: none;\n text-transform: none;\n}\n.control.connotation-primary {\n --connotation: var(--vvd-color-primary);\n --on-connotation: var(--vvd-color-on-primary);\n}\n\n.control.connotation-cta {\n --connotation: var(--vvd-color-cta);\n --on-connotation: var(--vvd-color-on-cta);\n}\n\n.control.connotation-success {\n --connotation: var(--vvd-color-success);\n --on-connotation: var(--vvd-color-on-success);\n}\n\n.control.connotation-alert {\n --connotation: var(--vvd-color-alert);\n --on-connotation: var(--vvd-color-on-alert);\n}\n\n.control.connotation-announcement {\n --connotation: var(--vvd-color-announcement);\n --on-connotation: var(--vvd-color-on-announcement);\n}\n\n.control.connotation-info {\n --connotation: var(--vvd-color-info);\n --on-connotation: var(--vvd-color-on-info);\n}\n\n.control.font-face-headline-1, .control.font-face-headline-2 {\n --font-face-margin: 2.5rem 0;\n}\n.control.font-face-title-1, .control.font-face-title-2 {\n --font-face-margin: 2rem 0;\n}\n.control.font-face-subtitle-1, .control.font-face-subtitle-2 {\n --font-face-margin: 1.5rem 0;\n}\n.control:not(.font-face-body-1, .font-face-body-1-bold, .font-face-body-1-code, .font-face-body-1-link, .font-face-body-2, .font-face-body-2-bold, .font-face-body-2-code, .font-face-body-2-link, .font-face-button, .font-face-button-dense, .font-face-button-enlarge, .font-face-caption, .font-face-caption-bold, .font-face-caption-code, .font-face-caption-link, .font-face-headline-1, .font-face-headline-2, .font-face-subtitle-1, .font-face-subtitle-2, .font-face-title-1, .font-face-title-2), .control.font-face-body-1, .control.font-face-body-1-bold, .control.font-face-body-1-code, .control.font-face-body-1-link, .control.font-face-body-2, .control.font-face-body-2-bold, .control.font-face-body-2-code, .control.font-face-body-2-link {\n --font-face-margin: 1rem 0;\n}\n\n::slotted(:where(h1, h2, h3, h4, h5, h6, p)) {\n margin: initial;\n}\n\n::slotted(*) {\n color: inherit;\n font: inherit;\n}";
|
|
7
|
-
styleInject(css_248z);
|
|
8
|
-
|
|
9
|
-
class Text extends FoundationElement {
|
|
10
|
-
constructor() {
|
|
11
|
-
super(...arguments);
|
|
12
|
-
this.tight = false;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
__decorate([attr, __metadata("design:type", String)], Text.prototype, "connotation", void 0);
|
|
18
|
-
|
|
19
|
-
__decorate([attr({
|
|
20
|
-
attribute: 'font-face'
|
|
21
|
-
}), __metadata("design:type", String)], Text.prototype, "fontFace", void 0);
|
|
22
|
-
|
|
23
|
-
__decorate([attr({
|
|
24
|
-
mode: 'boolean'
|
|
25
|
-
}), __metadata("design:type", Object)], Text.prototype, "tight", void 0);
|
|
26
|
-
|
|
27
|
-
let _ = t => t,
|
|
28
|
-
_t;
|
|
29
|
-
|
|
30
|
-
const getClasses = ({
|
|
31
|
-
connotation,
|
|
32
|
-
fontFace,
|
|
33
|
-
tight
|
|
34
|
-
}) => classNames('control', [`connotation-${connotation}`, Boolean(connotation)], [`font-face-${fontFace}`, Boolean(fontFace)], ['tight', tight]);
|
|
35
|
-
|
|
36
|
-
const TextTemplate = () => html(_t || (_t = _`<slot class="${0}"></slot>`), getClasses);
|
|
37
|
-
|
|
38
|
-
const vividText = Text.compose({
|
|
39
|
-
baseName: 'text',
|
|
40
|
-
template: TextTemplate,
|
|
41
|
-
styles: css_248z
|
|
42
|
-
});
|
|
43
|
-
designSystem.register(vividText());
|
|
44
|
-
|
|
45
|
-
export { vividText };
|
package/text-anchor/index.js
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { d as designSystem } from '../shared/index.js';
|
|
2
|
-
import { T as TextAnchor } from '../shared/text-anchor.js';
|
|
3
|
-
import { t as textAnchorTemplate } from '../shared/text-anchor.template.js';
|
|
4
|
-
import '../shared/web.dom-collections.iterator.js';
|
|
5
|
-
import '../shared/affix.js';
|
|
6
|
-
import '../shared/icon.js';
|
|
7
|
-
import '../shared/_has.js';
|
|
8
|
-
import '../shared/anchor.js';
|
|
9
|
-
import '../shared/apply-mixins.js';
|
|
10
|
-
import '../shared/aria-global.js';
|
|
11
|
-
import '../shared/class-names.js';
|
|
12
|
-
|
|
13
|
-
const vividTextAnchor = TextAnchor.compose({
|
|
14
|
-
baseName: 'text-anchor',
|
|
15
|
-
template: textAnchorTemplate
|
|
16
|
-
});
|
|
17
|
-
designSystem.register(vividTextAnchor());
|
|
18
|
-
|
|
19
|
-
export { vividTextAnchor };
|