@orfeas126/box-ui-elements
Version:
Box UI Elements
1 lines • 44.7 kB
Source Map (JSON)
{"version":3,"file":"metadata-sidebar.css","mappings":"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","sources":["webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/EmptyContent.scss","webpack://@orfeas126/box-ui-elements/./src/components/collapsible/Collapsible.scss","webpack://@orfeas126/box-ui-elements/./src/styles/constants/_layout.scss","webpack://@orfeas126/box-ui-elements/./src/styles/mixins/_animation.scss","webpack://@orfeas126/box-ui-elements/./src/styles/constants/_animation.scss","webpack://@orfeas126/box-ui-elements/./src/styles/constants/_colors.scss","webpack://@orfeas126/box-ui-elements/./src/components/toggle/Toggle.scss","webpack://@orfeas126/box-ui-elements/./src/components/radio/RadioButton.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/CascadePolicy.scss","webpack://@orfeas126/box-ui-elements/./src/components/text-input/TextInput.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-fields/TextMetadataField.scss","webpack://@orfeas126/box-ui-elements/./src/components/select-button/SelectButton.scss","webpack://@orfeas126/box-ui-elements/./src/components/search-form/SearchForm.scss","webpack://@orfeas126/box-ui-elements/./src/components/select-field/SelectField.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-fields/EnumMetadataField.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-fields/DateMetadataField.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-fields/MultiSelectMetadataField.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-fields/ReadOnlyMetadataField.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/TemplatedInstance.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/CustomInstanceNewField.scss","webpack://@orfeas126/box-ui-elements/./src/components/button-group/ButtonGroup.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-fields/CustomMetadataField.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/MetadataInstanceConfirmDialog.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/Footer.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/Instance.scss","webpack://@orfeas126/box-ui-elements/./src/styles/mixins/_layout.scss","webpack://@orfeas126/box-ui-elements/./src/features/metadata-instance-editor/TemplateDropdown.scss","webpack://@orfeas126/box-ui-elements/./src/styles/_inputs.scss","webpack://@orfeas126/box-ui-elements/./src/elements/content-sidebar/MetadataSidebar.scss"],"sourcesContent":[".metadata-instance-editor-no-instances {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n align-items: center;\n justify-content: center;\n text-align: center;\n\n svg {\n margin-left: -5px;\n }\n\n .icon-add-metadata-empty-state {\n height: 105px;\n }\n}\n\n.metadata-instance-editor-no-instances--call-out {\n margin: 20px 0 10px;\n font-weight: bold;\n}\n\n.metadata-instance-editor-no-instances--how-add-template {\n width: 200px;\n}\n","@import '../../styles/variables';\n\n.collapsible-card {\n // no overflow hidden sticky header\n border-radius: $bdl-border-radius-size;\n\n .collapsible-card-header {\n position: relative; // for action items\n display: flex;\n flex-direction: row;\n align-items: center;\n width: 100%;\n border-radius: $bdl-border-radius-size;\n\n &.has-sticky-header {\n position: sticky;\n top: 0; // required by sticky position\n z-index: 1; // required by sticky position\n }\n\n .bdl-Collapsible-actionItems {\n display: none;\n }\n\n &:hover {\n .btn-plain.collapsible-card-title {\n text-decoration: underline;\n }\n\n .bdl-Collapsible-actionItems {\n display: block;\n }\n }\n }\n\n .collapsible-card-action-items {\n position: absolute;\n right: 34px;\n bottom: 0;\n }\n\n .collapsible-card-header-caret {\n @include bdl-transition($bdl-transitionDurationBase, transform);\n\n position: absolute;\n right: 0;\n }\n\n .btn-plain.collapsible-card-title {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n padding: 10px 0;\n text-align: left;\n\n &:focus {\n text-decoration: underline;\n\n + .bdl-Collapsible-actionItems {\n display: block;\n }\n }\n }\n\n .collapsible-card-content {\n padding: 10px 0;\n }\n\n &.is-open {\n .collapsible-card-header-caret {\n transform: rotateZ(180deg);\n }\n\n .collapsible-card-header {\n &:hover {\n .btn-plain.collapsible-card-title {\n text-decoration: none;\n }\n }\n\n .bdl-Collapsible-actionItems {\n display: block;\n }\n }\n\n .btn-plain.collapsible-card-title {\n &:focus {\n text-decoration: none;\n }\n\n + .bdl-Collapsible-actionItems {\n display: block;\n }\n }\n }\n\n &.is-bordered {\n border: 1px solid $bdl-gray-10;\n\n .collapsible-card-header {\n background-color: $white;\n }\n\n .btn-plain.collapsible-card-title,\n .collapsible-card-content {\n padding: 10px;\n }\n\n &.is-open .btn-plain.collapsible-card-title {\n border-bottom: 1px solid $bdl-gray-10;\n }\n\n .collapsible-card-header-caret {\n right: 10px;\n }\n }\n\n &:not(.is-bordered) {\n .bdl-PlainButton.collapsible-card-title,\n .btn-plain.collapsible-card-title {\n border-bottom: 1px solid $bdl-gray-10;\n\n &:hover,\n &:active,\n &:focus {\n text-decoration: none;\n border-bottom-color: $bdl-box-blue;\n }\n }\n }\n}\n","// Z-Indexes\n$modal-dialog-z-index: 160 !default;\n$menu-z-index: 170 !default;\n$submenu-z-index: 171 !default;\n$overlay-z-index: 190 !default;\n$tooltip-z-index: 190 !default;\n$notifications-wrapper-z-index: 200 !default;\n\n// Borders\n$bdl-border-radius-size: 4px;\n$bdl-border-radius-size-med: $bdl-border-radius-size * 1.5;\n$bdl-border-radius-size-large: $bdl-border-radius-size * 2;\n$bdl-border-radius-size-xlarge: $bdl-border-radius-size * 3;\n\n// Drop shadows\n$bdl-header-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .05);\n\n// Spacing\n$bdl-grid-unit: 4px !default;\n$bdl-grid-unit-px: 4 !default; // unitless grid unit (defined in pixels for manual multiplication in JS)\n\n// Headers\n$bdl-header-height: 64px;\n","@import '../constants/animation';\n\n@mixin bdl-transition($time-length, $properties...) {\n transition-timing-function: $bdl-timingFunction;\n transition-duration: $time-length;\n transition-property: $properties;\n}\n\n@mixin bdl-openComponentAnimation($time-length) {\n animation: fade-in $bdl-timingFunction $time-length;\n}\n\n@mixin bdl-loadingPulseAnimation($start-color, $end-color, $time-length) {\n // TODO: this will create duplicate @keyframes definitions upon each usage\n @keyframes loading-pulse {\n 0% {\n background-color: $start-color;\n }\n\n 100% {\n background-color: $end-color;\n }\n }\n\n animation: loading-pulse .5s ease-in-out infinite alternate, fade-in $time-length $bdl-timingFunction;\n}\n","$bdl-transitionDurationBase: .15s;\n$bdl-timingFunction: cubic-bezier(0, 0, .6, 1);\n","// Box Design Language Colors\n// confirm with design before extending\n\n$white: #fff !default;\n$black: #000 !default;\n$countBadgeBackground: #e9163c !default;\n\n// Box/Primary Blues\n$bdl-box-blue: #0061d5 !default;\n$bdl-box-blue-80: #3381dd !default;\n$bdl-box-blue-50: #7fb0ea !default;\n$bdl-box-blue-40: #99c0ee !default;\n$bdl-box-blue-30: #b2cff2 !default;\n$bdl-box-blue-20: #ccdff7 !default;\n$bdl-box-blue-10: #e5effa !default;\n$bdl-box-blue-05: #f2f7fd !default;\n$bdl-box-blue-02: #fafcfe !default;\n\n// Box/Primary Grays\n$bdl-gray: #222 !default;\n$bdl-gray-80: #4e4e4e !default;\n$bdl-gray-65: #6f6f6f !default;\n$bdl-gray-50: #909090 !default;\n$bdl-gray-40: #a7a7a7 !default;\n$bdl-gray-30: #bcbcbc !default;\n$bdl-gray-20: #d3d3d3 !default;\n$bdl-gray-10: #e8e8e8 !default;\n$bdl-gray-05: #f4f4f4 !default;\n$bdl-gray-02: #fbfbfb !default;\n\n// Dark Blues\n$bdl-dark-blue: #003c84 !default;\n$bdl-dark-blue-50: #7f9dc1 !default;\n$bdl-dark-blue-20: #ccd8e6 !default;\n$bdl-dark-blue-10: #e5ebf2 !default;\n$bdl-dark-blue-05: #f2f5f9 !default;\n$bdl-dark-blue-02: #fafbfd !default;\n\n// Light Blues\n$bdl-light-blue: #2486fc !default;\n$bdl-light-blue-50: #91c2fd !default;\n$bdl-light-blue-20: #d3e7fe !default;\n$bdl-light-blue-10: #e9f2fe !default;\n$bdl-light-blue-05: #f4f9ff !default;\n$bdl-light-blue-02: #fbfdff !default;\n\n// Yelloranges\n$bdl-yellorange: #f5b31b !default;\n$bdl-yellorange-50: #fad98d !default;\n$bdl-yellorange-20: #fdf0d1 !default;\n$bdl-yellorange-10: #fef7e8 !default;\n$bdl-yellorange-05: #fefbf3 !default;\n$bdl-yellorange-02: #fffefb !default;\n\n// Yellows\n$bdl-yellow: #ffd700 !default;\n$bdl-yellow-50: #ffeb7f !default;\n$bdl-yellow-20: #fff7cc !default;\n$bdl-yellow-10: #fffbe5 !default;\n$bdl-yellow-05: #fffdf2 !default;\n$bdl-yellow-02: #fffefa !default;\n\n// Green Lights\n$bdl-green-light: #26c281 !default;\n$bdl-green-light-50: #92e0c0 !default;\n$bdl-green-light-20: #d4f3e6 !default;\n$bdl-green-light-10: #e9f8f2 !default;\n$bdl-green-light-05: #f4fcf8 !default;\n$bdl-green-light-02: #fbfefd !default;\n\n// Grimaces\n$bdl-grimace: #4826c2 !default;\n$bdl-grimace-50: #a392e0 !default;\n$bdl-grimace-20: #dad4f3 !default;\n$bdl-grimace-10: #ece9f8 !default;\n$bdl-grimace-05: #f6f4fc !default;\n$bdl-grimace-02: #fbfbfe !default;\n\n// Orange\n$bdl-orange: #f1811a !default;\n$bdl-orange-50: #f8c08c !default;\n$bdl-orange-20: #fce6d1 !default;\n$bdl-orange-10: #fdf2e8 !default;\n$bdl-orange-05: #fef8f3 !default;\n$bdl-orange-02: #fffdfb !default;\n\n// Purple Rains\n$bdl-purple-rain: #9f3fed !default;\n$bdl-purple-rain-50: #cf9ff6 !default;\n$bdl-purple-rain-20: #ecd9fb !default;\n$bdl-purple-rain-10: #f5ebfd !default;\n$bdl-purple-rain-05: #faf5fe !default;\n$bdl-purple-rain-02: #fdfbff !default;\n\n// Watermelon Reds\n$bdl-watermelon-red: #ed3757 !default;\n$bdl-watermelon-red-50: #f69bab !default;\n$bdl-watermelon-red-20: #fbd7dd !default;\n$bdl-watermelon-red-10: #fdebee !default;\n$bdl-watermelon-red-05: #fef5f6 !default;\n$bdl-watermelon-red-02: #fffbfc !default;\n","@import '../../styles/variables';\n\n/**************************************\n * Toggle\n **************************************/\n\n.toggle-container {\n margin: 0 0 20px;\n\n .toggle-label {\n display: inline-block;\n margin: 5px 10px;\n line-height: 15px;\n vertical-align: top;\n }\n}\n\n.bdl-Toggle {\n display: none;\n\n &,\n &::after,\n &::before,\n *,\n *::after,\n *::before,\n & + .toggle-btn {\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n\n &::selection {\n background: none;\n }\n }\n\n + .toggle-btn {\n position: relative;\n display: inline-block;\n width: 50px;\n height: 24px;\n margin: 1px 0;\n padding: 2px;\n background: $bdl-gray-30;\n border-radius: 40px;\n outline: 0;\n cursor: pointer;\n transition: left .4s ease, background .4s ease;\n\n &::after,\n &::before {\n position: relative;\n display: block;\n width: 26px;\n content: '';\n }\n\n &::after {\n top: -3px;\n left: -3px;\n height: 26px;\n background: $white;\n border: 1px solid $bdl-gray-65;\n border-radius: 50%;\n box-shadow: 0 1px 2px fade-out($black, .9);\n transition: left .2s ease, background .2s ease;\n }\n\n &::before {\n display: none;\n }\n }\n\n &:checked {\n + .toggle-btn {\n background: $primary-color;\n\n &::after {\n left: 50%;\n }\n }\n }\n}\n\n/**********************************************************\n * A simpler version of toggle that does not use ids\n * Eventually we should remove the webapp specific version\n **********************************************************/\n$height: 20px;\n$width: $height * 2;\n\n.toggle-simple {\n position: relative;\n display: flex;\n width: $width;\n height: $height;\n border-radius: $height;\n outline: none;\n user-select: none;\n\n .is-toggle-right-aligned & {\n width: 100%;\n }\n}\n\n.toggle-simple-input {\n position: absolute;\n left: -9999px;\n opacity: 0; // this keeps the element tab-able\n}\n\n.toggle-simple-label {\n display: inline-block;\n min-width: 0;\n margin-left: $width + 6;\n white-space: nowrap;\n\n .is-toggle-right-aligned & {\n flex: 1;\n margin-left: auto;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n.toggle-simple-description {\n margin-top: 2px;\n margin-left: $width + 6;\n color: $bdl-gray-50;\n\n .is-toggle-right-aligned & {\n margin-right: $width + 6;\n margin-left: auto;\n }\n}\n\n.toggle-simple-switch {\n display: inline-block;\n\n // NOTE: targets ie11\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n cursor: pointer;\n }\n\n .is-toggle-right-aligned & {\n position: relative;\n width: $width;\n }\n\n &::before,\n &::after {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n display: block;\n cursor: pointer;\n content: '';\n }\n\n &::before {\n right: 0;\n background-color: $bdl-gray-30;\n border-radius: $height;\n transition: background .4s;\n }\n\n &::after {\n width: $height;\n height: $height;\n background-color: $white;\n border: 1px solid $bdl-gray-65;\n border-radius: 100%;\n transition: margin .4s;\n }\n\n .toggle-simple-input:checked ~ & {\n &::before {\n background-color: $primary-color;\n }\n\n &::after {\n margin-left: $height;\n }\n }\n\n .toggle-simple-input:disabled ~ & {\n &::before,\n &::after {\n cursor: default;\n }\n\n &::before {\n opacity: .5;\n }\n\n &::after {\n background-color: darken($white, 2%);\n border-color: lighten($bdl-gray-65, 32%);\n }\n }\n\n .toggle-simple-input:focus ~ & {\n &::after {\n border-color: $primary-color;\n }\n }\n}\n\n/*\n* Section below is for bdl-namespace backwards compatibility.\n* Do not add changes below this line.\n*/\n.toggle {\n @extend .bdl-Toggle;\n}\n","@import '../../styles/variables';\n\n/**************************************\n * Radio\n **************************************/\n\n.radio-label {\n position: relative;\n display: inline-flex;\n align-items: center;\n user-select: none;\n\n > input[type='radio'] {\n flex: none;\n width: 14px;\n height: 14px;\n margin: 0;\n opacity: 0;\n\n + span::before {\n position: absolute;\n top: 3px;\n left: 0;\n width: 14px;\n height: 14px;\n background-color: $white;\n border: 7px solid $white;\n border-radius: 9001px;\n box-shadow: 0 0 0 1px $bdl-gray-50, 0 -1px 1px rgba(0, 0, 0, .4);\n transition: border-width .1s;\n content: '';\n }\n\n &:checked + span::before {\n background-color: $primary-color;\n border: 3px solid $white;\n }\n\n &:focus + span::before {\n box-shadow: 0 0 0 2px $primary-color;\n }\n\n &:disabled + span::before {\n background-color: $bdl-gray-30;\n border-color: $bdl-gray-02;\n box-shadow: 0 0 0 1px $bdl-gray-20;\n }\n\n + span + span {\n margin-left: 10px;\n }\n\n &:disabled + span + span {\n color: $bdl-gray-30;\n }\n }\n}\n\n.radio-container {\n margin: 0 0 20px;\n}\n\n.radio-description {\n margin-top: 2px;\n margin-left: 24px;\n color: $bdl-gray-65;\n}\n","@import '../../styles/variables';\n\n$cascade-policy-background: #f1e2fd;\n\n.metadata-cascade-notice {\n margin: 10px 0;\n padding: 14px 15px;\n color: $bdl-gray;\n background-color: $cascade-policy-background;\n border: none;\n border-radius: $bdl-border-radius-size;\n}\n\n.metadata-cascade-editor {\n color: $bdl-gray;\n background-color: $bdl-gray-05;\n border: none;\n border-radius: $bdl-border-radius-size;\n\n hr {\n display: block;\n height: 1px;\n padding: 0;\n border: 0;\n border-top: 1px solid $bdl-gray-10;\n }\n\n .metadata-operation-not-immediate {\n color: $bdl-gray-65;\n font-weight: bold;\n\n svg {\n position: relative;\n top: 8px;\n margin-left: -5px;\n }\n }\n}\n\n.metadata-cascade-enable {\n margin: 10px 0;\n padding: 14px 15px;\n}\n\n.toggle-container.metadata-cascade-toggle {\n float: left;\n margin-right: 5px;\n margin-bottom: 5px;\n}\n\n.cascade-policy-text {\n clear: left;\n}\n\n.cascade-policy-learnmore-link {\n color: $bdl-box-blue;\n}\n\n.metadata-cascading-mode {\n margin: 10px 0;\n padding: 10px 15px 15px 15px;\n\n .metadata-cascading-options {\n padding: 10px;\n\n .radio-container {\n margin: 0;\n }\n }\n}\n","@import '../../styles/variables';\n\n/**************************************\n * Text Input\n **************************************/\n\n.text-input-container {\n position: relative;\n margin: 0 0 20px;\n\n .text-input-loading {\n display: inline-block;\n margin-left: -21px;\n }\n\n .text-input-verified {\n display: inline-block;\n margin-bottom: -2px;\n margin-left: -24px;\n }\n\n .bdl-Label,\n .label {\n word-wrap: break-word;\n }\n\n .text-input-description {\n color: $bdl-gray-65;\n word-wrap: break-word;\n }\n\n input {\n height: 32px;\n margin-top: 5px;\n font-family: inherit;\n\n &[type='number'] {\n -moz-appearance: textfield;\n -ms-appearance: textfield;\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n margin: 0;\n -webkit-appearance: none;\n }\n }\n }\n\n &.is-required,\n &.show-error {\n input {\n border-color: $bdl-watermelon-red;\n }\n }\n}\n","@import '../../styles/variables';\n\n.bdl-TextMetadataField {\n &.text-input-container {\n input[type='text'] {\n width: 100%;\n }\n }\n}\n","@import '../../styles/variables';\n\n.bdl-SelectButton {\n &.is-invalid {\n border-color: $bdl-watermelon-red;\n }\n}\n\n/*\n* Section below is for bdl-namespace backwards compatibility.\n* Do not add changes below this line.\n*/\n.select-button {\n @extend .bdl-SelectButton;\n}\n","@import '../../styles/variables';\n\n/**************************************\n * Search Form\n **************************************/\n\n.search-input-container {\n display: inline-block;\n min-height: 32px;\n\n .action-button {\n display: flex;\n align-items: center;\n width: 30px;\n padding: 0;\n background: none;\n border: 0;\n cursor: pointer;\n\n path {\n transition: fill linear .1s;\n }\n\n svg {\n flex: 1;\n }\n }\n\n .action-buttons,\n .search-form-loading-indicator {\n position: absolute;\n top: 0;\n bottom: 0;\n display: flex;\n }\n\n .action-buttons {\n right: 0;\n align-items: stretch;\n }\n\n .search-form-loading-indicator {\n right: 10px;\n align-items: center;\n }\n\n .clear-button {\n display: none;\n\n path:first-of-type {\n fill: $bdl-gray-40;\n }\n }\n\n .search-form.use-clear-button {\n .clear-button {\n display: flex;\n }\n\n .search-button {\n display: none;\n }\n\n &.is-empty {\n .clear-button {\n display: none;\n }\n\n .search-button {\n display: flex;\n }\n }\n }\n\n .search-input {\n padding-right: 30px;\n }\n\n .search-input:focus ~ .clear-button {\n path:first-of-type {\n fill: $bdl-gray-80;\n }\n }\n\n .search-input:focus + .search-button {\n path {\n fill: $bdl-gray-80;\n }\n }\n\n .search-form {\n position: relative;\n display: flex;\n align-items: stretch;\n }\n}\n","@import '../../styles/variables';\n\n.bdl-SelectField,\n.select-field {\n .overlay {\n min-width: 100%;\n }\n\n li[role='separator'] {\n margin: 10px 0;\n border-bottom: 1px solid $bdl-gray-20;\n }\n\n .select-field-search-container {\n width: 100%;\n padding-right: $bdl-grid-unit;\n padding-bottom: $bdl-grid-unit * 2;\n padding-left: $bdl-grid-unit;\n\n .search-input {\n width: 100%;\n }\n }\n}\n\n.select-option {\n display: flex;\n align-items: center;\n white-space: nowrap;\n border-radius: 0;\n}\n\n.select-option.is-clear-option {\n color: $box-blue;\n font-weight: bold;\n}\n\n.select-option.is-disabled {\n pointer-events: none;\n}\n\n.select-option-check-icon {\n flex: none;\n width: 20px;\n height: 16px;\n margin-left: -5px;\n text-align: left;\n}\n\n.bdl-SelectField-overlay--scrollable {\n max-height: 340px; // show at most 12 items in the dropdown menu\n overflow-y: auto;\n}\n\n.bdl-SelectFieldDropdown {\n z-index: 4;\n min-width: 100%;\n overflow-x: hidden;\n border-radius: $bdl-border-radius-size-med;\n\n &[data-placement='bottom-start'] {\n margin-top: $bdl-grid-unit * 2;\n }\n\n &[data-placement='top-start'] {\n margin-bottom: $bdl-grid-unit * 2;\n }\n}\n\n.bdl-SelectField-optionText {\n overflow-x: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n","@import '../../styles/variables';\n\n.bdl-EnumMetadataField {\n margin: 0 0 20px;\n\n .bdl-Label,\n .label {\n word-wrap: break-word;\n }\n\n label .select-container {\n display: block;\n\n .datalist-item.select-option:first-child {\n color: $bdl-gray-65;\n\n .select-option-check-icon {\n visibility: hidden;\n }\n }\n }\n\n .bdl-EnumMetadataField-desc {\n display: inline-block;\n margin-bottom: 5px;\n color: $bdl-gray-65;\n word-wrap: break-word;\n }\n}\n","@import '../../styles/variables';\n\n.bdl-DateMetadataField {\n .date-picker-icon-holder {\n width: 100%;\n\n .date-picker-input {\n width: 100%;\n }\n }\n}\n","@import '../../styles/variables';\n\n.bdl-MultiSelectMetadataField {\n margin: 0 0 20px;\n\n .label {\n word-wrap: break-word;\n }\n\n label .select-container {\n display: block;\n\n .select-button {\n z-index: inherit;\n }\n }\n}\n\n.bdl-MultiSelectMetadataField-desc {\n display: inline-block;\n margin-bottom: 5px;\n color: $bdl-gray-65;\n word-wrap: break-word;\n}\n","@import '../../styles/variables';\n\n.bdl-ReadOnlyMetadataField {\n margin: 0 0 20px;\n word-wrap: break-word;\n\n &:last-child {\n margin-bottom: 0;\n }\n\n .bdl-CustomMetadataField:not(:last-child) & {\n margin-bottom: 20px;\n }\n\n dt {\n color: $bdl-gray-65;\n }\n\n dd {\n line-height: 16px;\n }\n\n .bdl-ReadOnlyMetadataField-desc {\n color: $bdl-gray-65;\n }\n}\n",".metadata-instance-editor-instance {\n .attributes-hidden-message {\n font-style: italic;\n text-align: center;\n }\n\n .no-attributes-message {\n font-style: italic;\n text-align: center;\n }\n\n .bdl-SelectField {\n .bdl-SelectFieldDropdown {\n max-width: 100%;\n }\n }\n}\n","@import '../../styles/variables';\n\n.custom-new-field {\n padding: 10px 25px 20px;\n background-color: $bdl-gray-10;\n border-radius: $bdl-border-radius-size;\n\n .text-input-container {\n flex: 1;\n margin: 10px 0;\n\n input[type='text'] {\n width: 100%;\n }\n }\n\n .custom-new-field-header {\n display: flex;\n align-items: center;\n\n h5 {\n margin: 8px 5px 8px 0;\n font-size: 14px;\n }\n\n > div {\n display: flex;\n }\n }\n}\n\n.custom-new-field-actions {\n margin: 20px 0 0;\n text-align: right;\n\n .btn {\n margin: 0 0 0 10px;\n }\n}\n","@import '../../styles/variables';\n\n/**************************************\n * Button Group\n **************************************/\n\n.bdl-ButtonGroup {\n position: relative;\n\n .toggle-overlay {\n display: inline;\n\n > .btn,\n > .bdl-targeted-click-through > .btn {\n margin-left: 0;\n padding-right: 11px;\n padding-left: 11px;\n border-radius: 0 $bdl-border-radius-size-med $bdl-border-radius-size-med 0;\n\n &.btn-primary {\n border-left-color: darken($primary-color, 10%);\n }\n }\n\n .icon-caret-down {\n &::after {\n content: '';\n }\n\n path {\n fill: $white;\n }\n }\n\n .overlay-wrapper {\n position: static;\n\n .overlay {\n left: 0;\n }\n }\n }\n\n &,\n & > .bdl-targeted-click-through {\n > .btn {\n margin: 5px 0 5px -1px;\n border-radius: 0;\n\n &.btn-primary {\n margin: 5px 0;\n border-right-color: darken($primary-color, 10%);\n\n &.is-selected {\n color: $white;\n background-color: darken($primary-color, 8%);\n border-color: darken($primary-color, 15%);\n box-shadow: none;\n }\n\n &:last-of-type {\n border-right-color: $primary-color;\n }\n }\n }\n\n > .btn:first-child {\n border-top-left-radius: $bdl-border-radius-size-med;\n border-bottom-left-radius: $bdl-border-radius-size-med;\n }\n\n > .btn:last-child {\n border-top-right-radius: $bdl-border-radius-size-med;\n border-bottom-right-radius: $bdl-border-radius-size-med;\n }\n\n > .btn.is-selected {\n z-index: 2; /* place on top of siblings */\n color: $bdl-gray-80;\n background-color: $bdl-gray-10;\n border-color: $bdl-gray-65;\n box-shadow: none;\n }\n\n > .btn:focus {\n z-index: 3; /* place on top of all other buttons for accessibility */\n }\n }\n\n &.bdl-is-disabled,\n &.is-disabled {\n &,\n & > .bdl-targeted-click-through {\n > .btn,\n > .bdl-Button {\n color: $bdl-gray-65;\n background-color: $bdl-gray-02;\n border: 1px solid $bdl-gray-30;\n box-shadow: none;\n cursor: default;\n opacity: .4;\n }\n\n > .btn-primary {\n color: $white;\n background-color: $primary-color;\n border-color: $primary-color;\n border-right-color: darken($primary-color, 10%);\n\n &:last-of-type {\n border-right-color: $primary-color;\n }\n }\n }\n }\n}\n\n/*\n* Section below is for bdl-namespace backwards compatibility.\n* Do not add changes below this line.\n*/\n.btn-group {\n @extend .bdl-ButtonGroup;\n}\n","@import '../../styles/variables';\n\n.bdl-CustomMetadataField {\n display: flex;\n align-items: center;\n\n .text-input-container {\n flex: 1;\n overflow-x: hidden;\n\n .bdl-Label,\n .label {\n width: 100%;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n }\n\n &:last-child .bdl-ReadOnlyMetadataField {\n margin-bottom: 0;\n }\n}\n\n.bdl-CustomMetadataField-customActions {\n margin: 5px 0 0 10px;\n\n .btn {\n width: 32px;\n height: 32px;\n margin: 0 0 0 -1px;\n padding: 10px;\n\n span {\n display: flex;\n }\n }\n}\n","@import '../../styles/variables';\n\n.metadata-instance-confirm-cover {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n background-color: inherit;\n}\n\n.metadata-instance-confim-container {\n max-width: 350px;\n text-align: center;\n}\n","@import '../../styles/variables';\n\n.metadata-instance-editor-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-top: 10px;\n\n .metadata-instance-editor-footer-delete .btn-plain {\n color: $bdl-box-blue;\n }\n\n .metadata-instance-editor-footer-save-cancel .btn:last-child {\n margin-right: 0;\n }\n}\n","@import '../../styles/variables';\n\n.metadata-instance-editor {\n .collapsible-card-content {\n position: relative;\n }\n}\n\n.metadata-instance-editor-instance-title {\n display: flex;\n align-items: center;\n}\n\n.metadata-instance-editor-instance-title-text {\n margin: 0 10px;\n color: $black;\n\n &.metadata-instance-editor-instance-has-error {\n color: $bdl-watermelon-red;\n }\n}\n\n.btn-plain.metadata-instance-editor-instance-edit {\n position: absolute;\n top: 8px;\n right: 25px;\n z-index: 10;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n border-radius: $bdl-border-radius-size;\n\n &:hover svg path {\n fill: $bdl-gray;\n }\n\n &.metadata-instance-editor-instance-is-editing {\n background-color: $bdl-gray-10;\n }\n}\n","// Box sizing\n@mixin box-sizing {\n box-sizing: border-box !important;\n\n *,\n *::before,\n *::after {\n box-sizing: border-box !important;\n }\n}\n","@import '../../styles/variables';\n@import '../../styles/inputs';\n\n// Flyout is a tethered component and as such will be rendered outside the scope\n// of the parent container and may not get all box styles.\n.metadata-instance-editor-template-dropdown-flyout {\n @include box-sizing;\n\n &::before {\n border: none;\n }\n\n div.overlay {\n width: 288px;\n padding: 0;\n overflow: hidden;\n border: 1px solid $bdl-gray-30;\n border-radius: $bdl-border-radius-size-med;\n }\n\n ul.overlay {\n border: none;\n }\n\n .metadata-instance-editor-template-dropdown-menu {\n z-index: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background-color: $white;\n\n .overlay-wrapper {\n overflow: hidden;\n border-top: none;\n border-radius: 0 0 $bdl-border-radius-size-med $bdl-border-radius-size-med;\n\n // NOTE: targets ie11\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n max-height: 300px;\n }\n\n // TemplateDropdown component is wrapped under two layers of Overlay components.\n // Removing the extra transform and animation properties so it doesn't mess up safari's scroll bar.\n ul.overlay {\n transform: none;\n animation: none;\n }\n }\n\n .overlay {\n position: static;\n padding: 0;\n border-radius: 0%;\n\n .datalist-item {\n padding: 0;\n }\n }\n\n .scroll-container {\n max-height: 300px;\n }\n\n .scroll-wrap-container {\n flex-grow: 1;\n overflow-x: hidden;\n\n // NOTE: targets ie11\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n // NOTE: Avoids cutting off the last item in the list\n height: 300px;\n }\n\n &::before {\n width: 110%;\n margin: 0 -5%;\n border-radius: inherit;\n box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, .25);\n }\n\n &::after {\n width: 110%;\n border-radius: inherit;\n box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, .15);\n }\n }\n\n // input re-styling due to tethering\n .search-input-container {\n margin: 0;\n padding: 10px 12px 12px;\n border-bottom: 1px solid $bdl-gray-30;\n border-radius: $bdl-border-radius-size-med $bdl-border-radius-size-med 0 0;\n\n .action-button {\n .clear-button {\n &:focus {\n border: 1px solid $bdl-box-blue;\n }\n }\n }\n\n input[type='text'] {\n @include box-inputs;\n\n width: 100%;\n }\n\n input[type='text']:focus {\n @include box-inputs-focus;\n }\n\n input[type='text']:hover {\n @include box-inputs-hover;\n }\n }\n\n .search-button {\n pointer-events: none;\n }\n }\n\n .btn-plain.metadata-template-dropdown-select-template {\n display: flex;\n align-items: center;\n width: 100%;\n padding: 5px 35px 5px 15px;\n overflow: hidden;\n color: inherit;\n font-size: 13px;\n line-height: 20px;\n white-space: nowrap;\n text-align: inherit;\n text-overflow: ellipsis;\n\n &.metadata-template-dropdown-is-selected {\n color: $bdl-box-blue;\n }\n\n .template-display-name {\n flex: 10;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n\n .metadata-instance-editor-template-message {\n position: absolute;\n right: 0;\n width: 288px;\n padding: 16px 15px;\n color: $bdl-gray-50;\n background-color: $white;\n border: 1px solid $bdl-gray-30;\n border-top-color: transparent;\n border-radius: 0 0 $bdl-border-radius-size-med $bdl-border-radius-size-med;\n\n &.template-dropdown-loading-indicator {\n display: flex;\n justify-content: center;\n }\n }\n}\n","@import 'variables';\n\n@mixin box-inputs {\n padding: 7px;\n color: $bdl-gray;\n border: 1px solid $bdl-gray-20;\n border-radius: $bdl-border-radius-size-med;\n box-shadow: inset 0 2px 4px rgba(0, 0, 0, .1);\n transition: border-color linear .15s, box-shadow linear .1s;\n -webkit-font-smoothing: antialiased;\n}\n\n@mixin box-inputs-hover {\n box-shadow: inset 0 2px 4px rgba(0, 0, 0, .1);\n}\n\n@mixin box-inputs-focus {\n border: 1px solid $primary-color;\n outline: 0;\n}\n","@import '../common/variables';\n\n.bcs-metadata {\n .bcs-scroll-content {\n > .inline-alert {\n margin: 0 10px 10px 25px;\n }\n\n > .crawler {\n padding-top: 20px;\n }\n }\n\n .metadata-instance-editor {\n padding: 0 10px 20px 25px;\n\n .collapsible-card {\n margin-top: 10px;\n }\n }\n\n .metadata-instance-editor-template-dropdown {\n z-index: 1;\n }\n\n .metadata-instance-editor-header {\n display: none;\n }\n\n .metadata-instance-editor-field-read-only dd {\n margin: 0;\n }\n\n .metadata-instance-editor-instance-title-text {\n max-width: 210px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n .collapsible-card.is-open .metadata-instance-editor-instance-title-text {\n max-width: 190px;\n }\n}\n"],"names":[],"sourceRoot":""}