| @import '../../../elements-sk/modules/colors'; |
| |
| // TODO(jmbetancourt): wait on UX for official styling |
| skottie-slot-manager-sk { |
| .wrapper { |
| width: 100%; |
| padding: 8px; |
| |
| #wrapper-form { |
| font-size: 0; |
| } |
| |
| .no-manager { |
| .info-box { |
| display: flex; |
| color: var(--disabled); |
| flex-direction: row; |
| gap: 16px; |
| |
| &--icon { |
| color: var(--on-surface); |
| font-size: 17px; |
| padding-top: 4px; |
| flex: 0 0 auto; |
| } |
| |
| &--description { |
| color: var(--on-surface); |
| font-size: 12px; |
| } |
| } |
| } |
| |
| .slots-container { |
| .slotID { |
| display: block; |
| } |
| |
| .slot { |
| &--color { |
| color: var(--on-surface); |
| font-size: 17px; |
| padding-top: 4px; |
| flex: 0 0 auto; |
| } |
| } |
| |
| .text-box { |
| display: inline-block; |
| width: 110px; |
| align-items: baseline; |
| background-color: var(--surface-2dp); |
| border-radius: 4px; |
| gap: 8px; |
| padding: 4px; |
| margin-top: 8px; |
| margin-bottom: 8px; |
| |
| &--label { |
| display: inline-block; |
| } |
| |
| &__left { |
| border-radius: 4px 0 0 4px; |
| } |
| |
| &__right { |
| border-radius: 0 4px 4px 0; |
| } |
| |
| &--input { |
| flex: 1 1 auto; |
| min-width: 0; |
| width: max-content; |
| border: none; |
| } |
| } |
| } |
| } |
| } |
