superdesk-ui-framework 3.0.0-beta.0 → 3.0.1-beta.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/app/img/spinner.svg +3 -0
- package/app/img/themes/theme-base.svg +1 -0
- package/app/img/themes/theme-contrast.svg +45 -0
- package/app/img/themes/theme-dark.svg +1 -0
- package/app/img/themes/theme-light.svg +1 -0
- package/app/index.js +1 -1
- package/app/scripts/modals.js +22 -9
- package/app/styles/_accessibility.scss +311 -4
- package/app/styles/_alerts.scss +57 -19
- package/app/styles/_avatar.scss +25 -1
- package/app/styles/_badge.scss +2 -2
- package/app/styles/_big-icon-font.scss +1 -1
- package/app/styles/_boxed-list.scss +38 -18
- package/app/styles/_buttons.scss +431 -332
- package/app/styles/_carousel.scss +17 -11
- package/app/styles/_design-tokens.scss +2 -0
- package/app/styles/_helpers.scss +186 -30
- package/app/styles/_icon-font.scss +1 -1
- package/app/styles/_labels.scss +12 -6
- package/app/styles/_loaders.scss +13 -0
- package/app/styles/_master-desk.scss +5 -5
- package/app/styles/_mixins.scss +13 -3
- package/app/styles/_modals.scss +4 -28
- package/app/styles/_normalize.scss +1 -0
- package/app/styles/_panel-info.scss +19 -14
- package/app/styles/_sd-tag-input.scss +104 -3
- package/app/styles/_simple-list.scss +39 -17
- package/app/styles/_spinner.scss +46 -0
- package/app/styles/_tabs.scss +6 -8
- package/app/styles/_tag-labels.scss +11 -2
- package/app/styles/_thumb-carousel.scss +11 -10
- package/app/styles/_toggle-box.scss +46 -12
- package/app/styles/_toggle-button.scss +42 -0
- package/app/styles/_tooltips.scss +3 -3
- package/app/styles/_variables.scss +0 -1
- package/app/styles/app.scss +9 -2
- package/app/styles/components/_card-item.scss +33 -21
- package/app/styles/components/_list-item.scss +9 -4
- package/app/styles/components/_sd-dropzone.scss +78 -0
- package/app/styles/components/_sd-grid-item.scss +2 -2
- package/app/styles/components/_sd-searchbar.scss +5 -98
- package/app/styles/components/_subnav.scss +83 -61
- package/app/styles/components/_theme-selector.scss +189 -0
- package/app/styles/design-tokens/_design-tokens-general.scss +77 -0
- package/app/styles/{variables → design-tokens}/_new-colors.scss +34 -20
- package/app/styles/dropdowns/_basic-dropdown.scss +30 -3
- package/app/styles/editor/_editor-buttons.scss +54 -0
- package/app/styles/{_editor-themes.scss → editor/_editor-themes.scss} +0 -0
- package/app/styles/form-elements/_checkbox.scss +85 -58
- package/app/styles/form-elements/_forms-general.scss +90 -14
- package/app/styles/form-elements/_inputs.scss +22 -3
- package/app/styles/form-elements/_select-grid.scss +79 -0
- package/app/styles/grids/_basic-grid.scss +52 -26
- package/app/styles/grids/_grid-layout.scss +35 -21
- package/app/styles/grids/_layout-grid.scss +4 -4
- package/app/styles/grids/_sd-kanban-list.scss +2 -2
- package/app/styles/interface-elements/_side-panel.scss +87 -58
- package/app/styles/layout/_basic-layout.scss +1 -4
- package/app/styles/layout/_container.scss +32 -0
- package/app/styles/layout/_editor.scss +306 -0
- package/app/styles/menus/_sd-left-navigation.scss +14 -2
- package/app/styles/menus/_sd-sidebar-menu.scss +102 -9
- package/app/styles/pr-superdesk-theme.scss +3 -0
- package/app/styles/primereact/_pr-datepicker.scss +58 -7
- package/app/styles/primereact/_pr-dropdown.scss +157 -8
- package/app/styles/primereact/_pr-general.scss +4 -0
- package/app/styles/primereact/_pr-skeleton.scss +35 -0
- package/app/styles/variables/_colors.scss +2 -452
- package/app/styles/variables/_dimensions.scss +85 -1
- package/app/styles/variables/_form-elements.scss +0 -2
- package/app-typescript/components/Alert.tsx +16 -1
- package/app-typescript/components/Avatar.tsx +21 -0
- package/app-typescript/components/Button.tsx +7 -1
- package/app-typescript/components/ButtonGroup.tsx +5 -4
- package/app-typescript/components/Carousel.tsx +1 -1
- package/app-typescript/components/CheckButtonGroup.tsx +19 -5
- package/app-typescript/components/CheckGroup.tsx +2 -1
- package/app-typescript/components/Checkbox.tsx +7 -3
- package/app-typescript/components/CheckboxButton.tsx +9 -2
- package/app-typescript/components/DatePicker.tsx +6 -2
- package/app-typescript/components/DropZone.tsx +89 -0
- package/app-typescript/components/Dropdown.tsx +9 -1
- package/app-typescript/components/Editor/EditorButton.tsx +34 -0
- package/app-typescript/components/Form/FormGroup.tsx +33 -0
- package/app-typescript/components/Form/FormItem.tsx +20 -0
- package/app-typescript/components/Form/FormLabel.tsx +22 -0
- package/app-typescript/components/Form/FormRow.tsx +40 -0
- package/app-typescript/components/Form/FormText.tsx +15 -0
- package/app-typescript/components/Form/index.tsx +5 -0
- package/app-typescript/components/IconButton.tsx +26 -12
- package/app-typescript/components/IconPicker.tsx +277 -0
- package/app-typescript/components/Input.tsx +41 -8
- package/app-typescript/components/Layouts/AuthorinInnerSideBar.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrame.tsx +72 -0
- package/app-typescript/components/Layouts/AuthoringFrameContainer.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrameLeftBar.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrameMain.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrameNavBar.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrameOverlay.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrameRightBar.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringFrameSidePanel.tsx +22 -0
- package/app-typescript/components/Layouts/AuthoringFrameSidePanelOverlay.tsx +22 -0
- package/app-typescript/components/Layouts/AuthoringInnerBody.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringInnerHeader.tsx +38 -0
- package/app-typescript/components/Layouts/AuthoringMain.tsx +46 -0
- package/app-typescript/components/Layouts/AuthoringMainContainer.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringMainContent.tsx +15 -0
- package/app-typescript/components/Layouts/AuthoringMainToolBar.tsx +15 -0
- package/app-typescript/components/Layouts/Container.tsx +30 -0
- package/app-typescript/components/Layouts/HeaderPanel.tsx +15 -0
- package/app-typescript/components/Layouts/LayoutContainer.tsx +18 -0
- package/app-typescript/components/Layouts/LeftPanel.tsx +24 -0
- package/app-typescript/components/Layouts/MainPanel.tsx +22 -0
- package/app-typescript/components/Layouts/PageLayout.tsx +51 -0
- package/app-typescript/components/Layouts/Panel.tsx +207 -0
- package/app-typescript/components/Layouts/RightPanel.tsx +16 -0
- package/app-typescript/components/Layouts/index.tsx +25 -0
- package/app-typescript/components/LeftMenu.tsx +123 -49
- package/app-typescript/components/ListItemLoader.tsx +30 -0
- package/app-typescript/components/Lists/BoxedList.tsx +133 -0
- package/app-typescript/components/Lists/SimpleList.tsx +54 -0
- package/app-typescript/components/Lists/index.tsx +2 -0
- package/app-typescript/components/Modal.tsx +1 -1
- package/app-typescript/components/MultiSelect.tsx +69 -0
- package/app-typescript/components/Navigation/QuickNavBar.tsx +114 -0
- package/app-typescript/components/Navigation/SideBarMenu.tsx +68 -0
- package/app-typescript/components/Navigation/SideBarTabs.tsx +77 -0
- package/app-typescript/components/Navigation/index.tsx +3 -0
- package/app-typescript/components/RadioButtonGroup.tsx +113 -0
- package/app-typescript/components/RadioGroup.tsx +69 -0
- package/app-typescript/components/Select.tsx +12 -4
- package/app-typescript/components/SelectGrid.tsx +233 -0
- package/app-typescript/components/Skeleton.tsx +48 -0
- package/app-typescript/components/SlidingToolbar.tsx +8 -2
- package/app-typescript/components/Spinner.tsx +32 -0
- package/app-typescript/components/SubNav.tsx +25 -4
- package/app-typescript/components/Switch.tsx +34 -12
- package/app-typescript/components/Tag.tsx +31 -7
- package/app-typescript/components/Text/Heading.tsx +67 -0
- package/app-typescript/components/Text/Text.tsx +36 -0
- package/app-typescript/components/ThemeSelector.tsx +113 -0
- package/app-typescript/components/Togglebox.tsx +8 -6
- package/app-typescript/components/TreeSelect.tsx +330 -0
- package/app-typescript/index.ts +19 -3
- package/dist/avatar-2.jpg +0 -0
- package/dist/avatar-3.jpg +0 -0
- package/dist/avatar-4.jpg +0 -0
- package/dist/avatar-5.jpg +0 -0
- package/dist/avatar-6.jpg +0 -0
- package/dist/components/basic-grid.html +1 -1
- package/dist/components/checkbox.html +1 -1
- package/dist/components/modals.html +1 -0
- package/dist/examples.bundle.css +99 -1225
- package/dist/examples.bundle.js +24704 -15626
- package/dist/playgrounds/boxed-list.html +1 -1
- package/dist/playgrounds/cards.html +9 -4
- package/dist/playgrounds/editor-3-test.html +15 -0
- package/dist/playgrounds/form-layout.html +9 -7
- package/dist/playgrounds/master-desk.html +1 -3
- package/dist/playgrounds/react-playgrounds/EditorTest.tsx +454 -0
- package/dist/playgrounds/react-playgrounds/FirstPlayground.tsx +4 -4
- package/dist/playgrounds/react-playgrounds/Index.tsx +4 -1
- package/dist/playgrounds/react-playgrounds/PageLayoutTest.tsx +161 -0
- package/dist/playgrounds/react-playgrounds/PersonalProfile.tsx +622 -0
- package/dist/playgrounds/react-playgrounds/SamsPlayground.tsx +10 -10
- package/dist/playgrounds/react-playgrounds/TestGround.tsx +232 -23
- package/dist/playgrounds/react-playgrounds/UiPlayground.tsx +8 -79
- package/dist/react/Alerts.tsx +91 -18
- package/dist/react/Avatar.tsx +314 -127
- package/dist/react/BoxedList.tsx +362 -0
- package/dist/react/ButtonGroups.tsx +66 -65
- package/dist/react/Buttons.tsx +65 -113
- package/dist/react/Carousel.tsx +2 -3
- package/dist/react/Checkboxs.tsx +66 -25
- package/dist/react/Container.tsx +143 -0
- package/dist/react/DropZone.tsx +103 -0
- package/dist/react/Heading.tsx +106 -0
- package/dist/react/IconButtons.tsx +51 -21
- package/dist/react/IconFont.tsx +7 -6
- package/dist/react/IconPicker.tsx +65 -0
- package/dist/react/Index.tsx +100 -19
- package/dist/react/Inputs.tsx +9 -3
- package/dist/react/LeftNavigations.tsx +161 -9
- package/dist/react/ListItems.tsx +34 -0
- package/dist/react/Modal.tsx +7 -7
- package/dist/react/MultiSelect.tsx +193 -0
- package/dist/react/NavButtons.tsx +4 -4
- package/dist/react/Panel.tsx +366 -0
- package/dist/react/QuickNavigationBar.tsx +142 -0
- package/dist/react/RadioGroup.tsx +351 -0
- package/dist/react/SelectGrid.tsx +121 -0
- package/dist/react/Selects.tsx +2 -0
- package/dist/react/SimpleList.tsx +148 -0
- package/dist/react/SubNav.tsx +65 -18
- package/dist/react/Tags.tsx +57 -5
- package/dist/react/Text.tsx +134 -0
- package/dist/react/TreeSelect.tsx +178 -0
- package/dist/react.html +4 -0
- package/dist/superdesk-ui.bundle.css +26706 -20044
- package/dist/superdesk-ui.bundle.js +8456 -3426
- package/dist/vendor.bundle.js +13677 -13655
- package/examples/css/docs-page.css +98 -27
- package/examples/img/avatar-2.jpg +0 -0
- package/examples/img/avatar-3.jpg +0 -0
- package/examples/img/avatar-4.jpg +0 -0
- package/examples/img/avatar-5.jpg +0 -0
- package/examples/img/avatar-6.jpg +0 -0
- package/examples/index.js +16 -0
- package/examples/pages/components/basic-grid.html +1 -1
- package/examples/pages/components/checkbox.html +1 -1
- package/examples/pages/components/modals.html +1 -0
- package/examples/pages/playgrounds/boxed-list.html +1 -1
- package/examples/pages/playgrounds/cards.html +9 -4
- package/examples/pages/playgrounds/editor-3-test.html +15 -0
- package/examples/pages/playgrounds/form-layout.html +9 -7
- package/examples/pages/playgrounds/master-desk.html +1 -3
- package/examples/pages/playgrounds/react-playgrounds/EditorTest.tsx +454 -0
- package/examples/pages/playgrounds/react-playgrounds/FirstPlayground.tsx +4 -4
- package/examples/pages/playgrounds/react-playgrounds/Index.tsx +4 -1
- package/examples/pages/playgrounds/react-playgrounds/PageLayoutTest.tsx +161 -0
- package/examples/pages/playgrounds/react-playgrounds/PersonalProfile.tsx +622 -0
- package/examples/pages/playgrounds/react-playgrounds/SamsPlayground.tsx +10 -10
- package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +232 -23
- package/examples/pages/playgrounds/react-playgrounds/UiPlayground.tsx +8 -79
- package/examples/pages/react/Alerts.tsx +91 -18
- package/examples/pages/react/Avatar.tsx +314 -127
- package/examples/pages/react/BoxedList.tsx +362 -0
- package/examples/pages/react/ButtonGroups.tsx +66 -65
- package/examples/pages/react/Buttons.tsx +65 -113
- package/examples/pages/react/Carousel.tsx +2 -3
- package/examples/pages/react/Checkboxs.tsx +66 -25
- package/examples/pages/react/Container.tsx +143 -0
- package/examples/pages/react/DropZone.tsx +103 -0
- package/examples/pages/react/Heading.tsx +106 -0
- package/examples/pages/react/IconButtons.tsx +51 -21
- package/examples/pages/react/IconFont.tsx +7 -6
- package/examples/pages/react/IconPicker.tsx +65 -0
- package/examples/pages/react/Index.tsx +100 -19
- package/examples/pages/react/Inputs.tsx +9 -3
- package/examples/pages/react/LeftNavigations.tsx +161 -9
- package/examples/pages/react/ListItems.tsx +34 -0
- package/examples/pages/react/Modal.tsx +7 -7
- package/examples/pages/react/MultiSelect.tsx +193 -0
- package/examples/pages/react/NavButtons.tsx +4 -4
- package/examples/pages/react/Panel.tsx +366 -0
- package/examples/pages/react/QuickNavigationBar.tsx +142 -0
- package/examples/pages/react/RadioGroup.tsx +351 -0
- package/examples/pages/react/SelectGrid.tsx +121 -0
- package/examples/pages/react/Selects.tsx +2 -0
- package/examples/pages/react/SimpleList.tsx +148 -0
- package/examples/pages/react/SubNav.tsx +65 -18
- package/examples/pages/react/Tags.tsx +57 -5
- package/examples/pages/react/Text.tsx +134 -0
- package/examples/pages/react/TreeSelect.tsx +178 -0
- package/examples/pages/react.html +4 -0
- package/package.json +9 -5
- package/react/components/Alert.d.ts +3 -0
- package/react/components/Alert.js +9 -1
- package/react/components/Avatar.d.ts +9 -0
- package/react/components/Avatar.js +19 -1
- package/react/components/Button.d.ts +2 -0
- package/react/components/Button.js +4 -2
- package/react/components/ButtonGroup.d.ts +3 -2
- package/react/components/ButtonGroup.js +2 -2
- package/react/components/Carousel.js +1 -1
- package/react/components/CheckButtonGroup.d.ts +3 -1
- package/react/components/CheckButtonGroup.js +8 -2
- package/react/components/CheckGroup.d.ts +1 -0
- package/react/components/CheckGroup.js +1 -1
- package/react/components/Checkbox.d.ts +2 -1
- package/react/components/Checkbox.js +2 -2
- package/react/components/CheckboxButton.d.ts +1 -0
- package/react/components/CheckboxButton.js +2 -2
- package/react/components/DatePicker.js +7 -2
- package/react/components/DropZone.d.ts +25 -0
- package/react/components/DropZone.js +93 -0
- package/react/components/Dropdown.d.ts +1 -0
- package/react/components/Dropdown.js +3 -3
- package/react/components/Form/FormGroup.d.ts +13 -0
- package/react/components/Form/FormGroup.js +61 -0
- package/react/components/Form/FormItem.d.ts +9 -0
- package/react/components/Form/FormItem.js +54 -0
- package/react/components/Form/FormLabel.d.ts +10 -0
- package/react/components/Form/FormLabel.js +54 -0
- package/react/components/Form/FormRow.d.ts +17 -0
- package/react/components/Form/FormRow.js +62 -0
- package/react/components/Form/FormText.d.ts +8 -0
- package/react/components/Form/FormText.js +47 -0
- package/react/components/Form/index.d.ts +5 -0
- package/react/components/Form/index.js +12 -0
- package/react/components/IconButton.d.ts +9 -2
- package/react/components/IconButton.js +13 -5
- package/react/components/IconPicker.d.ts +24 -0
- package/react/components/IconPicker.js +283 -0
- package/react/components/Input.d.ts +20 -3
- package/react/components/Input.js +12 -3
- package/react/components/Layouts/AuthorinInnerSideBar.d.ts +8 -0
- package/react/components/Layouts/AuthorinInnerSideBar.js +47 -0
- package/react/components/Layouts/AuthoringFrame.d.ts +18 -0
- package/react/components/Layouts/AuthoringFrame.js +56 -0
- package/react/components/Layouts/AuthoringFrameContainer.d.ts +8 -0
- package/react/components/Layouts/AuthoringFrameContainer.js +47 -0
- package/react/components/Layouts/AuthoringFrameLeftBar.d.ts +8 -0
- package/react/components/Layouts/AuthoringFrameLeftBar.js +47 -0
- package/react/components/Layouts/AuthoringFrameMain.d.ts +8 -0
- package/react/components/Layouts/AuthoringFrameMain.js +47 -0
- package/react/components/Layouts/AuthoringFrameNavBar.d.ts +8 -0
- package/react/components/Layouts/AuthoringFrameNavBar.js +47 -0
- package/react/components/Layouts/AuthoringFrameOverlay.d.ts +8 -0
- package/react/components/Layouts/AuthoringFrameOverlay.js +47 -0
- package/react/components/Layouts/AuthoringFrameRightBar.d.ts +8 -0
- package/react/components/Layouts/AuthoringFrameRightBar.js +47 -0
- package/react/components/Layouts/AuthoringFrameSidePanel.d.ts +10 -0
- package/react/components/Layouts/AuthoringFrameSidePanel.js +56 -0
- package/react/components/Layouts/AuthoringFrameSidePanelOverlay.d.ts +9 -0
- package/react/components/Layouts/AuthoringFrameSidePanelOverlay.js +56 -0
- package/react/components/Layouts/AuthoringInnerBody.d.ts +8 -0
- package/react/components/Layouts/AuthoringInnerBody.js +47 -0
- package/react/components/Layouts/AuthoringInnerHeader.d.ts +13 -0
- package/react/components/{RadioButton.js → Layouts/AuthoringInnerHeader.js} +20 -22
- package/react/components/Layouts/AuthoringMain.d.ts +12 -0
- package/react/components/Layouts/AuthoringMain.js +53 -0
- package/react/components/Layouts/AuthoringMainContainer.d.ts +8 -0
- package/react/components/Layouts/AuthoringMainContainer.js +47 -0
- package/react/components/Layouts/AuthoringMainContent.d.ts +8 -0
- package/react/components/Layouts/AuthoringMainContent.js +47 -0
- package/react/components/Layouts/AuthoringMainToolBar.d.ts +8 -0
- package/react/components/Layouts/AuthoringMainToolBar.js +47 -0
- package/react/components/Layouts/Container.d.ts +14 -0
- package/react/components/Layouts/Container.js +60 -0
- package/react/components/Layouts/HeaderPanel.d.ts +8 -0
- package/react/components/Layouts/HeaderPanel.js +47 -0
- package/react/components/Layouts/LayoutContainer.d.ts +8 -0
- package/react/components/Layouts/LayoutContainer.js +47 -0
- package/react/components/Layouts/LeftPanel.d.ts +9 -0
- package/react/components/Layouts/LeftPanel.js +54 -0
- package/react/components/Layouts/MainPanel.d.ts +10 -0
- package/react/components/Layouts/MainPanel.js +50 -0
- package/react/components/Layouts/PageLayout.d.ts +16 -0
- package/react/components/Layouts/PageLayout.js +64 -0
- package/react/components/Layouts/Panel.d.ts +65 -0
- package/react/components/Layouts/Panel.js +166 -0
- package/react/components/Layouts/RightPanel.d.ts +9 -0
- package/react/components/Layouts/RightPanel.js +47 -0
- package/react/components/Layouts/index.d.ts +24 -0
- package/react/components/Layouts/index.js +55 -0
- package/react/components/LeftMenu.d.ts +8 -3
- package/react/components/LeftMenu.js +55 -16
- package/react/components/ListItemLoader.d.ts +4 -0
- package/react/components/ListItemLoader.js +62 -0
- package/react/components/Lists/BoxedList.d.ts +36 -0
- package/react/components/Lists/BoxedList.js +137 -0
- package/react/components/Lists/SimpleList.d.ts +21 -0
- package/react/components/Lists/SimpleList.js +78 -0
- package/react/components/Lists/index.d.ts +2 -0
- package/react/components/Lists/index.js +9 -0
- package/react/components/Modal.js +1 -1
- package/react/components/Navigation/QuickNavBar.d.ts +24 -0
- package/react/components/Navigation/QuickNavBar.js +113 -0
- package/react/components/Navigation/SideBarMenu.d.ts +21 -0
- package/react/components/Navigation/SideBarMenu.js +77 -0
- package/react/components/Navigation/SideBarTabs.d.ts +22 -0
- package/react/components/Navigation/SideBarTabs.js +82 -0
- package/react/components/Navigation/index.d.ts +3 -0
- package/react/components/Navigation/index.js +8 -0
- package/react/components/RadioButtonGroup.d.ts +29 -0
- package/react/components/RadioButtonGroup.js +89 -0
- package/react/components/{Radio.d.ts → RadioGroup.d.ts} +7 -3
- package/react/components/{Radio.js → RadioGroup.js} +15 -11
- package/react/components/Select.d.ts +3 -1
- package/react/components/Select.js +5 -3
- package/react/components/SelectGrid.d.ts +45 -0
- package/react/components/SelectGrid.js +179 -0
- package/react/components/Skeleton.d.ts +30 -0
- package/react/components/Skeleton.js +55 -0
- package/react/components/SlidingToolbar.d.ts +1 -1
- package/react/components/SlidingToolbar.js +11 -1
- package/react/components/Spinner.d.ts +11 -0
- package/react/components/Spinner.js +69 -0
- package/react/components/SubNav.d.ts +8 -1
- package/react/components/SubNav.js +22 -4
- package/react/components/Switch.d.ts +4 -1
- package/react/components/Switch.js +19 -7
- package/react/components/TabCustom.d.ts +0 -1
- package/react/components/Tag.d.ts +3 -2
- package/react/components/Tag.js +16 -5
- package/react/components/TagInput.d.ts +0 -1
- package/react/components/Text/Heading.d.ts +15 -0
- package/react/components/Text/Heading.js +77 -0
- package/react/components/Text/Text.d.ts +15 -0
- package/react/components/Text/Text.js +65 -0
- package/react/components/{RadioButton.d.ts → ThemeSelector.d.ts} +4 -3
- package/react/components/ThemeSelector.js +112 -0
- package/react/components/Togglebox.d.ts +1 -0
- package/react/components/Togglebox.js +9 -2
- package/react/index.d.ts +17 -3
- package/react/index.js +40 -4
- package/app/styles/variables/_design-tokens-general.scss +0 -136
- package/app-typescript/components/Radio.tsx +0 -57
- package/app-typescript/components/RadioButton.tsx +0 -57
- package/dist/react/Radios.tsx +0 -391
- package/examples/pages/react/Radios.tsx +0 -391
package/dist/examples.bundle.css
CHANGED
@@ -321,15 +321,17 @@ table {
|
|
321
321
|
border-collapse: collapse;
|
322
322
|
border-spacing: 0;
|
323
323
|
}:root {
|
324
|
-
color: hsla(214, 13%,
|
324
|
+
color: hsla(214, 13%, 20%, 1);
|
325
325
|
--docs-page-color-bg-default: hsl(0, 0%, 97%);
|
326
326
|
--docs-page-color-bg-00: hsla(214, 13%, 96%, 1);
|
327
327
|
--docs-page-color-bg-10: hsla(0, 0%, 100%, 1);
|
328
328
|
--docs-page-color-bg__window-bar: hsl(0, 0%, 92%);
|
329
|
+
--docs-page-color-bg__aside: hsla(214, 13%, 92%, 1);
|
330
|
+
--docs-page-color-bg__header: hsl(216, 45%, 24%);
|
329
331
|
|
330
332
|
--docs-page-color-bg__content-row--white: hsla(0, 0%, 100%, 1);
|
331
333
|
--docs-page-color-bg__content-row--grey: hsla(0, 0%, 95%, 1);
|
332
|
-
--docs-page-color-bg__example-box: hsla(
|
334
|
+
--docs-page-color-bg__example-box: hsla(214, 13%, 94%, 1);
|
333
335
|
--docs-page-color-bg__graphic-btn: hsla(0, 0%, 100%, 1);
|
334
336
|
--docs-page-color-bg__graphic-btn-graphic: linear-gradient(180deg, hsla(165, 57%, 95%, 1) 4%, hsla(191, 53%, 86%, 1) 96%);
|
335
337
|
|
@@ -344,12 +346,14 @@ table {
|
|
344
346
|
--docs-page-color-bg-00: hsla(214, 13%, 12%, 1);
|
345
347
|
--docs-page-color-bg-10: hsla(214, 13%, 12%, 1);
|
346
348
|
--docs-page-color-bg__window-bar: hsl(0, 0%, 8%);
|
349
|
+
--docs-page-color-bg__aside: hsla(214, 13%, 16%, 1);
|
350
|
+
--docs-page-color-bg__header: hsl(216, 40%, 18%);
|
347
351
|
|
348
352
|
--docs-page-color-bg__content-row--white: hsla(0, 0%, 8%, 1);
|
349
353
|
--docs-page-color-bg__content-row--grey: hsla(0, 0%, 12%, 1);
|
350
|
-
--docs-page-color-bg__example-box: hsla(
|
351
|
-
--docs-page-color-bg__graphic-btn: hsla(
|
352
|
-
--docs-page-color-bg__graphic-btn-graphic:
|
354
|
+
--docs-page-color-bg__example-box: hsla(214, 13%, 18%, 1);
|
355
|
+
--docs-page-color-bg__graphic-btn: hsla(214, 13%, 8%, 1);
|
356
|
+
--docs-page-color-bg__graphic-btn-graphic: hsla(214, 13%, 14%, 1);
|
353
357
|
|
354
358
|
--docs-page-border__window-bar--top: hsla(0, 0%, 91%, 0.02);
|
355
359
|
--docs-page-border__window-bar--bottom: hsla(0, 0%, 88%, 0.12);
|
@@ -525,10 +529,9 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
525
529
|
text-decoration: underline;
|
526
530
|
}
|
527
531
|
.docs-page__header {
|
528
|
-
background:
|
529
|
-
background: #22385a;
|
532
|
+
background: var(--docs-page-color-bg__header);
|
530
533
|
color: white;
|
531
|
-
padding: 0 24px;
|
534
|
+
padding: 0 8px 0 24px;
|
532
535
|
height: 64px;
|
533
536
|
grid-column: 1 / 3;
|
534
537
|
grid-row: 1 / 2;
|
@@ -537,6 +540,32 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
537
540
|
box-shadow: 0 1px 6px rgba(0,0,0,0.2), 0 1px 1px rgba(0,0,0,0.12);
|
538
541
|
z-index: 2;
|
539
542
|
}
|
543
|
+
.docs-page__header-button {
|
544
|
+
background: transparent;
|
545
|
+
color: white;
|
546
|
+
padding: 0;
|
547
|
+
height: 40px;
|
548
|
+
width: 40px;
|
549
|
+
border-radius: 999px;
|
550
|
+
margin-inline-start: 0px;
|
551
|
+
margin-inline-end: 8px;
|
552
|
+
display: flex;
|
553
|
+
align-items: center;
|
554
|
+
justify-content: center;
|
555
|
+
opacity: 0.8;
|
556
|
+
transition: all 0.2s ease;
|
557
|
+
}
|
558
|
+
.docs-page__header-button i {
|
559
|
+
color: white !important;
|
560
|
+
}
|
561
|
+
.docs-page__header-button:hover {
|
562
|
+
background: hsla(0, 0%, 0%, 0.2);
|
563
|
+
opacity: 1;
|
564
|
+
}
|
565
|
+
.docs-page__header-button:active {
|
566
|
+
background: var(--sd-colour-interactive);
|
567
|
+
opacity: 1;
|
568
|
+
}
|
540
569
|
.docs-page__header-logo {
|
541
570
|
height: 40px;
|
542
571
|
width: 40px;
|
@@ -545,7 +574,8 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
545
574
|
background-size: 100%;
|
546
575
|
}
|
547
576
|
.docs-page__header-nav {
|
548
|
-
margin-
|
577
|
+
margin-inline-start: auto;
|
578
|
+
margin-inline-end: 16px;
|
549
579
|
display: flex;
|
550
580
|
flex-direction: row;
|
551
581
|
align-items: stretch;
|
@@ -602,7 +632,7 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
602
632
|
grid-column: 1 / 2;
|
603
633
|
grid-row: 2 / 3;
|
604
634
|
width: 280px;
|
605
|
-
background-color:
|
635
|
+
background-color: var(--docs-page-color-bg__aside);
|
606
636
|
overflow-y: auto;
|
607
637
|
}
|
608
638
|
.docs-page__sidebar.scroll {
|
@@ -659,7 +689,7 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
659
689
|
}
|
660
690
|
.docs-page__nav-title {
|
661
691
|
text-transform: uppercase;
|
662
|
-
color:
|
692
|
+
color: var(--color-text);
|
663
693
|
font-size: 12px;
|
664
694
|
font-weight: 500;
|
665
695
|
letter-spacing: 0.1em;
|
@@ -775,7 +805,7 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
775
805
|
font-size: 16px;
|
776
806
|
line-height: 24px;
|
777
807
|
font-weight: 300;
|
778
|
-
color:
|
808
|
+
color: var(--color-text);
|
779
809
|
border-inline-start: 4px solid transparent;
|
780
810
|
}
|
781
811
|
.docs-page__nav-item a {
|
@@ -783,29 +813,29 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
783
813
|
line-height: 32px;
|
784
814
|
display: block;
|
785
815
|
padding-inline-start: 24px;
|
786
|
-
color:
|
816
|
+
color: var(--color-text-light);
|
787
817
|
background-color: rgba(255, 255, 255, 0);
|
788
818
|
cursor: pointer;
|
789
819
|
text-decoration: none;
|
790
820
|
transition: all ease-in-out 0.2s;
|
791
821
|
}
|
792
822
|
.docs-page__nav-item a:hover {
|
793
|
-
color:
|
794
|
-
background-color:
|
823
|
+
color: var(--color-text);
|
824
|
+
background-color: var(--docs-page-color-bg-00);
|
795
825
|
}
|
796
826
|
.docs-page__nav-item a:active {
|
797
|
-
color:
|
798
|
-
background-color:
|
827
|
+
color: var(--color-text-light);
|
828
|
+
background-color: var(--sd-colour-interactive--alpha-20);
|
799
829
|
}
|
800
830
|
|
801
831
|
.docs-page__nav-item.docs-page__nav-item--active {
|
802
|
-
border-color:
|
803
|
-
background-color:
|
832
|
+
border-color: var(--sd-colour-interactive);
|
833
|
+
background-color: var(--docs-page-color-bg-00);
|
804
834
|
font-weight: 400;
|
805
835
|
}
|
806
836
|
|
807
837
|
.docs-page__nav-item.docs-page__nav-item--active a {
|
808
|
-
color:
|
838
|
+
color: var(--sd-colour-interactive);
|
809
839
|
}
|
810
840
|
|
811
841
|
.docs-page__section {
|
@@ -894,7 +924,7 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
|
|
894
924
|
}
|
895
925
|
.docs-page__code-markup {
|
896
926
|
display: none;
|
897
|
-
background-color:
|
927
|
+
background-color: hsl(214, 13%, 10%);
|
898
928
|
padding: 16px 16px 16px 36px;
|
899
929
|
overflow-y: scroll;
|
900
930
|
}
|
@@ -912,11 +942,14 @@ pre.prettyprint {
|
|
912
942
|
|
913
943
|
.docs-page__paragraph code {
|
914
944
|
font-size: 85%;
|
915
|
-
padding: 0
|
916
|
-
background-color:
|
945
|
+
padding: 0 0.4em;
|
946
|
+
background-color: var(--sd-colour-interactive--alpha-20);
|
917
947
|
border-radius: 3px;
|
918
948
|
font-family: 'Source Code Pro', monospace;
|
919
949
|
font-weight: 400;
|
950
|
+
line-height: inherit;
|
951
|
+
vertical-align: baseline;
|
952
|
+
color: var(--color-text);
|
920
953
|
}
|
921
954
|
|
922
955
|
.docs-page__unordered-list {
|
@@ -968,6 +1001,7 @@ pre.prettyprint {
|
|
968
1001
|
max-width: 1200px;
|
969
1002
|
display: grid;
|
970
1003
|
grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
|
1004
|
+
transition: all 0.2s ease;
|
971
1005
|
}
|
972
1006
|
.docs-page__icon-font-list li {
|
973
1007
|
display: flex;
|
@@ -980,7 +1014,7 @@ pre.prettyprint {
|
|
980
1014
|
transition: all 0.2s ease-in-out;
|
981
1015
|
}
|
982
1016
|
.docs-page__icon-font-list li:hover {
|
983
|
-
box-shadow: 0 1px
|
1017
|
+
box-shadow: 0 0 0 1px var(--sd-shadow-outline), 0 1px 2px hsla(0, 0%, 0%, 0.12), 0 1px 6px hsla(0, 0%, 0%, 0.24);
|
984
1018
|
}
|
985
1019
|
|
986
1020
|
.docs-page__icon-font-list li i {
|
@@ -1137,6 +1171,13 @@ pre.prettyprint {
|
|
1137
1171
|
grid-row: 2/3;
|
1138
1172
|
grid-column: 2/3;
|
1139
1173
|
}
|
1174
|
+
|
1175
|
+
#scrollContainer {
|
1176
|
+
overflow: scroll;
|
1177
|
+
scroll-behavior: smooth;
|
1178
|
+
}
|
1179
|
+
|
1180
|
+
.
|
1140
1181
|
/* ---------------- COLOR SWATCHES ---------------- */
|
1141
1182
|
|
1142
1183
|
.doc-swatches__grid {
|
@@ -1202,7 +1243,7 @@ pre.prettyprint {
|
|
1202
1243
|
font-size: 15px;
|
1203
1244
|
font-weight: 300;
|
1204
1245
|
line-height: 150%;
|
1205
|
-
color:
|
1246
|
+
color: var(--color-text-light);
|
1206
1247
|
}
|
1207
1248
|
.docs-page__color--primary {
|
1208
1249
|
color: var(--docs-page-color-primary) !important;
|
@@ -1235,58 +1276,52 @@ doc-gif-img:hover img {
|
|
1235
1276
|
.docs-page__container table td {
|
1236
1277
|
border-color: var(--docs-page-border__table) !important;
|
1237
1278
|
}
|
1238
|
-
/* -------------- END COLOR SWATCHES -------------- */
|
1239
1279
|
|
1280
|
+
|
1281
|
+
/* -------------- END COLOR SWATCHES -------------- */
|
1240
1282
|
/* -------------- PrismJS overrides -------------- */
|
1283
|
+
|
1241
1284
|
code[class*="language-"],
|
1242
1285
|
pre[class*="language-"] {
|
1243
1286
|
font-family: 'Source Code Pro', Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
1244
1287
|
font-size: 1.1em;
|
1245
1288
|
border-radius: 0.4rem;
|
1246
1289
|
}
|
1290
|
+
pre[class*="language-"] {
|
1291
|
+
background: hsl(214, 13%, 8%);
|
1292
|
+
}
|
1247
1293
|
|
1248
1294
|
/*// extra large screen media query /100em = 1600px/*/
|
1249
1295
|
@media only screen and (min-width: 100em) {
|
1250
1296
|
.docs-page__section {
|
1251
1297
|
max-width: 80%;
|
1252
1298
|
}
|
1253
|
-
}
|
1254
|
-
|
1255
|
-
|
1256
|
-
|
1257
|
-
|
1258
|
-
|
1259
|
-
|
1260
|
-
|
1261
|
-
|
1262
|
-
|
1263
|
-
|
1264
|
-
|
1265
|
-
|
1266
|
-
|
1267
|
-
|
1268
|
-
|
1269
|
-
|
1270
|
-
|
1271
|
-
|
1272
|
-
|
1273
|
-
|
1274
|
-
|
1275
|
-
:
|
1276
|
-
|
1277
|
-
|
1278
|
-
|
1279
|
-
--sd-shadow__modal: 0 0 0 1px var(--sd-shadow-outline), 0 0 8px 2px hsla(0, 0%, 0%, 0.3);
|
1280
|
-
--sd-shadow__toast: 0 0 0 1px var(--sd-shadow-outline--2), 0 2px 4px hsla(0, 0%, 0%, 0.12), 0 8px 12px hsla(0, 0%, 0%, 0.16);
|
1281
|
-
--sd-shadow__sliding-toolbar: 0 2px 4px -1px hsla(0, 0%, 0%, 0.2), 0 1px 0 0 hsla(0, 0%, 0%, 0.1); }
|
1282
|
-
|
1283
|
-
[data-theme="dark-ui"], .dark-ui {
|
1284
|
-
--sd-shadow-outline: hsl(214, 13%, 60%, 0.1);
|
1285
|
-
--sd-shadow-outline--2: hsl(214, 13%, 60%, 0.1);
|
1286
|
-
--sd-shadow__dropdown: 0 0 0 1px var(--sd-shadow-outline), 0 2px 10px hsla(0, 0%, 0%, 0.6), 0 3px 1px -2px hsla(0, 0%, 0%, 0.2);
|
1287
|
-
--sd-shadow__modal: 0 0 0 1px var(--sd-shadow-outline), 0 0 8px 2px hsla(0, 0%, 0%, 0.4);
|
1288
|
-
--sd-shadow__toast: 0 0 0 1px var(--sd-shadow-outline--2), 0 2px 4px hsla(0, 0%, 0%, 0.24), 0 8px 12px hsla(0, 0%, 0%, 0.26); }
|
1289
|
-
|
1299
|
+
}
|
1300
|
+
|
1301
|
+
|
1302
|
+
/* -------------- DOC PAGE SPECIFIC OVERRIDES -------------- */
|
1303
|
+
|
1304
|
+
doc-react-playground {
|
1305
|
+
display: contents;
|
1306
|
+
}
|
1307
|
+
|
1308
|
+
.docs-page doc-react-playground .sd-main-content-grid {
|
1309
|
+
grid-column: 2 / 3;
|
1310
|
+
overflow: auto;
|
1311
|
+
}
|
1312
|
+
|
1313
|
+
.docs-page .sd-editor-grid {
|
1314
|
+
grid-row: 2 / 3;
|
1315
|
+
grid-column: 2 / 3;
|
1316
|
+
overflow-y: auto;
|
1317
|
+
}
|
1318
|
+
.docs-page doc-react-playground .sd-editor-grid {
|
1319
|
+
grid-row: 2 / 3;
|
1320
|
+
grid-column: 2 / 3;
|
1321
|
+
overflow-y: auto;
|
1322
|
+
}
|
1323
|
+
|
1324
|
+
/* ------------ END DOC PAGE SPECIFIC OVERRIDES ------------ */@charset "UTF-8";
|
1290
1325
|
.red--100 {
|
1291
1326
|
background-color: #fde4e2; }
|
1292
1327
|
|
@@ -3567,329 +3602,6 @@ pre[class*="language-"] {
|
|
3567
3602
|
.text-blue-grey--500 {
|
3568
3603
|
color: #607c8a; }
|
3569
3604
|
|
3570
|
-
.sd-top-menu .navbtn, .sd-top-menu .sd-navbtn, #top-menu .navbtn, #top-menu .sd-navbtn {
|
3571
|
-
--color-navbutton-border: hsla(214, 13%, 70%, 0.1) !important;
|
3572
|
-
--sd-colour-line--x-light: hsla(214, 13%, 70%, 0.1) !important; }
|
3573
|
-
|
3574
|
-
[data-theme="accessible-light-ui"] {
|
3575
|
-
--font-size-large: 1.5rem;
|
3576
|
-
--color-accessible-text: hsla(0, 0%, 7%, 1);
|
3577
|
-
--sd-slugline-color: hsla(241, 100%, 50%, 1);
|
3578
|
-
--color-input-bg: hsla(0, 0%, 0%, 0.05);
|
3579
|
-
--color-input-bg--hover: hsla(0, 0%, 0%, 0.08);
|
3580
|
-
--color-input-bg--focus: hsla(198, 49%, 58%, 0.14);
|
3581
|
-
--color-label-text: hsla(0, 0%, 25%, 1);
|
3582
|
-
--color-input-border: hsla(0, 0%, 0%, 0.35);
|
3583
|
-
--color-input-border-hover: hsla(0, 0%, 0%, 0.8);
|
3584
|
-
--color-form-bg: hsla(0, 0%, 100%, 0);
|
3585
|
-
--color-text: hsla(0, 0%, 0%, 1);
|
3586
|
-
--color-selected-bg: hsla(196, 35%, 94%, 1);
|
3587
|
-
--color-selected-bg--hover: hsl(198, 36%, 91%, 1);
|
3588
|
-
--color-bg-00: hsla(0, 0%, 100%, 1);
|
3589
|
-
--color-bg-50: hsla(0, 0%, 97%, 1);
|
3590
|
-
--color-bg-100: hsla(0, 0%, 93%, 1);
|
3591
|
-
--color-bg-150: hsla(0, 0%, 87%, 1);
|
3592
|
-
--color-bg-200: hsla(0, 0%, 63%, 1);
|
3593
|
-
--color-bg-800: hsla(0, 0%, 17%, 1);
|
3594
|
-
--color-accessible-primary: hsla(241, 100%, 50%, 1); }
|
3595
|
-
[data-theme="accessible-light-ui"] [class^="icon-"],
|
3596
|
-
[data-theme="accessible-light-ui"] [class*=" icon-"],
|
3597
|
-
[data-theme="accessible-light-ui"] [class^="big-icon--"],
|
3598
|
-
[data-theme="accessible-light-ui"] [class*=" big-icon--"] {
|
3599
|
-
color: black; }
|
3600
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style {
|
3601
|
-
color: #121212; }
|
3602
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style.checked,
|
3603
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style[checked="checked"] {
|
3604
|
-
background-color: var(--color-accessible-primary);
|
3605
|
-
border-color: var(--color-accessible-primary);
|
3606
|
-
border-top-color: #020156;
|
3607
|
-
color: white; }
|
3608
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style.checked:hover,
|
3609
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style[checked="checked"]:hover {
|
3610
|
-
background-color: #030165;
|
3611
|
-
border-color: #030165;
|
3612
|
-
border-top-color: #010038; }
|
3613
|
-
[data-theme="accessible-light-ui"] .sd-create-btn .circle {
|
3614
|
-
background-color: var(--color-accessible-primary); }
|
3615
|
-
[data-theme="accessible-light-ui"] .navbtn.navbtn--active {
|
3616
|
-
background-color: #454545;
|
3617
|
-
color: #fff; }
|
3618
|
-
[data-theme="accessible-light-ui"] .btn {
|
3619
|
-
color: var(--color-accessible-text);
|
3620
|
-
font-weight: 600;
|
3621
|
-
font-size: 1.4rem; }
|
3622
|
-
[data-theme="accessible-light-ui"] .btn.btn--primary {
|
3623
|
-
background-color: var(--color-accessible-primary);
|
3624
|
-
color: #fff; }
|
3625
|
-
[data-theme="accessible-light-ui"] .btn.btn--hollow {
|
3626
|
-
background-color: #fff; }
|
3627
|
-
[data-theme="accessible-light-ui"] .sd-list-item {
|
3628
|
-
font-size: 1.5rem; }
|
3629
|
-
[data-theme="accessible-light-ui"] .sd-list-item .sd-list-item__slugline {
|
3630
|
-
font-size: 1.3rem; }
|
3631
|
-
[data-theme="accessible-light-ui"] .sd-list-item time {
|
3632
|
-
color: #474747;
|
3633
|
-
font-weight: 400; }
|
3634
|
-
[data-theme="accessible-light-ui"] .badge {
|
3635
|
-
font-size: 1.2rem;
|
3636
|
-
line-height: 1.1em;
|
3637
|
-
font-weight: 600; }
|
3638
|
-
[data-theme="accessible-light-ui"] .side-panel {
|
3639
|
-
background-color: #fff;
|
3640
|
-
color: var(--color-accessible-text); }
|
3641
|
-
[data-theme="accessible-light-ui"] .side-panel .side-panel__header {
|
3642
|
-
background-color: #fff; }
|
3643
|
-
[data-theme="accessible-light-ui"] .side-panel .side-panel__heading {
|
3644
|
-
font-weight: 500;
|
3645
|
-
color: var(--color-accessible-text); }
|
3646
|
-
[data-theme="accessible-light-ui"] .side-panel p {
|
3647
|
-
font-size: 1.6rem;
|
3648
|
-
line-height: 1.5;
|
3649
|
-
color: var(--color-accessible-text); }
|
3650
|
-
[data-theme="accessible-light-ui"] .side-panel .sd-text__date-and-author {
|
3651
|
-
font-size: 1.4rem; }
|
3652
|
-
[data-theme="accessible-light-ui"] .side-panel .sd-text__date-and-author time {
|
3653
|
-
font-weight: 400;
|
3654
|
-
color: #595959; }
|
3655
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui {
|
3656
|
-
background-color: var(--color-bg-800);
|
3657
|
-
color: #fff; }
|
3658
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui i[class^="icon-"] {
|
3659
|
-
color: #fff; }
|
3660
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .side-panel__header {
|
3661
|
-
background-color: var(--color-bg-800);
|
3662
|
-
color: #fff !important; }
|
3663
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .side-panel__header i[class^="icon-"] {
|
3664
|
-
color: #fff !important; }
|
3665
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__label {
|
3666
|
-
font-weight: 600;
|
3667
|
-
font-size: 1.2rem; }
|
3668
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__input,
|
3669
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__select {
|
3670
|
-
font-size: 1.5rem; }
|
3671
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__hint,
|
3672
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__message {
|
3673
|
-
font-size: 1.4rem;
|
3674
|
-
margin: 0.8rem 0; }
|
3675
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__hint {
|
3676
|
-
color: #454545; }
|
3677
|
-
[data-theme="accessible-light-ui"] .form-label {
|
3678
|
-
font-size: 1.2rem;
|
3679
|
-
font-weight: 500; }
|
3680
|
-
[data-theme="accessible-light-ui"] .form-label.form-label--light {
|
3681
|
-
color: #525252; }
|
3682
|
-
[data-theme="accessible-light-ui"] .navbtn {
|
3683
|
-
color: #111; }
|
3684
|
-
[data-theme="accessible-light-ui"] .navbtn [class^="icon-"], [data-theme="accessible-light-ui"] .navbtn [class*=" icon-"] {
|
3685
|
-
color: currentColor; }
|
3686
|
-
[data-theme="accessible-light-ui"] .dropdown__menu-label {
|
3687
|
-
font-size: 1.2rem;
|
3688
|
-
color: #595959; }
|
3689
|
-
[data-theme="accessible-light-ui"] .dropdown__toggle:active,
|
3690
|
-
[data-theme="accessible-light-ui"] .dropdown.open .dropdown__toggle {
|
3691
|
-
color: var(--color-accessible-primary); }
|
3692
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn),
|
3693
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button),
|
3694
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn),
|
3695
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button) {
|
3696
|
-
font-size: 1.5rem;
|
3697
|
-
font-weight: 500;
|
3698
|
-
color: currentColor; }
|
3699
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):hover,
|
3700
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):focus,
|
3701
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover,
|
3702
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus,
|
3703
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):hover,
|
3704
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):focus,
|
3705
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover,
|
3706
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus {
|
3707
|
-
background: var(--color-accessible-primary);
|
3708
|
-
color: #fff; }
|
3709
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):hover > i[class^="icon-"],
|
3710
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):focus > i[class^="icon-"],
|
3711
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover > i[class^="icon-"],
|
3712
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus > i[class^="icon-"],
|
3713
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):hover > i[class^="icon-"],
|
3714
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):focus > i[class^="icon-"],
|
3715
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover > i[class^="icon-"],
|
3716
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus > i[class^="icon-"] {
|
3717
|
-
color: #fff; }
|
3718
|
-
[data-theme="accessible-light-ui"] .dropdown.open .navbtn > i {
|
3719
|
-
color: var(--color-accessible-primary); }
|
3720
|
-
[data-theme="accessible-light-ui"] .sd-text__slugline,
|
3721
|
-
[data-theme="accessible-light-ui"] p.sd-text__slugline {
|
3722
|
-
color: var(--color-accessible-primary) !important; }
|
3723
|
-
[data-theme="accessible-light-ui"] .toggle-box--circle .toggle-box__chevron {
|
3724
|
-
background-color: rgba(122, 122, 122, 0.5);
|
3725
|
-
height: 2rem;
|
3726
|
-
width: 2rem; }
|
3727
|
-
[data-theme="accessible-light-ui"] .toggle-box__label {
|
3728
|
-
font-size: 1.4rem;
|
3729
|
-
color: var(--color-label-text);
|
3730
|
-
font-weight: 500; }
|
3731
|
-
[data-theme="accessible-light-ui"] .sd-grid-item time {
|
3732
|
-
color: #474747;
|
3733
|
-
font-size: 1.3rem;
|
3734
|
-
font-weight: 400; }
|
3735
|
-
[data-theme="accessible-light-ui"] .sd-grid-item .sd-grid-item__slugline {
|
3736
|
-
font-size: 1.2rem; }
|
3737
|
-
[data-theme="accessible-light-ui"] .nav-tabs .nav-tabs__link {
|
3738
|
-
font-size: 1.6rem;
|
3739
|
-
font-weight: 500; }
|
3740
|
-
[data-theme="accessible-light-ui"] .nav-tabs--big .nav-tabs__link {
|
3741
|
-
font-size: 2rem; }
|
3742
|
-
[data-theme="accessible-light-ui"] .nav-tabs__tab--active .nav-tabs__link,
|
3743
|
-
[data-theme="accessible-light-ui"] .nav-tabs__tab--active:hover .nav-tabs__link {
|
3744
|
-
border-bottom-color: var(--color-accessible-primary);
|
3745
|
-
color: var(--color-accessible-text); }
|
3746
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab .nav-tabs__link {
|
3747
|
-
border-bottom-color: transparent;
|
3748
|
-
color: #fff;
|
3749
|
-
opacity: 0.6; }
|
3750
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab:hover .nav-tabs__link {
|
3751
|
-
border-bottom-color: rgba(255, 255, 255, 0.25);
|
3752
|
-
opacity: 1; }
|
3753
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab.nav-tabs__tab--active .nav-tabs__link, [data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab.nav-tabs__tab--active:hover .nav-tabs__link {
|
3754
|
-
border-bottom-color: #4d4dff;
|
3755
|
-
color: #fff;
|
3756
|
-
opacity: 1; }
|
3757
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .toggle-box__label {
|
3758
|
-
color: #fff; }
|
3759
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .sd-line-input .sd-line-input__label {
|
3760
|
-
color: #fff;
|
3761
|
-
opacity: 0.7; }
|
3762
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui a.text-link.text-link--white {
|
3763
|
-
color: #fff;
|
3764
|
-
opacity: 0.75; }
|
3765
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui a.text-link.text-link--white:hover {
|
3766
|
-
opacity: 1; }
|
3767
|
-
[data-theme="accessible-light-ui"] .badge.badge--primary {
|
3768
|
-
background-color: var(--color-accessible-primary); }
|
3769
|
-
[data-theme="accessible-light-ui"] .badge.badge--success {
|
3770
|
-
background-color: #006115; }
|
3771
|
-
[data-theme="accessible-light-ui"] .badge.badge--warning {
|
3772
|
-
background-color: #854900; }
|
3773
|
-
[data-theme="accessible-light-ui"] .sd-sidebar-menu__btn--active,
|
3774
|
-
[data-theme="accessible-light-ui"] .sd-sidebar-menu__btn--active:hover {
|
3775
|
-
background-color: var(--color-accessible-primary); }
|
3776
|
-
|
3777
|
-
.test-div {
|
3778
|
-
height: 4rem;
|
3779
|
-
display: flex;
|
3780
|
-
flex-direction: row; }
|
3781
|
-
.test-div div {
|
3782
|
-
flex-grow: 1;
|
3783
|
-
height: 100%; }
|
3784
|
-
|
3785
|
-
.test-div--1 {
|
3786
|
-
background-color: var(--sd-colour-neutral); }
|
3787
|
-
|
3788
|
-
.test-div--2 {
|
3789
|
-
background-color: var(--sd-colour-neutral--hover); }
|
3790
|
-
|
3791
|
-
.test-div--3 {
|
3792
|
-
background-color: var(--sd-colour-neutral--active); }
|
3793
|
-
|
3794
|
-
.test-div--4 {
|
3795
|
-
background-color: var(--sd-colour-primary); }
|
3796
|
-
|
3797
|
-
.test-div--5 {
|
3798
|
-
background-color: var(--sd-colour-primary--hover); }
|
3799
|
-
|
3800
|
-
.test-div--6 {
|
3801
|
-
background-color: var(--sd-colour-primary--active); }
|
3802
|
-
|
3803
|
-
.test-div--7 {
|
3804
|
-
background-color: var(--sd-colour-success); }
|
3805
|
-
|
3806
|
-
.test-div--8 {
|
3807
|
-
background-color: var(--sd-colour-success--hover); }
|
3808
|
-
|
3809
|
-
.test-div--9 {
|
3810
|
-
background-color: var(--sd-colour-success--active); }
|
3811
|
-
|
3812
|
-
.test-div--10 {
|
3813
|
-
background-color: var(--sd-colour-alert); }
|
3814
|
-
|
3815
|
-
.test-div--11 {
|
3816
|
-
background-color: var(--sd-colour-alert--hover); }
|
3817
|
-
|
3818
|
-
.test-div--12 {
|
3819
|
-
background-color: var(--sd-colour-alert--active); }
|
3820
|
-
|
3821
|
-
.test-div--13 {
|
3822
|
-
background-color: var(--sd-colour-warning); }
|
3823
|
-
|
3824
|
-
.test-div--14 {
|
3825
|
-
background-color: var(--sd-colour-warning--hover); }
|
3826
|
-
|
3827
|
-
.test-div--15 {
|
3828
|
-
background-color: var(--sd-colour-warning--active); }
|
3829
|
-
|
3830
|
-
.test-div--16 {
|
3831
|
-
background-color: var(--sd-colour-highlight); }
|
3832
|
-
|
3833
|
-
.test-div--17 {
|
3834
|
-
background-color: var(--sd-colour-highlight--hover); }
|
3835
|
-
|
3836
|
-
.test-div--18 {
|
3837
|
-
background-color: var(--sd-colour-highlight--active); }
|
3838
|
-
|
3839
|
-
.test-div--19-1 {
|
3840
|
-
background-color: white; }
|
3841
|
-
|
3842
|
-
.test-div--19-2 {
|
3843
|
-
background-color: var(--sd-colour-bg--00); }
|
3844
|
-
|
3845
|
-
.test-div--20-1 {
|
3846
|
-
background-color: #f3f5f6; }
|
3847
|
-
|
3848
|
-
.test-div--20-2 {
|
3849
|
-
background-color: var(--sd-colour-bg--01); }
|
3850
|
-
|
3851
|
-
.test-div--21-1 {
|
3852
|
-
background-color: #e8eaed; }
|
3853
|
-
|
3854
|
-
.test-div--21-2 {
|
3855
|
-
background-color: var(--sd-colour-bg--02); }
|
3856
|
-
|
3857
|
-
.test-div--22-1 {
|
3858
|
-
background-color: #d4d8de; }
|
3859
|
-
|
3860
|
-
.test-div--22-2 {
|
3861
|
-
background-color: var(--sd-colour-bg--03); }
|
3862
|
-
|
3863
|
-
.test-div--23-1 {
|
3864
|
-
background-color: #c5cbd3; }
|
3865
|
-
|
3866
|
-
.test-div--23-2 {
|
3867
|
-
background-color: var(--sd-colour-bg--04); }
|
3868
|
-
|
3869
|
-
.test-div--24-1 {
|
3870
|
-
background-color: #b7bec8; }
|
3871
|
-
|
3872
|
-
.test-div--24-2 {
|
3873
|
-
background-color: var(--sd-colour-bg--05); }
|
3874
|
-
|
3875
|
-
.test-div--25-1 {
|
3876
|
-
background-color: #a9b1bc; }
|
3877
|
-
|
3878
|
-
.test-div--25-2 {
|
3879
|
-
background-color: var(--sd-colour-bg--06); }
|
3880
|
-
|
3881
|
-
.test-div--26-1 {
|
3882
|
-
background-color: #9aa4b1; }
|
3883
|
-
|
3884
|
-
.test-div--26-2 {
|
3885
|
-
background-color: var(--sd-colour-bg--07); }
|
3886
|
-
|
3887
|
-
.test-div--27-1 {
|
3888
|
-
background-color: #8c97a6; }
|
3889
|
-
|
3890
|
-
.test-div--27-2 {
|
3891
|
-
background-color: var(--sd-colour-bg--08); }
|
3892
|
-
|
3893
3605
|
@font-face {
|
3894
3606
|
font-family: 'sd_icons';
|
3895
3607
|
src: url(sd_icons.eot);
|
@@ -4532,7 +4244,7 @@ pre[class*="language-"] {
|
|
4532
4244
|
bottom: -0.7rem;
|
4533
4245
|
height: 1em;
|
4534
4246
|
width: 1em;
|
4535
|
-
background-color:
|
4247
|
+
background-color: var(--sd-item__main-Bg);
|
4536
4248
|
border-radius: var(--b-radius--full);
|
4537
4249
|
padding: 1px;
|
4538
4250
|
z-index: 1;
|
@@ -4590,521 +4302,6 @@ pre[class*="language-"] {
|
|
4590
4302
|
color: inherit;
|
4591
4303
|
opacity: 1; }
|
4592
4304
|
@charset "UTF-8";
|
4593
|
-
:root {
|
4594
|
-
--sd-colour-interactive-hs: 198, 50%;
|
4595
|
-
--sd-colour-interactive-l--05: var(--sd-colour-interactive-hs), 6%;
|
4596
|
-
--sd-colour-interactive-l--10: var(--sd-colour-interactive-hs), 10%;
|
4597
|
-
--sd-colour-interactive-l--20: var(--sd-colour-interactive-hs), 20%;
|
4598
|
-
--sd-colour-interactive-l--30: var(--sd-colour-interactive-hs), 30%;
|
4599
|
-
--sd-colour-interactive-l--40: var(--sd-colour-interactive-hs), 40%;
|
4600
|
-
--sd-colour-interactive-l--50: var(--sd-colour-interactive-hs), 50%;
|
4601
|
-
--sd-colour-interactive-l--60: var(--sd-colour-interactive-hs), 60%;
|
4602
|
-
--sd-colour-interactive-l--70: var(--sd-colour-interactive-hs), 70%;
|
4603
|
-
--sd-colour-interactive-l--80: var(--sd-colour-interactive-hs), 80%;
|
4604
|
-
--sd-colour-interactive-l--90: var(--sd-colour-interactive-hs), 90%;
|
4605
|
-
--sd-colour-interactive-l--95: var(--sd-colour-interactive-hs), 95%;
|
4606
|
-
--sd-colour-interactive-l--100: var(--sd-colour-interactive-hs), 100%;
|
4607
|
-
--sd-colour-secondary-hs: 185, 33%;
|
4608
|
-
--sd-colour-secondary-l--10: var(--sd-colour-secondary-hs), 10%;
|
4609
|
-
--sd-colour-secondary-l--20: var(--sd-colour-secondary-hs), 20%;
|
4610
|
-
--sd-colour-secondary-l--30: var(--sd-colour-secondary-hs), 30%;
|
4611
|
-
--sd-colour-secondary-l--40: var(--sd-colour-secondary-hs), 40%;
|
4612
|
-
--sd-colour-secondary-l--50: var(--sd-colour-secondary-hs), 50%;
|
4613
|
-
--sd-colour-secondary-l--60: var(--sd-colour-secondary-hs), 60%;
|
4614
|
-
--sd-colour-secondary-l--70: var(--sd-colour-secondary-hs), 70%;
|
4615
|
-
--sd-colour-secondary-l--80: var(--sd-colour-secondary-hs), 80%;
|
4616
|
-
--sd-colour-secondary-l--90: var(--sd-colour-secondary-hs), 90%;
|
4617
|
-
--sd-colour-secondary-l--100: var(--sd-colour-secondary-hs), 100%;
|
4618
|
-
--sd-colour-info-hs: 198, 50%;
|
4619
|
-
--sd-colour-info-l--10: var(--sd-colour-info-hs), 10%;
|
4620
|
-
--sd-colour-info-l--20: var(--sd-colour-info-hs), 20%;
|
4621
|
-
--sd-colour-info-l--30: var(--sd-colour-info-hs), 30%;
|
4622
|
-
--sd-colour-info-l--40: var(--sd-colour-info-hs), 40%;
|
4623
|
-
--sd-colour-info-l--50: var(--sd-colour-info-hs), 50%;
|
4624
|
-
--sd-colour-info-l--60: var(--sd-colour-info-hs), 60%;
|
4625
|
-
--sd-colour-info-l--70: var(--sd-colour-info-hs), 70%;
|
4626
|
-
--sd-colour-info-l--80: var(--sd-colour-info-hs), 80%;
|
4627
|
-
--sd-colour-info-l--90: var(--sd-colour-info-hs), 90%;
|
4628
|
-
--sd-colour-info-l--100: var(--sd-colour-info-hs), 100%;
|
4629
|
-
--sd-colour-primary-hs: 198, 50%;
|
4630
|
-
--sd-colour-primary-l--10: var(--sd-colour-primary-hs), 10%;
|
4631
|
-
--sd-colour-primary-l--20: var(--sd-colour-primary-hs), 20%;
|
4632
|
-
--sd-colour-primary-l--30: var(--sd-colour-primary-hs), 30%;
|
4633
|
-
--sd-colour-primary-l--40: var(--sd-colour-primary-hs), 40%;
|
4634
|
-
--sd-colour-primary-l--50: var(--sd-colour-primary-hs), 50%;
|
4635
|
-
--sd-colour-primary-l--60: var(--sd-colour-primary-hs), 60%;
|
4636
|
-
--sd-colour-primary-l--70: var(--sd-colour-primary-hs), 70%;
|
4637
|
-
--sd-colour-primary-l--80: var(--sd-colour-primary-hs), 80%;
|
4638
|
-
--sd-colour-primary-l--90: var(--sd-colour-primary-hs), 90%;
|
4639
|
-
--sd-colour-primary-l--100: var(--sd-colour-primary-hs), 100%;
|
4640
|
-
--sd-colour-success-hs: 120, 40%;
|
4641
|
-
--sd-colour-success-l--10: var(--sd-colour-success-hs), 10%;
|
4642
|
-
--sd-colour-success-l--20: var(--sd-colour-success-hs), 20%;
|
4643
|
-
--sd-colour-success-l--30: var(--sd-colour-success-hs), 30%;
|
4644
|
-
--sd-colour-success-l--40: var(--sd-colour-success-hs), 40%;
|
4645
|
-
--sd-colour-success-l--50: var(--sd-colour-success-hs), 50%;
|
4646
|
-
--sd-colour-success-l--60: var(--sd-colour-success-hs), 60%;
|
4647
|
-
--sd-colour-success-l--70: var(--sd-colour-success-hs), 70%;
|
4648
|
-
--sd-colour-success-l--80: var(--sd-colour-success-hs), 80%;
|
4649
|
-
--sd-colour-success-l--90: var(--sd-colour-success-hs), 90%;
|
4650
|
-
--sd-colour-success-l--100: var(--sd-colour-success-hs), 100%;
|
4651
|
-
--sd-colour-alert-hs: 350, 70%;
|
4652
|
-
--sd-colour-alert-l--10: var(--sd-colour-alert-hs), 10%;
|
4653
|
-
--sd-colour-alert-l--20: var(--sd-colour-alert-hs), 20%;
|
4654
|
-
--sd-colour-alert-l--30: var(--sd-colour-alert-hs), 30%;
|
4655
|
-
--sd-colour-alert-l--40: var(--sd-colour-alert-hs), 40%;
|
4656
|
-
--sd-colour-alert-l--50: var(--sd-colour-alert-hs), 50%;
|
4657
|
-
--sd-colour-alert-l--60: var(--sd-colour-alert-hs), 60%;
|
4658
|
-
--sd-colour-alert-l--70: var(--sd-colour-alert-hs), 70%;
|
4659
|
-
--sd-colour-alert-l--80: var(--sd-colour-alert-hs), 80%;
|
4660
|
-
--sd-colour-alert-l--90: var(--sd-colour-alert-hs), 90%;
|
4661
|
-
--sd-colour-alert-l--100: var(--sd-colour-alert-hs), 100%;
|
4662
|
-
--sd-colour-warning-hs: 35, 75%;
|
4663
|
-
--sd-colour-warning-l--10: var(--sd-colour-warning-hs), 10%;
|
4664
|
-
--sd-colour-warning-l--20: var(--sd-colour-warning-hs), 20%;
|
4665
|
-
--sd-colour-warning-l--30: var(--sd-colour-warning-hs), 30%;
|
4666
|
-
--sd-colour-warning-l--40: var(--sd-colour-warning-hs), 40%;
|
4667
|
-
--sd-colour-warning-l--50: var(--sd-colour-warning-hs), 50%;
|
4668
|
-
--sd-colour-warning-l--60: var(--sd-colour-warning-hs), 60%;
|
4669
|
-
--sd-colour-warning-l--70: var(--sd-colour-warning-hs), 70%;
|
4670
|
-
--sd-colour-warning-l--80: var(--sd-colour-warning-hs), 80%;
|
4671
|
-
--sd-colour-warning-l--90: var(--sd-colour-warning-hs), 90%;
|
4672
|
-
--sd-colour-warning-l--100: var(--sd-colour-warning-hs), 100%;
|
4673
|
-
--sd-colour-highlight-hs: 290, 60%;
|
4674
|
-
--sd-colour-highlight-l--10: var(--sd-colour-highlight-hs), 10%;
|
4675
|
-
--sd-colour-highlight-l--20: var(--sd-colour-highlight-hs), 20%;
|
4676
|
-
--sd-colour-highlight-l--30: var(--sd-colour-highlight-hs), 30%;
|
4677
|
-
--sd-colour-highlight-l--40: var(--sd-colour-highlight-hs), 40%;
|
4678
|
-
--sd-colour-highlight-l--50: var(--sd-colour-highlight-hs), 50%;
|
4679
|
-
--sd-colour-highlight-l--60: var(--sd-colour-highlight-hs), 60%;
|
4680
|
-
--sd-colour-highlight-l--70: var(--sd-colour-highlight-hs), 70%;
|
4681
|
-
--sd-colour-highlight-l--80: var(--sd-colour-highlight-hs), 80%;
|
4682
|
-
--sd-colour-highlight-l--90: var(--sd-colour-highlight-hs), 90%;
|
4683
|
-
--sd-colour-highlight-l--100: var(--sd-colour-highlight-hs), 100%;
|
4684
|
-
--sd-colour-neutral-hs: 214, 13%;
|
4685
|
-
--sd-colour-neutral-l--10: var(--sd-colour-neutral-hs), 10%;
|
4686
|
-
--sd-colour-neutral-l--20: var(--sd-colour-neutral-hs), 20%;
|
4687
|
-
--sd-colour-neutral-l--30: var(--sd-colour-neutral-hs), 30%;
|
4688
|
-
--sd-colour-neutral-l--40: var(--sd-colour-neutral-hs), 40%;
|
4689
|
-
--sd-colour-neutral-l--50: var(--sd-colour-neutral-hs), 50%;
|
4690
|
-
--sd-colour-neutral-l--60: var(--sd-colour-neutral-hs), 60%;
|
4691
|
-
--sd-colour-neutral-l--70: var(--sd-colour-neutral-hs), 70%;
|
4692
|
-
--sd-colour-neutral-l--80: var(--sd-colour-neutral-hs), 80%;
|
4693
|
-
--sd-colour-neutral-l--90: var(--sd-colour-neutral-hs), 90%;
|
4694
|
-
--sd-colour-neutral-l--100: var(--sd-colour-neutral-hs), 100%;
|
4695
|
-
--sd-colour-superdesk-hs: 152, 71%;
|
4696
|
-
--sd-colour-superdesk-l--10: var(--sd-colour-superdesk-hs), 10%;
|
4697
|
-
--sd-colour-superdesk-l--20: var(--sd-colour-superdesk-hs), 20%;
|
4698
|
-
--sd-colour-superdesk-l--30: var(--sd-colour-superdesk-hs), 30%;
|
4699
|
-
--sd-colour-superdesk-l--40: var(--sd-colour-superdesk-hs), 40%;
|
4700
|
-
--sd-colour-superdesk-l--50: var(--sd-colour-superdesk-hs), 50%;
|
4701
|
-
--sd-colour-superdesk-l--60: var(--sd-colour-superdesk-hs), 60%;
|
4702
|
-
--sd-colour-superdesk-l--70: var(--sd-colour-superdesk-hs), 70%;
|
4703
|
-
--sd-colour-superdesk-l--80: var(--sd-colour-superdesk-hs), 80%;
|
4704
|
-
--sd-colour-superdesk-l--90: var(--sd-colour-superdesk-hs), 90%;
|
4705
|
-
--sd-colour-superdesk-l--100: var(--sd-colour-superdesk-hs), 100%;
|
4706
|
-
--sd-colour-interactive: hsla(var(--sd-colour-interactive-l--50), 1);
|
4707
|
-
--sd-colour-interactive--hover: hsla(var(--sd-colour-interactive-l--60), 1);
|
4708
|
-
--sd-colour-interactive--active: hsla(var(--sd-colour-interactive-l--40), 1);
|
4709
|
-
--sd-colour-interactive-btn-border: hsla(var(--sd-colour-interactive-l--50), 0.5);
|
4710
|
-
--sd-colour-primary: hsla(var(--sd-colour-primary-l--50), 1);
|
4711
|
-
--sd-colour-primary--hover: hsla(var(--sd-colour-primary-l--60), 1);
|
4712
|
-
--sd-colour-primary--active: hsla(var(--sd-colour-primary-l--40), 1);
|
4713
|
-
--sd-colour-primary-btn-border: hsla(var(--sd-colour-primary-l--50), 0.5);
|
4714
|
-
--sd-colour-secondary: hsla(var(--sd-colour-secondary-l--50), 1);
|
4715
|
-
--sd-colour-secondary--hover: hsla(var(--sd-colour-secondary-l--60), 1);
|
4716
|
-
--sd-colour-secondary--active: hsla(var(--sd-colour-secondary-l--40), 1);
|
4717
|
-
--sd-colour-secondary-btn-border: hsla(var(--sd-colour-secondary-l--50), 0.5);
|
4718
|
-
--sd-colour-success: hsla(var(--sd-colour-success-l--50), 1);
|
4719
|
-
--sd-colour-success--hover: hsla(var(--sd-colour-success-l--60), 1);
|
4720
|
-
--sd-colour-success--active: hsla(var(--sd-colour-success-l--40), 1);
|
4721
|
-
--sd-colour-success-btn-border: hsla(var(--sd-colour-success-l--50), 0.5);
|
4722
|
-
--sd-colour-alert: hsla(var(--sd-colour-alert-l--50), 1);
|
4723
|
-
--sd-colour-alert--hover: hsla(var(--sd-colour-alert-l--60), 1);
|
4724
|
-
--sd-colour-alert--active: hsla(var(--sd-colour-alert-l--40), 1);
|
4725
|
-
--sd-colour-alert-btn-border: hsla(var(--sd-colour-alert-l--50), 0.5);
|
4726
|
-
--sd-colour-warning: hsla(var(--sd-colour-warning-l--50), 1);
|
4727
|
-
--sd-colour-warning--hover: hsla(var(--sd-colour-warning-l--60), 1);
|
4728
|
-
--sd-colour-warning--active: hsla(var(--sd-colour-warning-l--40), 1);
|
4729
|
-
--sd-colour-warning-btn-border: hsla(var(--sd-colour-warning-l--50), 0.5);
|
4730
|
-
--sd-colour-highlight: hsla(var(--sd-colour-highlight-l--50), 1);
|
4731
|
-
--sd-colour-highlight--hover: hsla(var(--sd-colour-highlight-l--60), 1);
|
4732
|
-
--sd-colour-highlight--active: hsla(var(--sd-colour-highlight-l--40), 1);
|
4733
|
-
--sd-colour-highlight-btn-border: hsla(var(--sd-colour-highlight-l--50), 0.5);
|
4734
|
-
--sd-colour-superdesk: hsla(var(--sd-colour-superdesk-l--40), 1);
|
4735
|
-
--sd-colour-superdesk--hover: hsla(var(--sd-colour-superdesk-l--50), 1);
|
4736
|
-
--sd-colour-superdesk--active: hsla(var(--sd-colour-superdesk-l--30), 1);
|
4737
|
-
--sd-colour-superdesk-btn-border: hsla(var(--sd-colour-superdesk-l--40), 0.5);
|
4738
|
-
--sd-colour-neutral: hsla(var(--sd-colour-neutral-l--50), 0.5);
|
4739
|
-
--sd-colour-neutral--hover: hsla(var(--sd-colour-neutral-l--60), 0.5);
|
4740
|
-
--sd-colour-neutral--active: hsla(var(--sd-colour-neutral-l--40), 0.5);
|
4741
|
-
--sd-colour-neutral-btn-border: hsla(var(--sd-colour-neutral-l--40), 0.5);
|
4742
|
-
--sd-colour-info: hsla(var(--sd-colour-info-l--50), 1);
|
4743
|
-
--sd-colour-info--hover: hsla(var(--sd-colour-info-l--60), 1);
|
4744
|
-
--sd-colour-info--active: hsla(var(--sd-colour-info-l--40), 1);
|
4745
|
-
--sd-colour-btn-bg-neutral: hsla(var(--sd-colour-neutral-l--50), 0.4);
|
4746
|
-
--sd-colour-btn-bg-neutral--hover: hsla(var(--sd-colour-neutral-l--60), 0.5);
|
4747
|
-
--sd-colour-btn-bg-neutral--active: hsla(var(--sd-colour-neutral-l--40), 0.5);
|
4748
|
-
--sd-colour-btn-txt-neutral: hsla(var(--sd-colour-neutral-l--40), 1);
|
4749
|
-
--sd-colour-btn-border-neutral: hsla(var(--sd-colour-neutral-l--50), 0.5);
|
4750
|
-
--sd-colour-alert-bg-neutral: hsla(var(--sd-colour-neutral-l--50), 0.25);
|
4751
|
-
--sd-colour-interactive--alpha-10: hsla(var(--sd-colour-interactive-l--50), 0.1);
|
4752
|
-
--sd-colour-interactive--alpha-20: hsla(var(--sd-colour-interactive-l--50), 0.2);
|
4753
|
-
--sd-colour-interactive--alpha-30: hsla(var(--sd-colour-interactive-l--50), 0.3);
|
4754
|
-
--sd-colour-interactive--alpha-40: hsla(var(--sd-colour-interactive-l--50), 0.4);
|
4755
|
-
--sd-colour-interactive--alpha-50: hsla(var(--sd-colour-interactive-l--50), 0.5);
|
4756
|
-
--sd-colour-interactive--alpha-60: hsla(var(--sd-colour-interactive-l--50), 0.6);
|
4757
|
-
--sd-colour-interactive--alpha-70: hsla(var(--sd-colour-interactive-l--50), 0.7);
|
4758
|
-
--sd-colour-interactive--alpha-80: hsla(var(--sd-colour-interactive-l--50), 0.8);
|
4759
|
-
--sd-colour-interactive--alpha-90: hsla(var(--sd-colour-interactive-l--50), 0.9);
|
4760
|
-
--sd-colour-interactive--lighten-10: hsla(var(--sd-colour-interactive-l--60), 1);
|
4761
|
-
--sd-colour-interactive--lighten-20: hsla(var(--sd-colour-interactive-l--70), 1);
|
4762
|
-
--sd-colour-interactive--lighten-30: hsla(var(--sd-colour-interactive-l--80), 1);
|
4763
|
-
--sd-colour-interactive--lighten-40: hsla(var(--sd-colour-interactive-l--90), 1);
|
4764
|
-
--sd-colour-interactive--lighten-45: hsla(var(--sd-colour-interactive-l--95), 1);
|
4765
|
-
--sd-colour-interactive--darken-10: hsla(var(--sd-colour-interactive-l--40), 1);
|
4766
|
-
--sd-colour-interactive--darken-20: hsla(var(--sd-colour-interactive-l--30), 1);
|
4767
|
-
--sd-colour-interactive--darken-30: hsla(var(--sd-colour-interactive-l--20), 1);
|
4768
|
-
--sd-colour-interactive--darken-40: hsla(var(--sd-colour-interactive-l--10), 1);
|
4769
|
-
--sd-colour-interactive--darken-50: hsla(var(--sd-colour-interactive-l--05), 1);
|
4770
|
-
--sd-colour-cool-grey-hs: 214, 13%;
|
4771
|
-
--sd-colour-cool-grey-l--00: var(--sd-colour-cool-grey-hs), 0%;
|
4772
|
-
--sd-colour-cool-grey-l--05: var(--sd-colour-cool-grey-hs), 8%;
|
4773
|
-
--sd-colour-cool-grey-l--10: var(--sd-colour-cool-grey-hs), 12%;
|
4774
|
-
--sd-colour-cool-grey-l--15: var(--sd-colour-cool-grey-hs), 16%;
|
4775
|
-
--sd-colour-cool-grey-l--20: var(--sd-colour-cool-grey-hs), 20%;
|
4776
|
-
--sd-colour-cool-grey-l--23: var(--sd-colour-cool-grey-hs), 22.5%;
|
4777
|
-
--sd-colour-cool-grey-l--25: var(--sd-colour-cool-grey-hs), 25%;
|
4778
|
-
--sd-colour-cool-grey-l--30: var(--sd-colour-cool-grey-hs), 30%;
|
4779
|
-
--sd-colour-cool-grey-l--35: var(--sd-colour-cool-grey-hs), 35%;
|
4780
|
-
--sd-colour-cool-grey-l--40: var(--sd-colour-cool-grey-hs), 40%;
|
4781
|
-
--sd-colour-cool-grey-l--45: var(--sd-colour-cool-grey-hs), 45%;
|
4782
|
-
--sd-colour-cool-grey-l--50: var(--sd-colour-cool-grey-hs), 50%;
|
4783
|
-
--sd-colour-cool-grey-l--55: var(--sd-colour-cool-grey-hs), 55%;
|
4784
|
-
--sd-colour-cool-grey-l--60: var(--sd-colour-cool-grey-hs), 60%;
|
4785
|
-
--sd-colour-cool-grey-l--65: var(--sd-colour-cool-grey-hs), 65%;
|
4786
|
-
--sd-colour-cool-grey-l--70: var(--sd-colour-cool-grey-hs), 70%;
|
4787
|
-
--sd-colour-cool-grey-l--75: var(--sd-colour-cool-grey-hs), 75%;
|
4788
|
-
--sd-colour-cool-grey-l--80: var(--sd-colour-cool-grey-hs), 80%;
|
4789
|
-
--sd-colour-cool-grey-l--85: var(--sd-colour-cool-grey-hs), 85%;
|
4790
|
-
--sd-colour-cool-grey-l--90: var(--sd-colour-cool-grey-hs), 92%;
|
4791
|
-
--sd-colour-cool-grey-l--95: var(--sd-colour-cool-grey-hs), 96%;
|
4792
|
-
--sd-colour-cool-grey-l--98: var(--sd-colour-cool-grey-hs), 98%;
|
4793
|
-
--sd-colour-cool-grey-l--99: var(--sd-colour-cool-grey-hs), 100%;
|
4794
|
-
--sd-colour-bg--00: hsla(var(--sd-colour-cool-grey-l--00), 1);
|
4795
|
-
--sd-colour-bg--01: hsla(var(--sd-colour-cool-grey-l--05), 1);
|
4796
|
-
--sd-colour-bg--02: hsla(var(--sd-colour-cool-grey-l--10), 1);
|
4797
|
-
--sd-colour-bg--03: hsla(var(--sd-colour-cool-grey-l--15), 1);
|
4798
|
-
--sd-colour-bg--04: hsla(var(--sd-colour-cool-grey-l--20), 1);
|
4799
|
-
--sd-colour-bg--04-a: hsla(var(--sd-colour-cool-grey-l--23), 1);
|
4800
|
-
--sd-colour-bg--05: hsla(var(--sd-colour-cool-grey-l--25), 1);
|
4801
|
-
--sd-colour-bg--06: hsla(var(--sd-colour-cool-grey-l--30), 1);
|
4802
|
-
--sd-colour-bg--07: hsla(var(--sd-colour-cool-grey-l--35), 1);
|
4803
|
-
--sd-colour-bg--08: hsla(var(--sd-colour-cool-grey-l--40), 1);
|
4804
|
-
--sd-colour-bg--09: hsla(var(--sd-colour-cool-grey-l--45), 1);
|
4805
|
-
--sd-colour-bg--10: hsla(var(--sd-colour-cool-grey-l--50), 1);
|
4806
|
-
--sd-colour-bg--20: hsla(var(--sd-colour-cool-grey-l--65), 1);
|
4807
|
-
--sd-colour-bg--21: hsla(var(--sd-colour-cool-grey-l--70), 1);
|
4808
|
-
--sd-colour-bg--22: hsla(var(--sd-colour-cool-grey-l--75), 1);
|
4809
|
-
--sd-colour-bg--99: hsla(var(--sd-colour-cool-grey-l--99), 1);
|
4810
|
-
--sd-colour-bg--99-a: hsla(var(--sd-colour-cool-grey-l--98), 1);
|
4811
|
-
--sd-colour-bg--95: hsla(var(--sd-colour-cool-grey-l--95), 1);
|
4812
|
-
--sd-colour-panel-bg--000: hsla(var(--sd-colour-cool-grey-l--99), 1);
|
4813
|
-
--sd-colour-panel-bg--100: hsla(var(--sd-colour-cool-grey-l--95), 1);
|
4814
|
-
--sd-colour-panel-bg--200: hsla(var(--sd-colour-cool-grey-l--90), 1);
|
4815
|
-
--sd-colour-panel-bg--300: hsla(var(--sd-colour-cool-grey-l--85), 1);
|
4816
|
-
--sd-colour-sidebar-menu--00: hsla(var(--sd-colour-cool-grey-l--85), 1);
|
4817
|
-
--sd-colour-sidebar-menu--10: hsla(var(--sd-colour-cool-grey-l--80), 1);
|
4818
|
-
--sd-colour-sidebar-menu--20: hsla(var(--sd-colour-cool-grey-l--75), 1);
|
4819
|
-
--sd-colour-background__left-nav: var(--sd-colour-bg--99);
|
4820
|
-
--sd-colour-top-menu: var(--sd-colour-bg--02);
|
4821
|
-
--sd-colour-top-menu__btn: var(--sd-colour-bg--03);
|
4822
|
-
--sd-colour-bottom-bar: var(--sd-colour-bg--01);
|
4823
|
-
--sd-colour-line--x-light: hsla(var(--sd-colour-cool-grey-l--20), 0.1);
|
4824
|
-
--sd-colour-line--light: hsla(var(--sd-colour-cool-grey-l--20), 0.16);
|
4825
|
-
--sd-colour-line--medium: hsla(var(--sd-colour-cool-grey-l--20), 0.2);
|
4826
|
-
--sd-colour-line--strong: hsla(var(--sd-colour-cool-grey-l--20), 0.48);
|
4827
|
-
--sd-colour-bg-translucent--08: hsla(var(--sd-colour-cool-grey-l--50), 0.3);
|
4828
|
-
--sd-colour-overlay-actioning: hsla(var(--sd-colour-cool-grey-l--99), 0.85);
|
4829
|
-
--sd-colour-background__tooltip: var(--sd-colour-bg--02);
|
4830
|
-
--sd-item__thumb-Bg: var(--sd-colour-bg--03);
|
4831
|
-
--sd-item__main-Bg: var(--sd-colour-bg--99);
|
4832
|
-
--sd-item__main-Bg--hover: var(--sd-colour-bg--95);
|
4833
|
-
--sd-item__main-Bg--selected: var(--sd-colour-interactive--lighten-40);
|
4834
|
-
--sd-item__main-Bg--activated: var(--sd-colour-interactive--lighten-45);
|
4835
|
-
--sd-item__main-Bg--alternate: var(--sd-colour-bg--99-a);
|
4836
|
-
--sd-colour-bg__grid-item--selected: var(--sd-colour-interactive--lighten-45);
|
4837
|
-
--sd-colour-bg__sliding-toolbar: var(--sd-colour-interactive--lighten-40);
|
4838
|
-
--sd-colour-bg__searchbar: var(--sd-colour-bg--99);
|
4839
|
-
--color-dropdown-menu-Bg: var(--sd-colour-bg--99);
|
4840
|
-
--color-modal-Bg: var(--sd-colour-bg--99);
|
4841
|
-
--sd-colour--shadow-line: hsla(var(--sd-colour-cool-grey-l--70), 0);
|
4842
|
-
--sd-shadow__subnav: 0 1px 0px var(--sd-colour--shadow-line), 0 1px 3px hsla(0, 0%, 0%, 0.07), 0 1px 0 0 hsla(0, 0%, 0%, 0.1);
|
4843
|
-
--sd-shadow__item--selected: 0 0 0 2px var(--sd-colour-interactive), 0 0 0 5px var(--sd-colour-interactive--alpha-30);
|
4844
|
-
--sd-colour__webkit-scrollbar--hover: hsla(214, 13%, 50%, 0.24);
|
4845
|
-
--sd-colour__webkit-scrollbar-thumb: hsla(214, 13%, 70%, 0.32);
|
4846
|
-
--sd-colour__webkit-scrollbar-thumb--hover: hsla(214, 13%, 70%, 0.48);
|
4847
|
-
--sd-colour__side-menu--hover: var(--sd-colour-bg--95);
|
4848
|
-
--sd-colour__splitter: var(--sd-colour-bg--05);
|
4849
|
-
--sd-colour__dashboard-widget-Bg: hsla(214, 13%, 98%, 1);
|
4850
|
-
--sd-colour__side-panel-border: var(--sd-colour-bg--20);
|
4851
|
-
--sd-colour__tag-label-Bg--1: hsla(var(--sd-colour-cool-grey-l--55), 0.3);
|
4852
|
-
--sd-colour__tag-label-Bg--2: hsla(var(--sd-colour-cool-grey-l--35), 0.45);
|
4853
|
-
--sd-colour__tag-label-Bg--highlight-1: var(--sd-colour-interactive--alpha-40);
|
4854
|
-
--sd-colour__tag-label-Bg--highlight-2: var(--sd-colour-interactive--alpha-70);
|
4855
|
-
--sd-colour__tag-label-remove-Bg: hsla(var(--sd-colour-cool-grey-l--90), 0.35);
|
4856
|
-
--sd-colour__tag-label-remove-Bg--hover: hsla(var(--sd-colour-cool-grey-l--90), 0.85);
|
4857
|
-
--sd-colour-bg__photo-preview: hsla(var(--sd-colour-cool-grey-l--10), 1);
|
4858
|
-
--sd-colour-bg__slide-in-column-inner: hsla(var(--sd-colour-cool-grey-l--20), 1);
|
4859
|
-
--sd-colour-bg__button-nav-btn: hsla(var(--sd-colour-cool-grey-l--80), 0);
|
4860
|
-
--sd-colour-bg__button-nav-btn--hover: hsla(var(--sd-colour-cool-grey-l--80), 0.5);
|
4861
|
-
--sd-colour-bg__button-nav-btn--active: hsla(var(--sd-colour-cool-grey-l--60), 1);
|
4862
|
-
--sd-colour-bg__desk-select: var(--sd-colour-interactive);
|
4863
|
-
--sd-colour-bg__desk-select--worspace: hsla(306, 25%, 49%, 1);
|
4864
|
-
--sd-colour__tag-label-Bg--inverse: var(--sd-colour-bg--08);
|
4865
|
-
--sd-colour__tag-label-Txt--inverse: hsla(214, 13%, 98%, 1); }
|
4866
|
-
|
4867
|
-
[data-theme="dark-ui"] {
|
4868
|
-
--sd-colour-interactive-hs: 160, 50%;
|
4869
|
-
--sd-colour-interactive-l--05: var(--sd-colour-interactive-hs), 6%;
|
4870
|
-
--sd-colour-interactive-l--10: var(--sd-colour-interactive-hs), 10%;
|
4871
|
-
--sd-colour-interactive-l--20: var(--sd-colour-interactive-hs), 20%;
|
4872
|
-
--sd-colour-interactive-l--30: var(--sd-colour-interactive-hs), 30%;
|
4873
|
-
--sd-colour-interactive-l--40: var(--sd-colour-interactive-hs), 40%;
|
4874
|
-
--sd-colour-interactive-l--50: var(--sd-colour-interactive-hs), 50%;
|
4875
|
-
--sd-colour-interactive-l--60: var(--sd-colour-interactive-hs), 60%;
|
4876
|
-
--sd-colour-interactive-l--70: var(--sd-colour-interactive-hs), 70%;
|
4877
|
-
--sd-colour-interactive-l--80: var(--sd-colour-interactive-hs), 80%;
|
4878
|
-
--sd-colour-interactive-l--90: var(--sd-colour-interactive-hs), 90%;
|
4879
|
-
--sd-colour-interactive-l--100: var(--sd-colour-interactive-hs), 100%;
|
4880
|
-
--sd-colour-primary-hs: 160, 50%;
|
4881
|
-
--sd-colour-primary-l--10: var(--sd-colour-primary-hs), 10%;
|
4882
|
-
--sd-colour-primary-l--20: var(--sd-colour-primary-hs), 20%;
|
4883
|
-
--sd-colour-primary-l--30: var(--sd-colour-primary-hs), 30%;
|
4884
|
-
--sd-colour-primary-l--40: var(--sd-colour-primary-hs), 40%;
|
4885
|
-
--sd-colour-primary-l--50: var(--sd-colour-primary-hs), 50%;
|
4886
|
-
--sd-colour-primary-l--60: var(--sd-colour-primary-hs), 60%;
|
4887
|
-
--sd-colour-primary-l--70: var(--sd-colour-primary-hs), 70%;
|
4888
|
-
--sd-colour-primary-l--80: var(--sd-colour-primary-hs), 80%;
|
4889
|
-
--sd-colour-primary-l--90: var(--sd-colour-primary-hs), 90%;
|
4890
|
-
--sd-colour-primary-l--100: var(--sd-colour-primary-hs), 100%;
|
4891
|
-
--sd-colour-interactive: hsla(var(--sd-colour-interactive-l--50), 1);
|
4892
|
-
--sd-colour-interactive--hover: hsla(var(--sd-colour-interactive-l--60), 1);
|
4893
|
-
--sd-colour-interactive--active: hsla(var(--sd-colour-interactive-l--40), 1);
|
4894
|
-
--sd-colour-interactive-btn-border: hsla(var(--sd-colour-interactive-l--50), 0.5);
|
4895
|
-
--sd-colour-primary: hsla(var(--sd-colour-primary-l--50), 1);
|
4896
|
-
--sd-colour-primary--hover: hsla(var(--sd-colour-primary-l--60), 1);
|
4897
|
-
--sd-colour-primary--active: hsla(var(--sd-colour-primary-l--40), 1);
|
4898
|
-
--sd-colour-interactive--alpha-10: hsla(var(--sd-colour-interactive-l--50), 0.1);
|
4899
|
-
--sd-colour-interactive--alpha-20: hsla(var(--sd-colour-interactive-l--50), 0.2);
|
4900
|
-
--sd-colour-interactive--alpha-30: hsla(var(--sd-colour-interactive-l--50), 0.3);
|
4901
|
-
--sd-colour-interactive--alpha-40: hsla(var(--sd-colour-interactive-l--50), 0.4);
|
4902
|
-
--sd-colour-interactive--alpha-50: hsla(var(--sd-colour-interactive-l--50), 0.5);
|
4903
|
-
--sd-colour-interactive--alpha-60: hsla(var(--sd-colour-interactive-l--50), 0.6);
|
4904
|
-
--sd-colour-interactive--alpha-70: hsla(var(--sd-colour-interactive-l--50), 0.7);
|
4905
|
-
--sd-colour-interactive--alpha-80: hsla(var(--sd-colour-interactive-l--50), 0.8);
|
4906
|
-
--sd-colour-interactive--alpha-90: hsla(var(--sd-colour-interactive-l--50), 0.9);
|
4907
|
-
--sd-colour-interactive--lighten-10: hsla(var(--sd-colour-interactive-l--60), 1);
|
4908
|
-
--sd-colour-interactive--lighten-20: hsla(var(--sd-colour-interactive-l--70), 1);
|
4909
|
-
--sd-colour-interactive--lighten-30: hsla(var(--sd-colour-interactive-l--80), 1);
|
4910
|
-
--sd-colour-interactive--lighten-40: hsla(var(--sd-colour-interactive-l--90), 1);
|
4911
|
-
--sd-colour-interactive--darken-10: hsla(var(--sd-colour-interactive-l--40), 1);
|
4912
|
-
--sd-colour-interactive--darken-20: hsla(var(--sd-colour-interactive-l--30), 1);
|
4913
|
-
--sd-colour-interactive--darken-30: hsla(var(--sd-colour-interactive-l--20), 1);
|
4914
|
-
--sd-colour-interactive--darken-40: hsla(var(--sd-colour-interactive-l--10), 1);
|
4915
|
-
--sd-colour-interactive--darken-50: hsla(var(--sd-colour-interactive-l--05), 1);
|
4916
|
-
--sd-colour-btn-txt-neutral: hsla(var(--sd-colour-neutral-l--80), 1);
|
4917
|
-
--sd-colour--shadow-line: hsla(var(--sd-colour-cool-grey-l--75), 0.2);
|
4918
|
-
--sd-colour-panel-bg--000: hsla(var(--sd-colour-cool-grey-l--10), 1);
|
4919
|
-
--sd-colour-panel-bg--100: hsla(var(--sd-colour-cool-grey-l--15), 1);
|
4920
|
-
--sd-colour-panel-bg--200: hsla(var(--sd-colour-cool-grey-l--20), 1);
|
4921
|
-
--sd-colour-panel-bg--300: hsla(var(--sd-colour-cool-grey-l--25), 1);
|
4922
|
-
--sd-colour-sidebar-menu--00: hsla(var(--sd-colour-cool-grey-l--25), 1);
|
4923
|
-
--sd-colour-sidebar-menu--10: hsla(var(--sd-colour-cool-grey-l--30), 1);
|
4924
|
-
--sd-colour-sidebar-menu--20: hsla(var(--sd-colour-cool-grey-l--35), 1);
|
4925
|
-
--sd-colour-background__left-nav: var(--sd-colour-bg--04);
|
4926
|
-
--sd-colour-top-menu: var(--sd-colour-bg--02);
|
4927
|
-
--sd-colour-top-menu__btn: var(--sd-colour-bg--03);
|
4928
|
-
--sd-colour-line--x-light: hsla(var(--sd-colour-cool-grey-l--70), 0.1);
|
4929
|
-
--sd-colour-line--light: hsla(var(--sd-colour-cool-grey-l--70), 0.16);
|
4930
|
-
--sd-colour-line--medium: hsla(var(--sd-colour-cool-grey-l--70), 0.2);
|
4931
|
-
--sd-colour-line--strong: hsla(var(--sd-colour-cool-grey-l--70), 0.48);
|
4932
|
-
--sd-colour-bg-translucent--08: hsla(var(--sd-colour-cool-grey-l--50), 0.3);
|
4933
|
-
--sd-colour-background__tooltip: var(--sd-colour-bg--10);
|
4934
|
-
--sd-item__thumb-Bg: var(--sd-colour-bg--02);
|
4935
|
-
--sd-item__main-Bg: var(--sd-colour-bg--04);
|
4936
|
-
--sd-item__main-Bg--hover: var(--sd-colour-bg--05);
|
4937
|
-
--sd-item__main-Bg--selected: var(--sd-colour-interactive--darken-30);
|
4938
|
-
--sd-item__main-Bg--activated: var(--sd-colour-interactive--darken-40);
|
4939
|
-
--sd-item__main-Bg--alternate: var(--sd-colour-bg--04-a);
|
4940
|
-
--sd-colour-bg__grid-item--selected: var(--sd-colour-bg--04);
|
4941
|
-
--sd-colour-bg__sliding-toolbar: var(--sd-colour-interactive--darken-30);
|
4942
|
-
--sd-colour-bg__searchbar: var(--sd-colour-bg--02);
|
4943
|
-
--sd-colour-overlay-actioning: hsla(var(--sd-colour-cool-grey-l--20), 0.85);
|
4944
|
-
--color-dropdown-menu-Bg: var(--sd-colour-bg--05);
|
4945
|
-
--color-modal-Bg: var(--sd-colour-bg--05);
|
4946
|
-
--sd-colour--shadow-line: hsla(var(--sd-colour-cool-grey-l--70), 0.12);
|
4947
|
-
--sd-shadow__subnav: 0 1px 0px var(--sd-colour--shadow-line), 0 1px 3px hsla(0, 0%, 0%, 0.14), 0 2px 0 0 hsla(0, 0%, 0%, 0.12);
|
4948
|
-
--sd-shadow__item--selected: 0 0 0 2px var(--sd-colour-interactive), 0 0 0 5px var(--sd-colour-interactive--alpha-30);
|
4949
|
-
--sd-colour__webkit-scrollbar--hover: hsla(214, 13%, 30%, 0.24);
|
4950
|
-
--sd-colour__webkit-scrollbar-thumb: hsla(214, 13%, 30%, 0.32);
|
4951
|
-
--sd-colour__webkit-scrollbar-thumb--hover: hsla(214, 13%, 34%, 0.48);
|
4952
|
-
--sd-colour__side-menu--hover: var(--sd-colour-bg--02);
|
4953
|
-
--sd-colour__splitter: var(--sd-colour-bg--10);
|
4954
|
-
--sd-colour__dashboard-widget-Bg: hsla(214, 13%, 18%, 1);
|
4955
|
-
--sd-colour__side-panel-border: var(--sd-colour-bg--05);
|
4956
|
-
--sd-colour__tag-label-Bg--1: hsla(var(--sd-colour-cool-grey-l--40), 0.3);
|
4957
|
-
--sd-colour__tag-label-Bg--2: hsla(var(--sd-colour-cool-grey-l--55), 0.45);
|
4958
|
-
--sd-colour__tag-label-Bg--highlight-1: var(--sd-colour-interactive--alpha-30);
|
4959
|
-
--sd-colour__tag-label-Bg--highlight-2: var(--sd-colour-interactive--alpha-60);
|
4960
|
-
--sd-colour__tag-label-remove-Bg: hsla(var(--sd-colour-cool-grey-l--10), 0.35);
|
4961
|
-
--sd-colour__tag-label-remove-Bg--hover: hsla(var(--sd-colour-cool-grey-l--10), 0.75);
|
4962
|
-
--sd-colour-bg__button-nav-btn: hsla(var(--sd-colour-cool-grey-l--40), 0);
|
4963
|
-
--sd-colour-bg__button-nav-btn--hover: hsla(var(--sd-colour-cool-grey-l--40), 0.25);
|
4964
|
-
--sd-colour-bg__button-nav-btn--active: hsla(var(--sd-colour-cool-grey-l--10), 0.5);
|
4965
|
-
--sd-colour-bg__desk-select: hsla(160, 50%, 50%, 0.20);
|
4966
|
-
--sd-colour-bg__desk-select--worspace: hsla(306, 25%, 49%, 0.28);
|
4967
|
-
--sd-colour__tag-label-Bg--inverse: hsla(214, 13%, 55%, 0.95);
|
4968
|
-
--sd-colour__tag-label-Txt--inverse: hsla(214, 13%, 10%, 1); }
|
4969
|
-
|
4970
|
-
[data-theme="accessible-light-ui"] {
|
4971
|
-
--sd-colour-interactive-hs: 241, 100%;
|
4972
|
-
--sd-colour-interactive-l--05: var(--sd-colour-interactive-hs), 6%;
|
4973
|
-
--sd-colour-interactive-l--10: var(--sd-colour-interactive-hs), 10%;
|
4974
|
-
--sd-colour-interactive-l--20: var(--sd-colour-interactive-hs), 20%;
|
4975
|
-
--sd-colour-interactive-l--30: var(--sd-colour-interactive-hs), 30%;
|
4976
|
-
--sd-colour-interactive-l--40: var(--sd-colour-interactive-hs), 40%;
|
4977
|
-
--sd-colour-interactive-l--50: var(--sd-colour-interactive-hs), 50%;
|
4978
|
-
--sd-colour-interactive-l--60: var(--sd-colour-interactive-hs), 60%;
|
4979
|
-
--sd-colour-interactive-l--70: var(--sd-colour-interactive-hs), 70%;
|
4980
|
-
--sd-colour-interactive-l--80: var(--sd-colour-interactive-hs), 80%;
|
4981
|
-
--sd-colour-interactive-l--90: var(--sd-colour-interactive-hs), 90%;
|
4982
|
-
--sd-colour-interactive-l--100: var(--sd-colour-interactive-hs), 100%;
|
4983
|
-
--sd-colour-interactive--alpha-10: hsla(var(--sd-colour-interactive-l--50), 0.1);
|
4984
|
-
--sd-colour-interactive--alpha-20: hsla(var(--sd-colour-interactive-l--50), 0.2);
|
4985
|
-
--sd-colour-interactive--alpha-30: hsla(var(--sd-colour-interactive-l--50), 0.3);
|
4986
|
-
--sd-colour-interactive--alpha-40: hsla(var(--sd-colour-interactive-l--50), 0.4);
|
4987
|
-
--sd-colour-interactive--alpha-50: hsla(var(--sd-colour-interactive-l--50), 0.5);
|
4988
|
-
--sd-colour-interactive--alpha-60: hsla(var(--sd-colour-interactive-l--50), 0.6);
|
4989
|
-
--sd-colour-interactive--alpha-70: hsla(var(--sd-colour-interactive-l--50), 0.7);
|
4990
|
-
--sd-colour-interactive--alpha-80: hsla(var(--sd-colour-interactive-l--50), 0.8);
|
4991
|
-
--sd-colour-interactive--alpha-90: hsla(var(--sd-colour-interactive-l--50), 0.9);
|
4992
|
-
--sd-colour-interactive--lighten-10: hsla(var(--sd-colour-neutral-l--60), 1);
|
4993
|
-
--sd-colour-interactive--lighten-20: hsla(var(--sd-colour-neutral-l--70), 1);
|
4994
|
-
--sd-colour-interactive--lighten-30: hsla(var(--sd-colour-neutral-l--80), 1);
|
4995
|
-
--sd-colour-interactive--lighten-40: hsla(var(--sd-colour-neutral-l--90), 1);
|
4996
|
-
--sd-colour-interactive--darken-10: hsla(var(--sd-colour-neutral-l--40), 1);
|
4997
|
-
--sd-colour-interactive--darken-20: hsla(var(--sd-colour-neutral-l--30), 1);
|
4998
|
-
--sd-colour-interactive--darken-30: hsla(var(--sd-colour-neutral-l--20), 1);
|
4999
|
-
--sd-colour-interactive--darken-40: hsla(var(--sd-colour-neutral-l--10), 1);
|
5000
|
-
--sd-colour-interactive--darken-50: hsla(var(--sd-colour-neutral-l--05), 1);
|
5001
|
-
--sd-colour-interactive: hsla(var(--sd-colour-interactive-l--50), 1);
|
5002
|
-
--sd-colour-interactive--hover: hsla(var(--sd-colour-interactive-l--60), 1);
|
5003
|
-
--sd-colour-interactive--active: hsla(var(--sd-colour-interactive-l--40), 1);
|
5004
|
-
--sd-colour-interactive-btn-border: hsla(var(--sd-colour-interactive-l--50), 0.5); }
|
5005
|
-
|
5006
|
-
:root, [data-theme="light-ui"] {
|
5007
|
-
--sd-colour-background__main-list: hsla(0, 0%, 97%, 1);
|
5008
|
-
--sd-colour-background__base--00: hsla(0, 0%, 100%, 1);
|
5009
|
-
--sd-colour-background__base--10: hsla(0, 0%, 90%, 1);
|
5010
|
-
--sd-colour-background__base--20: hsla(0, 0%, 80%, 1);
|
5011
|
-
--sd-colour-background__base--30: hsla(0, 0%, 70%, 1);
|
5012
|
-
--color-text: hsla(0, 0%, 20%, 1);
|
5013
|
-
--color-text--inverse: hsla(0, 0%, 98%, 1);
|
5014
|
-
--color-text-light: hsla(214, 13%, 20%, 0.75);
|
5015
|
-
--color-text-lighter: hsla(214, 13%, 20%, 0.55);
|
5016
|
-
--color-icon-default: hsla(0, 0%, 20%, 1);
|
5017
|
-
--sd-slugline-color: hsla(197, 100%, 25%, 1);
|
5018
|
-
--color-input-bg: hsla(214, 13%, 50%, 0.1);
|
5019
|
-
--color-input-bg--hover: hsla(214, 13%, 50%, 0.16);
|
5020
|
-
--color-input-bg--focus: var(--sd-colour-interactive--alpha-20);
|
5021
|
-
--color-label-text: hsla(214, 13%, 45%, 1);
|
5022
|
-
--color-input-border: hsla(214, 13%, 10%, 0.2);
|
5023
|
-
--color-input-border-hover: hsla(214, 13%, 10%, 0.35);
|
5024
|
-
--color-form-bg: hsla(0, 0%, 100%, 0);
|
5025
|
-
--color-checkbox-border: hsla(0, 0%, 0%, 0.2);
|
5026
|
-
--color-checkbox-border-hover: hsla(0, 0%, 0%, 0.4);
|
5027
|
-
--color-selected-bg: hsla(196, 35%, 94%, 1);
|
5028
|
-
--color-selected-bg--hover: hsla(198, 36%, 91%, 1);
|
5029
|
-
--color-bg-00: hsla(0, 0%, 100%, 1);
|
5030
|
-
--color-bg-50: hsla(0, 0%, 97%, 1);
|
5031
|
-
--color-bg-100: hsla(0, 0%, 93%, 1);
|
5032
|
-
--color-bg-150: hsla(0, 0%, 87%, 1);
|
5033
|
-
--color-bg-200: hsla(0, 0%, 63%, 1);
|
5034
|
-
--color-bg-800: hsla(0, 0%, 17%, 1);
|
5035
|
-
--color-kanban-border: hsla(0, 0%, 30%, 1);
|
5036
|
-
--color-inset-search-bg: hsla(0, 0%, 100%, 1);
|
5037
|
-
--color-inset-search-border: hsla(0, 0%, 0%, 0.2);
|
5038
|
-
--color-inset-search-border-hover: hsla(0, 0%, 0%, 0.35);
|
5039
|
-
--color-assignment-to-do: hsla(4, 89%, 41%, 1);
|
5040
|
-
--color-assignment-progress: hsla(36, 100%, 41%, 1);
|
5041
|
-
--color-assignment-completed: hsla(88, 50%, 44%, 1);
|
5042
|
-
--color-grid-item-Bg: hsla(0, 0%, 100%, 1);
|
5043
|
-
--color-dropdown-menu-text: hsla(0, 0%, 20%, 1);
|
5044
|
-
--color-navbutton-dropdown-open-bg: hsla(0, 0%, 100%);
|
5045
|
-
--color-border-line--light: hsla(0, 0%, 90%, 1);
|
5046
|
-
--color-border-line--medium: hsla(0, 0%, 80%, 1);
|
5047
|
-
--color-subnav-bg--00: hsla(0, 0%, 96%, 1);
|
5048
|
-
--color-subnav-bg--10: hsla(0, 0%, 87%, 1);
|
5049
|
-
--color-subnav-bg--blueGrey-00: hsla(200, 18%, 46%, 1);
|
5050
|
-
--color-subnav-bg--blueGrey-10: hsla(200, 18%, 37%, 1);
|
5051
|
-
--color-navbutton-bg-hover: hsla(0, 0%, 0%, 0.05);
|
5052
|
-
--color-navbutton-bg-active: hsla(0, 0%, 100%);
|
5053
|
-
--color-navbutton-bg-100: hsla(0, 0%, 0%, 0.06);
|
5054
|
-
--color-navbutton-bg-100-hover: hsla(0, 0%, 0%, 0.12); }
|
5055
|
-
|
5056
|
-
[data-theme="dark-ui"], .dark-ui {
|
5057
|
-
--sd-colour-test-1: hsl(308, 71%, 40%);
|
5058
|
-
--sd-colour-test-2: hsl(9, 59%, 49%);
|
5059
|
-
--sd-colour-background__main-list: hsla(0, 0%, 12%, 1);
|
5060
|
-
--sd-colour-background__base--00: hsla(0, 0%, 0%, 1);
|
5061
|
-
--sd-colour-background__base--10: hsla(0, 0%, 10%, 1);
|
5062
|
-
--sd-colour-background__base--20: hsla(0, 0%, 20%, 1);
|
5063
|
-
--sd-colour-background__base--30: hsla(0, 0%, 30%, 1);
|
5064
|
-
--color-text: hsla(0, 0%, 96%, 1);
|
5065
|
-
--color-text-light: hsla(214, 13%, 96%, 0.75);
|
5066
|
-
--color-text-lighter: hsla(214, 13%, 96%, 0.55);
|
5067
|
-
--color-icon-default: hsla(214, 13%, 96%, 0.45);
|
5068
|
-
--sd-slugline-color: hsla(197, 60%, 75%, 1);
|
5069
|
-
--color-label-text: hsla(214, 13%, 80%, 1);
|
5070
|
-
--color-input-bg: hsla(214, 13%, 80%, 0.08);
|
5071
|
-
--color-input-bg--hover: hsla(214, 13%, 70%, 0.12);
|
5072
|
-
--color-input-bg--focus: var(--sd-colour-interactive--alpha-20);
|
5073
|
-
--color-input-border: hsla(214, 13%, 80%, 0.2);
|
5074
|
-
--color-input-border-hover: hsla(214, 13%, 80%, 0.5);
|
5075
|
-
--color-form-bg: hsla(0, 0%, 23%, 1);
|
5076
|
-
--color-checkbox-border: hsla(0, 0%, 100%, 0.2);
|
5077
|
-
--color-checkbox-border-hover: hsla(0, 0%, 100%, 0.4);
|
5078
|
-
--color-selected-bg: hsla(200, 5%, 22%, 1);
|
5079
|
-
--color-selected-bg--hover: hsla(202, 9%, 25%, 1);
|
5080
|
-
--color-bg-00: hsla(0, 0%, 7%, 1);
|
5081
|
-
--color-bg-50: hsla(0, 0%, 25%, 1);
|
5082
|
-
--color-bg-100: hsla(0, 0%, 23%, 1);
|
5083
|
-
--color-bg-150: hsla(0, 0%, 19%, 1);
|
5084
|
-
--color-bg-200: hsla(0, 0%, 28%, 1);
|
5085
|
-
--color-bg-800: hsla(0, 0%, 13%, 1);
|
5086
|
-
--color-kanban-border: hsla(0, 0%, 56%, 1);
|
5087
|
-
--color-inset-search-bg: hsla(0, 0%, 0%, 0.2);
|
5088
|
-
--color-inset-search-border: hsla(0, 0%, 100%, 0.35);
|
5089
|
-
--color-inset-search-border-hover: hsla(0, 0%, 100%, 0.55);
|
5090
|
-
--color-grid-item-Bg: hsla(0, 0%, 20%, 1);
|
5091
|
-
--color-dropdown-menu-text: hsla(0, 0%, 90%, 1);
|
5092
|
-
--color-navbutton-dropdown-open-bg: hsla(0, 0%, 16%, 1);
|
5093
|
-
--color-border-line--light: hsla(0, 0%, 100%, 0.1);
|
5094
|
-
--color-border-line--medium: hsla(0, 0%, 100%, 0.2);
|
5095
|
-
--color-subnav-bg--00: hsla(0, 0%, 16%, 1);
|
5096
|
-
--color-subnav-bg--10: hsla(0, 0%, 32%, 1);
|
5097
|
-
--color-subnav-bg--blueGrey-00: hsla(200, 18%, 46%, 1);
|
5098
|
-
--color-subnav-bg--blueGrey-10: hsla(200, 18%, 37%, 1);
|
5099
|
-
--color-navbutton-bg-hover: hsla(0, 0%, 0%, 0.1);
|
5100
|
-
--color-navbutton-bg-active: hsla(0, 0%, 100%, 0.08);
|
5101
|
-
--color-navbutton-bg-100: hsla(0, 0%, 0%, 0.1);
|
5102
|
-
--color-navbutton-bg-100-hover: hsla(0, 0%, 0%, 0.2); }
|
5103
|
-
[data-theme="dark-ui"] [class^="big-icon--"],
|
5104
|
-
[data-theme="dark-ui"] [class*=" big-icon--"], .dark-ui [class^="big-icon--"],
|
5105
|
-
.dark-ui [class*=" big-icon--"] {
|
5106
|
-
color: var(--color-text); }
|
5107
|
-
|
5108
4305
|
.red--100 {
|
5109
4306
|
background-color: #fde4e2; }
|
5110
4307
|
|
@@ -7385,329 +6582,6 @@ pre[class*="language-"] {
|
|
7385
6582
|
.text-blue-grey--500 {
|
7386
6583
|
color: #607c8a; }
|
7387
6584
|
|
7388
|
-
.sd-top-menu .navbtn, .sd-top-menu .sd-navbtn, #top-menu .navbtn, #top-menu .sd-navbtn {
|
7389
|
-
--color-navbutton-border: hsla(214, 13%, 70%, 0.1) !important;
|
7390
|
-
--sd-colour-line--x-light: hsla(214, 13%, 70%, 0.1) !important; }
|
7391
|
-
|
7392
|
-
[data-theme="accessible-light-ui"] {
|
7393
|
-
--font-size-large: 1.5rem;
|
7394
|
-
--color-accessible-text: hsla(0, 0%, 7%, 1);
|
7395
|
-
--sd-slugline-color: hsla(241, 100%, 50%, 1);
|
7396
|
-
--color-input-bg: hsla(0, 0%, 0%, 0.05);
|
7397
|
-
--color-input-bg--hover: hsla(0, 0%, 0%, 0.08);
|
7398
|
-
--color-input-bg--focus: hsla(198, 49%, 58%, 0.14);
|
7399
|
-
--color-label-text: hsla(0, 0%, 25%, 1);
|
7400
|
-
--color-input-border: hsla(0, 0%, 0%, 0.35);
|
7401
|
-
--color-input-border-hover: hsla(0, 0%, 0%, 0.8);
|
7402
|
-
--color-form-bg: hsla(0, 0%, 100%, 0);
|
7403
|
-
--color-text: hsla(0, 0%, 0%, 1);
|
7404
|
-
--color-selected-bg: hsla(196, 35%, 94%, 1);
|
7405
|
-
--color-selected-bg--hover: hsl(198, 36%, 91%, 1);
|
7406
|
-
--color-bg-00: hsla(0, 0%, 100%, 1);
|
7407
|
-
--color-bg-50: hsla(0, 0%, 97%, 1);
|
7408
|
-
--color-bg-100: hsla(0, 0%, 93%, 1);
|
7409
|
-
--color-bg-150: hsla(0, 0%, 87%, 1);
|
7410
|
-
--color-bg-200: hsla(0, 0%, 63%, 1);
|
7411
|
-
--color-bg-800: hsla(0, 0%, 17%, 1);
|
7412
|
-
--color-accessible-primary: hsla(241, 100%, 50%, 1); }
|
7413
|
-
[data-theme="accessible-light-ui"] [class^="icon-"],
|
7414
|
-
[data-theme="accessible-light-ui"] [class*=" icon-"],
|
7415
|
-
[data-theme="accessible-light-ui"] [class^="big-icon--"],
|
7416
|
-
[data-theme="accessible-light-ui"] [class*=" big-icon--"] {
|
7417
|
-
color: black; }
|
7418
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style {
|
7419
|
-
color: #121212; }
|
7420
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style.checked,
|
7421
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style[checked="checked"] {
|
7422
|
-
background-color: var(--color-accessible-primary);
|
7423
|
-
border-color: var(--color-accessible-primary);
|
7424
|
-
border-top-color: #020156;
|
7425
|
-
color: white; }
|
7426
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style.checked:hover,
|
7427
|
-
[data-theme="accessible-light-ui"] .sd-checkbox--button-style[checked="checked"]:hover {
|
7428
|
-
background-color: #030165;
|
7429
|
-
border-color: #030165;
|
7430
|
-
border-top-color: #010038; }
|
7431
|
-
[data-theme="accessible-light-ui"] .sd-create-btn .circle {
|
7432
|
-
background-color: var(--color-accessible-primary); }
|
7433
|
-
[data-theme="accessible-light-ui"] .navbtn.navbtn--active {
|
7434
|
-
background-color: #454545;
|
7435
|
-
color: #fff; }
|
7436
|
-
[data-theme="accessible-light-ui"] .btn {
|
7437
|
-
color: var(--color-accessible-text);
|
7438
|
-
font-weight: 600;
|
7439
|
-
font-size: 1.4rem; }
|
7440
|
-
[data-theme="accessible-light-ui"] .btn.btn--primary {
|
7441
|
-
background-color: var(--color-accessible-primary);
|
7442
|
-
color: #fff; }
|
7443
|
-
[data-theme="accessible-light-ui"] .btn.btn--hollow {
|
7444
|
-
background-color: #fff; }
|
7445
|
-
[data-theme="accessible-light-ui"] .sd-list-item {
|
7446
|
-
font-size: 1.5rem; }
|
7447
|
-
[data-theme="accessible-light-ui"] .sd-list-item .sd-list-item__slugline {
|
7448
|
-
font-size: 1.3rem; }
|
7449
|
-
[data-theme="accessible-light-ui"] .sd-list-item time {
|
7450
|
-
color: #474747;
|
7451
|
-
font-weight: 400; }
|
7452
|
-
[data-theme="accessible-light-ui"] .badge {
|
7453
|
-
font-size: 1.2rem;
|
7454
|
-
line-height: 1.1em;
|
7455
|
-
font-weight: 600; }
|
7456
|
-
[data-theme="accessible-light-ui"] .side-panel {
|
7457
|
-
background-color: #fff;
|
7458
|
-
color: var(--color-accessible-text); }
|
7459
|
-
[data-theme="accessible-light-ui"] .side-panel .side-panel__header {
|
7460
|
-
background-color: #fff; }
|
7461
|
-
[data-theme="accessible-light-ui"] .side-panel .side-panel__heading {
|
7462
|
-
font-weight: 500;
|
7463
|
-
color: var(--color-accessible-text); }
|
7464
|
-
[data-theme="accessible-light-ui"] .side-panel p {
|
7465
|
-
font-size: 1.6rem;
|
7466
|
-
line-height: 1.5;
|
7467
|
-
color: var(--color-accessible-text); }
|
7468
|
-
[data-theme="accessible-light-ui"] .side-panel .sd-text__date-and-author {
|
7469
|
-
font-size: 1.4rem; }
|
7470
|
-
[data-theme="accessible-light-ui"] .side-panel .sd-text__date-and-author time {
|
7471
|
-
font-weight: 400;
|
7472
|
-
color: #595959; }
|
7473
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui {
|
7474
|
-
background-color: var(--color-bg-800);
|
7475
|
-
color: #fff; }
|
7476
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui i[class^="icon-"] {
|
7477
|
-
color: #fff; }
|
7478
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .side-panel__header {
|
7479
|
-
background-color: var(--color-bg-800);
|
7480
|
-
color: #fff !important; }
|
7481
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .side-panel__header i[class^="icon-"] {
|
7482
|
-
color: #fff !important; }
|
7483
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__label {
|
7484
|
-
font-weight: 600;
|
7485
|
-
font-size: 1.2rem; }
|
7486
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__input,
|
7487
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__select {
|
7488
|
-
font-size: 1.5rem; }
|
7489
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__hint,
|
7490
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__message {
|
7491
|
-
font-size: 1.4rem;
|
7492
|
-
margin: 0.8rem 0; }
|
7493
|
-
[data-theme="accessible-light-ui"] .sd-input .sd-input__hint {
|
7494
|
-
color: #454545; }
|
7495
|
-
[data-theme="accessible-light-ui"] .form-label {
|
7496
|
-
font-size: 1.2rem;
|
7497
|
-
font-weight: 500; }
|
7498
|
-
[data-theme="accessible-light-ui"] .form-label.form-label--light {
|
7499
|
-
color: #525252; }
|
7500
|
-
[data-theme="accessible-light-ui"] .navbtn {
|
7501
|
-
color: #111; }
|
7502
|
-
[data-theme="accessible-light-ui"] .navbtn [class^="icon-"], [data-theme="accessible-light-ui"] .navbtn [class*=" icon-"] {
|
7503
|
-
color: currentColor; }
|
7504
|
-
[data-theme="accessible-light-ui"] .dropdown__menu-label {
|
7505
|
-
font-size: 1.2rem;
|
7506
|
-
color: #595959; }
|
7507
|
-
[data-theme="accessible-light-ui"] .dropdown__toggle:active,
|
7508
|
-
[data-theme="accessible-light-ui"] .dropdown.open .dropdown__toggle {
|
7509
|
-
color: var(--color-accessible-primary); }
|
7510
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn),
|
7511
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button),
|
7512
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn),
|
7513
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button) {
|
7514
|
-
font-size: 1.5rem;
|
7515
|
-
font-weight: 500;
|
7516
|
-
color: currentColor; }
|
7517
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):hover,
|
7518
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):focus,
|
7519
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover,
|
7520
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus,
|
7521
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):hover,
|
7522
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):focus,
|
7523
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover,
|
7524
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus {
|
7525
|
-
background: var(--color-accessible-primary);
|
7526
|
-
color: #fff; }
|
7527
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):hover > i[class^="icon-"],
|
7528
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li a:not(.btn):focus > i[class^="icon-"],
|
7529
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover > i[class^="icon-"],
|
7530
|
-
[data-theme="accessible-light-ui"] .dropdown__menu li button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus > i[class^="icon-"],
|
7531
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):hover > i[class^="icon-"],
|
7532
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item a:not(.btn):focus > i[class^="icon-"],
|
7533
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):hover > i[class^="icon-"],
|
7534
|
-
[data-theme="accessible-light-ui"] .dropdown__menu .dropdown__menu-item button:not(.btn):not(.dropdown__menu-close):not(.toggle-button):focus > i[class^="icon-"] {
|
7535
|
-
color: #fff; }
|
7536
|
-
[data-theme="accessible-light-ui"] .dropdown.open .navbtn > i {
|
7537
|
-
color: var(--color-accessible-primary); }
|
7538
|
-
[data-theme="accessible-light-ui"] .sd-text__slugline,
|
7539
|
-
[data-theme="accessible-light-ui"] p.sd-text__slugline {
|
7540
|
-
color: var(--color-accessible-primary) !important; }
|
7541
|
-
[data-theme="accessible-light-ui"] .toggle-box--circle .toggle-box__chevron {
|
7542
|
-
background-color: rgba(122, 122, 122, 0.5);
|
7543
|
-
height: 2rem;
|
7544
|
-
width: 2rem; }
|
7545
|
-
[data-theme="accessible-light-ui"] .toggle-box__label {
|
7546
|
-
font-size: 1.4rem;
|
7547
|
-
color: var(--color-label-text);
|
7548
|
-
font-weight: 500; }
|
7549
|
-
[data-theme="accessible-light-ui"] .sd-grid-item time {
|
7550
|
-
color: #474747;
|
7551
|
-
font-size: 1.3rem;
|
7552
|
-
font-weight: 400; }
|
7553
|
-
[data-theme="accessible-light-ui"] .sd-grid-item .sd-grid-item__slugline {
|
7554
|
-
font-size: 1.2rem; }
|
7555
|
-
[data-theme="accessible-light-ui"] .nav-tabs .nav-tabs__link {
|
7556
|
-
font-size: 1.6rem;
|
7557
|
-
font-weight: 500; }
|
7558
|
-
[data-theme="accessible-light-ui"] .nav-tabs--big .nav-tabs__link {
|
7559
|
-
font-size: 2rem; }
|
7560
|
-
[data-theme="accessible-light-ui"] .nav-tabs__tab--active .nav-tabs__link,
|
7561
|
-
[data-theme="accessible-light-ui"] .nav-tabs__tab--active:hover .nav-tabs__link {
|
7562
|
-
border-bottom-color: var(--color-accessible-primary);
|
7563
|
-
color: var(--color-accessible-text); }
|
7564
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab .nav-tabs__link {
|
7565
|
-
border-bottom-color: transparent;
|
7566
|
-
color: #fff;
|
7567
|
-
opacity: 0.6; }
|
7568
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab:hover .nav-tabs__link {
|
7569
|
-
border-bottom-color: rgba(255, 255, 255, 0.25);
|
7570
|
-
opacity: 1; }
|
7571
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab.nav-tabs__tab--active .nav-tabs__link, [data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .nav-tabs__tab.nav-tabs__tab--active:hover .nav-tabs__link {
|
7572
|
-
border-bottom-color: #4d4dff;
|
7573
|
-
color: #fff;
|
7574
|
-
opacity: 1; }
|
7575
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .toggle-box__label {
|
7576
|
-
color: #fff; }
|
7577
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui .sd-line-input .sd-line-input__label {
|
7578
|
-
color: #fff;
|
7579
|
-
opacity: 0.7; }
|
7580
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui a.text-link.text-link--white {
|
7581
|
-
color: #fff;
|
7582
|
-
opacity: 0.75; }
|
7583
|
-
[data-theme="accessible-light-ui"] .side-panel.side-panel--dark-ui a.text-link.text-link--white:hover {
|
7584
|
-
opacity: 1; }
|
7585
|
-
[data-theme="accessible-light-ui"] .badge.badge--primary {
|
7586
|
-
background-color: var(--color-accessible-primary); }
|
7587
|
-
[data-theme="accessible-light-ui"] .badge.badge--success {
|
7588
|
-
background-color: #006115; }
|
7589
|
-
[data-theme="accessible-light-ui"] .badge.badge--warning {
|
7590
|
-
background-color: #854900; }
|
7591
|
-
[data-theme="accessible-light-ui"] .sd-sidebar-menu__btn--active,
|
7592
|
-
[data-theme="accessible-light-ui"] .sd-sidebar-menu__btn--active:hover {
|
7593
|
-
background-color: var(--color-accessible-primary); }
|
7594
|
-
|
7595
|
-
.test-div {
|
7596
|
-
height: 4rem;
|
7597
|
-
display: flex;
|
7598
|
-
flex-direction: row; }
|
7599
|
-
.test-div div {
|
7600
|
-
flex-grow: 1;
|
7601
|
-
height: 100%; }
|
7602
|
-
|
7603
|
-
.test-div--1 {
|
7604
|
-
background-color: var(--sd-colour-neutral); }
|
7605
|
-
|
7606
|
-
.test-div--2 {
|
7607
|
-
background-color: var(--sd-colour-neutral--hover); }
|
7608
|
-
|
7609
|
-
.test-div--3 {
|
7610
|
-
background-color: var(--sd-colour-neutral--active); }
|
7611
|
-
|
7612
|
-
.test-div--4 {
|
7613
|
-
background-color: var(--sd-colour-primary); }
|
7614
|
-
|
7615
|
-
.test-div--5 {
|
7616
|
-
background-color: var(--sd-colour-primary--hover); }
|
7617
|
-
|
7618
|
-
.test-div--6 {
|
7619
|
-
background-color: var(--sd-colour-primary--active); }
|
7620
|
-
|
7621
|
-
.test-div--7 {
|
7622
|
-
background-color: var(--sd-colour-success); }
|
7623
|
-
|
7624
|
-
.test-div--8 {
|
7625
|
-
background-color: var(--sd-colour-success--hover); }
|
7626
|
-
|
7627
|
-
.test-div--9 {
|
7628
|
-
background-color: var(--sd-colour-success--active); }
|
7629
|
-
|
7630
|
-
.test-div--10 {
|
7631
|
-
background-color: var(--sd-colour-alert); }
|
7632
|
-
|
7633
|
-
.test-div--11 {
|
7634
|
-
background-color: var(--sd-colour-alert--hover); }
|
7635
|
-
|
7636
|
-
.test-div--12 {
|
7637
|
-
background-color: var(--sd-colour-alert--active); }
|
7638
|
-
|
7639
|
-
.test-div--13 {
|
7640
|
-
background-color: var(--sd-colour-warning); }
|
7641
|
-
|
7642
|
-
.test-div--14 {
|
7643
|
-
background-color: var(--sd-colour-warning--hover); }
|
7644
|
-
|
7645
|
-
.test-div--15 {
|
7646
|
-
background-color: var(--sd-colour-warning--active); }
|
7647
|
-
|
7648
|
-
.test-div--16 {
|
7649
|
-
background-color: var(--sd-colour-highlight); }
|
7650
|
-
|
7651
|
-
.test-div--17 {
|
7652
|
-
background-color: var(--sd-colour-highlight--hover); }
|
7653
|
-
|
7654
|
-
.test-div--18 {
|
7655
|
-
background-color: var(--sd-colour-highlight--active); }
|
7656
|
-
|
7657
|
-
.test-div--19-1 {
|
7658
|
-
background-color: white; }
|
7659
|
-
|
7660
|
-
.test-div--19-2 {
|
7661
|
-
background-color: var(--sd-colour-bg--00); }
|
7662
|
-
|
7663
|
-
.test-div--20-1 {
|
7664
|
-
background-color: #f3f5f6; }
|
7665
|
-
|
7666
|
-
.test-div--20-2 {
|
7667
|
-
background-color: var(--sd-colour-bg--01); }
|
7668
|
-
|
7669
|
-
.test-div--21-1 {
|
7670
|
-
background-color: #e8eaed; }
|
7671
|
-
|
7672
|
-
.test-div--21-2 {
|
7673
|
-
background-color: var(--sd-colour-bg--02); }
|
7674
|
-
|
7675
|
-
.test-div--22-1 {
|
7676
|
-
background-color: #d4d8de; }
|
7677
|
-
|
7678
|
-
.test-div--22-2 {
|
7679
|
-
background-color: var(--sd-colour-bg--03); }
|
7680
|
-
|
7681
|
-
.test-div--23-1 {
|
7682
|
-
background-color: #c5cbd3; }
|
7683
|
-
|
7684
|
-
.test-div--23-2 {
|
7685
|
-
background-color: var(--sd-colour-bg--04); }
|
7686
|
-
|
7687
|
-
.test-div--24-1 {
|
7688
|
-
background-color: #b7bec8; }
|
7689
|
-
|
7690
|
-
.test-div--24-2 {
|
7691
|
-
background-color: var(--sd-colour-bg--05); }
|
7692
|
-
|
7693
|
-
.test-div--25-1 {
|
7694
|
-
background-color: #a9b1bc; }
|
7695
|
-
|
7696
|
-
.test-div--25-2 {
|
7697
|
-
background-color: var(--sd-colour-bg--06); }
|
7698
|
-
|
7699
|
-
.test-div--26-1 {
|
7700
|
-
background-color: #9aa4b1; }
|
7701
|
-
|
7702
|
-
.test-div--26-2 {
|
7703
|
-
background-color: var(--sd-colour-bg--07); }
|
7704
|
-
|
7705
|
-
.test-div--27-1 {
|
7706
|
-
background-color: #8c97a6; }
|
7707
|
-
|
7708
|
-
.test-div--27-2 {
|
7709
|
-
background-color: var(--sd-colour-bg--08); }
|
7710
|
-
|
7711
6585
|
@font-face {
|
7712
6586
|
font-family: 'sd_big-icons';
|
7713
6587
|
src: url(sd_big-icons.eot);
|