@i-cell/ids-styles 0.0.20 → 0.0.21

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.
Files changed (7) hide show
  1. package/dist/components.css +599 -0
  2. package/dist/components.min.css +1 -1
  3. package/dist/components.plugin.js +373 -0
  4. package/dist/notification/notification.css +598 -0
  5. package/dist/notification/notification.min.css +1 -0
  6. package/dist/notification/notification.plugin.js +382 -0
  7. package/package.json +1 -1
package/dist/notification/notification.min.css ADDED
@@ -0,0 +1 @@
1
+ .ids-notification>.ids-notification__content-wrapper{display:flex;justify-content:space-between;align-items:flex-start;align-content:flex-start;flex-wrap:wrap;border-style:solid}.ids-notification>.ids-notification__content-wrapper>.ids-notification__leading-element{display:flex;align-items:center;flex-shrink:0}.ids-notification>.ids-notification__content-wrapper>.ids-notification__container{display:flex;justify-content:space-between;align-items:center;align-content:center;flex:1 0 0;flex-wrap:wrap}.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{display:flex;flex-direction:column}.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-style:normal}.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{flex:1 0 0;font-style:normal}.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{display:flex;align-items:center}.ids-notification>.ids-notification__content-wrapper>.ids-notification__close-btn-container.ids-notification__label-btn{display:flex;align-self:center}.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-error-default);background:var(--ids-comp-notification-filled-color-bg-error-default)}.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-error-default)}.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-error-default)}.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-error-default)}.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-success-default);background:var(--ids-comp-notification-filled-color-bg-success-default)}.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-success-default)}.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-success-default)}.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-success-default)}.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-warning-default);background:var(--ids-comp-notification-filled-color-bg-warning-default)}.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-warning-default)}.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-warning-default)}.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-warning-default)}.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-light-default);background:var(--ids-comp-notification-filled-color-bg-light-default)}.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-light-default)}.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-light-default)}.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-light-default)}.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-dark-default);background:var(--ids-comp-notification-filled-color-bg-dark-default)}.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-dark-default)}.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-dark-default)}.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-dark-default)}.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-surface-default);background:var(--ids-comp-notification-filled-color-bg-surface-default)}.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-surface-default)}.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-surface-default)}.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-surface-default)}.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-filled-color-border-info-default);background:var(--ids-comp-notification-filled-color-bg-info-default)}.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-filled-color-fg-icon-info-default)}.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-filled-color-fg-title-info-default)}.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-filled-color-fg-message-info-default)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-filled-container-size-gap-compact);padding:var(--ids-comp-notification-filled-container-size-padding-y-compact) var(--ids-comp-notification-filled-container-size-padding-x-compact);border-radius:var(--ids-comp-notification-filled-container-size-border-radius-compact);border-top-width:var(--ids-comp-notification-filled-container-size-border-top-width-compact);border-right-width:var(--ids-comp-notification-filled-container-size-border-right-width-compact);border-bottom-width:var(--ids-comp-notification-filled-container-size-border-bottom-width-compact);border-left-width:var(--ids-comp-notification-filled-container-size-border-left-width-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-compact);padding-right:var(--ids-comp-notification-icon-size-padding-right-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-compact);height:var(--ids-comp-notification-icon-size-icon-compact);font-size:var(--ids-comp-notification-icon-typography-font-size-compact);font-weight:var(--ids-comp-notification-icon-typography-font-weight-compact);line-height:var(--ids-comp-notification-icon-typography-line-height-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-filled-container-size-min-width-compact);padding-right:var(--ids-comp-notification-message-size-padding-right-compact);gap:var(--ids-comp-notification-message-size-gap-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-compact);font-weight:var(--ids-comp-notification-title-typography-font-weight-compact);line-height:var(--ids-comp-notification-title-typography-line-height-compact);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-compact);font-weight:var(--ids-comp-notification-message-typography-font-weight-compact);line-height:var(--ids-comp-notification-message-typography-line-height-compact);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-compact);height:var(--ids-comp-notification-icon-button-size-icon-button-compact)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-filled-container-size-gap-comfortable);padding:var(--ids-comp-notification-filled-container-size-padding-y-comfortable) var(--ids-comp-notification-filled-container-size-padding-x-comfortable);border-radius:var(--ids-comp-notification-filled-container-size-border-radius-comfortable);border-top-width:var(--ids-comp-notification-filled-container-size-border-top-width-comfortable);border-right-width:var(--ids-comp-notification-filled-container-size-border-right-width-comfortable);border-bottom-width:var(--ids-comp-notification-filled-container-size-border-bottom-width-comfortable);border-left-width:var(--ids-comp-notification-filled-container-size-border-left-width-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-comfortable);padding-right:var(--ids-comp-notification-icon-size-padding-right-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-comfortable);height:var(--ids-comp-notification-icon-size-icon-comfortable);font-size:var(--ids-comp-notification-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-notification-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-notification-icon-typography-line-height-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-filled-container-size-min-width-comfortable);padding-right:var(--ids-comp-notification-message-size-padding-right-comfortable);gap:var(--ids-comp-notification-message-size-gap-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-comfortable);font-weight:var(--ids-comp-notification-title-typography-font-weight-comfortable);line-height:var(--ids-comp-notification-title-typography-line-height-comfortable);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-comfortable);font-weight:var(--ids-comp-notification-message-typography-font-weight-comfortable);line-height:var(--ids-comp-notification-message-typography-line-height-comfortable);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-comfortable);height:var(--ids-comp-notification-icon-button-size-icon-button-comfortable)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-filled-container-size-gap-spacious);padding:var(--ids-comp-notification-filled-container-size-padding-y-spacious) var(--ids-comp-notification-filled-container-size-padding-x-spacious);border-radius:var(--ids-comp-notification-filled-container-size-border-radius-spacious);border-top-width:var(--ids-comp-notification-filled-container-size-border-top-width-spacious);border-right-width:var(--ids-comp-notification-filled-container-size-border-right-width-spacious);border-bottom-width:var(--ids-comp-notification-filled-container-size-border-bottom-width-spacious);border-left-width:var(--ids-comp-notification-filled-container-size-border-left-width-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-spacious);padding-right:var(--ids-comp-notification-icon-size-padding-right-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-spacious);height:var(--ids-comp-notification-icon-size-icon-spacious);font-size:var(--ids-comp-notification-icon-typography-font-size-spacious);font-weight:var(--ids-comp-notification-icon-typography-font-weight-spacious);line-height:var(--ids-comp-notification-icon-typography-line-height-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-filled-container-size-min-width-spacious);padding-right:var(--ids-comp-notification-message-size-padding-right-spacious);gap:var(--ids-comp-notification-message-size-gap-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-spacious);font-weight:var(--ids-comp-notification-title-typography-font-weight-spacious);line-height:var(--ids-comp-notification-title-typography-line-height-spacious);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-spacious);font-weight:var(--ids-comp-notification-message-typography-font-weight-spacious);line-height:var(--ids-comp-notification-message-typography-line-height-spacious);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-spacious);height:var(--ids-comp-notification-icon-button-size-icon-button-spacious)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-filled-container-size-gap-dense);padding:var(--ids-comp-notification-filled-container-size-padding-y-dense) var(--ids-comp-notification-filled-container-size-padding-x-dense);border-radius:var(--ids-comp-notification-filled-container-size-border-radius-dense);border-top-width:var(--ids-comp-notification-filled-container-size-border-top-width-dense);border-right-width:var(--ids-comp-notification-filled-container-size-border-right-width-dense);border-bottom-width:var(--ids-comp-notification-filled-container-size-border-bottom-width-dense);border-left-width:var(--ids-comp-notification-filled-container-size-border-left-width-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-dense);padding-right:var(--ids-comp-notification-icon-size-padding-right-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-dense);height:var(--ids-comp-notification-icon-size-icon-dense);font-size:var(--ids-comp-notification-icon-typography-font-size-dense);font-weight:var(--ids-comp-notification-icon-typography-font-weight-dense);line-height:var(--ids-comp-notification-icon-typography-line-height-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-filled-container-size-min-width-dense);padding-right:var(--ids-comp-notification-message-size-padding-right-dense);gap:var(--ids-comp-notification-message-size-gap-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-dense);font-weight:var(--ids-comp-notification-title-typography-font-weight-dense);line-height:var(--ids-comp-notification-title-typography-line-height-dense);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-dense);font-weight:var(--ids-comp-notification-message-typography-font-weight-dense);line-height:var(--ids-comp-notification-message-typography-line-height-dense);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-dense);height:var(--ids-comp-notification-icon-button-size-icon-button-dense)}.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-error-default);background:var(--ids-comp-notification-outlined-color-bg-error-default)}.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-error-default)}.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-error-default)}.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-error-default)}.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-success-default);background:var(--ids-comp-notification-outlined-color-bg-success-default)}.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-success-default)}.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-success-default)}.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-success-default)}.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-warning-default);background:var(--ids-comp-notification-outlined-color-bg-warning-default)}.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-warning-default)}.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-warning-default)}.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-warning-default)}.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-light-default);background:var(--ids-comp-notification-outlined-color-bg-light-default)}.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-light-default)}.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-light-default)}.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-light-default)}.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-dark-default);background:var(--ids-comp-notification-outlined-color-bg-dark-default)}.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-dark-default)}.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-dark-default)}.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-dark-default)}.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-surface-default);background:var(--ids-comp-notification-outlined-color-bg-surface-default)}.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-surface-default)}.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-surface-default)}.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-surface-default)}.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper{border-color:var(--ids-comp-notification-outlined-color-border-info-default);background:var(--ids-comp-notification-outlined-color-bg-info-default)}.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{color:var(--ids-comp-notification-outlined-color-fg-icon-info-default)}.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{color:var(--ids-comp-notification-outlined-color-fg-title-info-default)}.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{color:var(--ids-comp-notification-outlined-color-fg-message-info-default)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-outlined-container-size-gap-compact);padding:var(--ids-comp-notification-outlined-container-size-padding-y-compact) var(--ids-comp-notification-outlined-container-size-padding-x-compact);border-radius:var(--ids-comp-notification-outlined-container-size-border-radius-compact);border-top-width:var(--ids-comp-notification-outlined-container-size-border-top-width-compact);border-right-width:var(--ids-comp-notification-outlined-container-size-border-right-width-compact);border-bottom-width:var(--ids-comp-notification-outlined-container-size-border-bottom-width-compact);border-left-width:var(--ids-comp-notification-outlined-container-size-border-left-width-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-compact);padding-right:var(--ids-comp-notification-icon-size-padding-right-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-compact);height:var(--ids-comp-notification-icon-size-icon-compact);font-size:var(--ids-comp-notification-icon-typography-font-size-compact);font-weight:var(--ids-comp-notification-icon-typography-font-weight-compact);line-height:var(--ids-comp-notification-icon-typography-line-height-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-outlined-container-size-min-width-compact);padding-right:var(--ids-comp-notification-message-size-padding-right-compact);gap:var(--ids-comp-notification-message-size-gap-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-compact);font-weight:var(--ids-comp-notification-title-typography-font-weight-compact);line-height:var(--ids-comp-notification-title-typography-line-height-compact);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-compact);font-weight:var(--ids-comp-notification-message-typography-font-weight-compact);line-height:var(--ids-comp-notification-message-typography-line-height-compact);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-compact)}.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-compact);height:var(--ids-comp-notification-icon-button-size-icon-button-compact)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-outlined-container-size-gap-comfortable);padding:var(--ids-comp-notification-outlined-container-size-padding-y-comfortable) var(--ids-comp-notification-outlined-container-size-padding-x-comfortable);border-radius:var(--ids-comp-notification-outlined-container-size-border-radius-comfortable);border-top-width:var(--ids-comp-notification-outlined-container-size-border-top-width-comfortable);border-right-width:var(--ids-comp-notification-outlined-container-size-border-right-width-comfortable);border-bottom-width:var(--ids-comp-notification-outlined-container-size-border-bottom-width-comfortable);border-left-width:var(--ids-comp-notification-outlined-container-size-border-left-width-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-comfortable);padding-right:var(--ids-comp-notification-icon-size-padding-right-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-comfortable);height:var(--ids-comp-notification-icon-size-icon-comfortable);font-size:var(--ids-comp-notification-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-notification-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-notification-icon-typography-line-height-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-outlined-container-size-min-width-comfortable);padding-right:var(--ids-comp-notification-message-size-padding-right-comfortable);gap:var(--ids-comp-notification-message-size-gap-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-comfortable);font-weight:var(--ids-comp-notification-title-typography-font-weight-comfortable);line-height:var(--ids-comp-notification-title-typography-line-height-comfortable);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-comfortable);font-weight:var(--ids-comp-notification-message-typography-font-weight-comfortable);line-height:var(--ids-comp-notification-message-typography-line-height-comfortable);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-comfortable)}.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-comfortable);height:var(--ids-comp-notification-icon-button-size-icon-button-comfortable)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-outlined-container-size-gap-spacious);padding:var(--ids-comp-notification-outlined-container-size-padding-y-spacious) var(--ids-comp-notification-outlined-container-size-padding-x-spacious);border-radius:var(--ids-comp-notification-outlined-container-size-border-radius-spacious);border-top-width:var(--ids-comp-notification-outlined-container-size-border-top-width-spacious);border-right-width:var(--ids-comp-notification-outlined-container-size-border-right-width-spacious);border-bottom-width:var(--ids-comp-notification-outlined-container-size-border-bottom-width-spacious);border-left-width:var(--ids-comp-notification-outlined-container-size-border-left-width-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-spacious);padding-right:var(--ids-comp-notification-icon-size-padding-right-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-spacious);height:var(--ids-comp-notification-icon-size-icon-spacious);font-size:var(--ids-comp-notification-icon-typography-font-size-spacious);font-weight:var(--ids-comp-notification-icon-typography-font-weight-spacious);line-height:var(--ids-comp-notification-icon-typography-line-height-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-outlined-container-size-min-width-spacious);padding-right:var(--ids-comp-notification-message-size-padding-right-spacious);gap:var(--ids-comp-notification-message-size-gap-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-spacious);font-weight:var(--ids-comp-notification-title-typography-font-weight-spacious);line-height:var(--ids-comp-notification-title-typography-line-height-spacious);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-spacious);font-weight:var(--ids-comp-notification-message-typography-font-weight-spacious);line-height:var(--ids-comp-notification-message-typography-line-height-spacious);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-spacious)}.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-spacious);height:var(--ids-comp-notification-icon-button-size-icon-button-spacious)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper{gap:var(--ids-comp-notification-outlined-container-size-gap-dense);padding:var(--ids-comp-notification-outlined-container-size-padding-y-dense) var(--ids-comp-notification-outlined-container-size-padding-x-dense);border-radius:var(--ids-comp-notification-outlined-container-size-border-radius-dense);border-top-width:var(--ids-comp-notification-outlined-container-size-border-top-width-dense);border-right-width:var(--ids-comp-notification-outlined-container-size-border-right-width-dense);border-bottom-width:var(--ids-comp-notification-outlined-container-size-border-bottom-width-dense);border-left-width:var(--ids-comp-notification-outlined-container-size-border-left-width-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element{padding-left:var(--ids-comp-notification-icon-size-padding-left-dense);padding-right:var(--ids-comp-notification-icon-size-padding-right-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon{width:var(--ids-comp-notification-icon-size-icon-dense);height:var(--ids-comp-notification-icon-size-icon-dense);font-size:var(--ids-comp-notification-icon-typography-font-size-dense);font-weight:var(--ids-comp-notification-icon-typography-font-weight-dense);line-height:var(--ids-comp-notification-icon-typography-line-height-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container{min-width:var(--ids-comp-notification-outlined-container-size-min-width-dense);padding-right:var(--ids-comp-notification-message-size-padding-right-dense);gap:var(--ids-comp-notification-message-size-gap-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container{row-gap:var(--ids-comp-notification-message-size-gap-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title{font-size:var(--ids-comp-notification-title-typography-font-size-dense);font-weight:var(--ids-comp-notification-title-typography-font-weight-dense);line-height:var(--ids-comp-notification-title-typography-line-height-dense);letter-spacing:var(--ids-comp-notification-title-typography-letter-spacing-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message{font-size:var(--ids-comp-notification-message-typography-font-size-dense);font-weight:var(--ids-comp-notification-message-typography-font-weight-dense);line-height:var(--ids-comp-notification-message-typography-line-height-dense);letter-spacing:var(--ids-comp-notification-message-typography-letter-spacing-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action{gap:var(--ids-comp-notification-actions-size-gap-dense)}.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon{width:var(--ids-comp-notification-icon-button-size-icon-button-dense);height:var(--ids-comp-notification-icon-button-size-icon-button-dense)}
package/dist/notification/notification.plugin.js ADDED
@@ -0,0 +1,382 @@
1
+ // Tailwind CSS plugin for the notification component in the i-Cell Design System
2
+ module.exports = function NotificationPlugin() {
3
+ return function ({ addComponents }) {
4
+ const cssObj = {
5
+ '.ids-notification>.ids-notification__content-wrapper': {
6
+ display: 'flex',
7
+ justifyContent: 'space-between',
8
+ alignItems: 'flex-start',
9
+ alignContent: 'flex-start',
10
+ flexWrap: 'wrap',
11
+ borderStyle: 'solid',
12
+ },
13
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__leading-element': {
14
+ display: 'flex',
15
+ alignItems: 'center',
16
+ flexShrink: 0,
17
+ },
18
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container': {
19
+ display: 'flex',
20
+ justifyContent: 'space-between',
21
+ alignItems: 'center',
22
+ alignContent: 'center',
23
+ flex: '1 0 0',
24
+ flexWrap: 'wrap',
25
+ },
26
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container': {
27
+ display: 'flex',
28
+ flexDirection: 'column',
29
+ },
30
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
31
+ { fontStyle: 'normal' },
32
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
33
+ { flex: '1 0 0', fontStyle: 'normal' },
34
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action': {
35
+ display: 'flex',
36
+ alignItems: 'center',
37
+ },
38
+ '.ids-notification>.ids-notification__content-wrapper>.ids-notification__close-btn-container.ids-notification__label-btn': {
39
+ display: 'flex',
40
+ alignSelf: 'center',
41
+ },
42
+ '.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper': {
43
+ borderColor: 'var(--ids-comp-notification-filled-color-border-error-default)',
44
+ background: 'var(--ids-comp-notification-filled-color-bg-error-default)',
45
+ },
46
+ '.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
47
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-error-default)' },
48
+ '.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
49
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-error-default)' },
50
+ '.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
51
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-error-default)' },
52
+ '.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper': {
53
+ borderColor: 'var(--ids-comp-notification-filled-color-border-success-default)',
54
+ background: 'var(--ids-comp-notification-filled-color-bg-success-default)',
55
+ },
56
+ '.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
57
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-success-default)' },
58
+ '.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
59
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-success-default)' },
60
+ '.ids-notification.ids-notification-filled.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
61
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-success-default)' },
62
+ '.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper': {
63
+ borderColor: 'var(--ids-comp-notification-filled-color-border-warning-default)',
64
+ background: 'var(--ids-comp-notification-filled-color-bg-warning-default)',
65
+ },
66
+ '.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
67
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-warning-default)' },
68
+ '.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
69
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-warning-default)' },
70
+ '.ids-notification.ids-notification-filled.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
71
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-warning-default)' },
72
+ '.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper': {
73
+ borderColor: 'var(--ids-comp-notification-filled-color-border-light-default)',
74
+ background: 'var(--ids-comp-notification-filled-color-bg-light-default)',
75
+ },
76
+ '.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
77
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-light-default)' },
78
+ '.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
79
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-light-default)' },
80
+ '.ids-notification.ids-notification-filled.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
81
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-light-default)' },
82
+ '.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper': {
83
+ borderColor: 'var(--ids-comp-notification-filled-color-border-dark-default)',
84
+ background: 'var(--ids-comp-notification-filled-color-bg-dark-default)',
85
+ },
86
+ '.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
87
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-dark-default)' },
88
+ '.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
89
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-dark-default)' },
90
+ '.ids-notification.ids-notification-filled.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
91
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-dark-default)' },
92
+ '.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper': {
93
+ borderColor: 'var(--ids-comp-notification-filled-color-border-surface-default)',
94
+ background: 'var(--ids-comp-notification-filled-color-bg-surface-default)',
95
+ },
96
+ '.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
97
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-surface-default)' },
98
+ '.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
99
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-surface-default)' },
100
+ '.ids-notification.ids-notification-filled.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
101
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-surface-default)' },
102
+ '.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper': {
103
+ borderColor: 'var(--ids-comp-notification-filled-color-border-info-default)',
104
+ background: 'var(--ids-comp-notification-filled-color-bg-info-default)',
105
+ },
106
+ '.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
107
+ { color: 'var(--ids-comp-notification-filled-color-fg-icon-info-default)' },
108
+ '.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
109
+ { color: 'var(--ids-comp-notification-filled-color-fg-title-info-default)' },
110
+ '.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
111
+ { color: 'var(--ids-comp-notification-filled-color-fg-message-info-default)' },
112
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper': {
113
+ gap: 'var(--ids-comp-notification-outlined-container-size-gap-compact)',
114
+ padding:
115
+ 'var(--ids-comp-notification-outlined-container-size-padding-y-compact) var(--ids-comp-notification-outlined-container-size-padding-x-compact)',
116
+ borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-compact)',
117
+ borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-compact)',
118
+ borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-compact)',
119
+ borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-compact)',
120
+ borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-compact)',
121
+ },
122
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element': {
123
+ paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-compact)',
124
+ paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-compact)',
125
+ },
126
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon': {
127
+ width: 'var(--ids-comp-notification-icon-size-icon-compact)',
128
+ height: 'var(--ids-comp-notification-icon-size-icon-compact)',
129
+ fontSize: 'var(--ids-comp-notification-icon-typography-font-size-compact)',
130
+ fontWeight: 'var(--ids-comp-notification-icon-typography-font-weight-compact)',
131
+ lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-compact)',
132
+ },
133
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container': {
134
+ minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-compact)',
135
+ paddingRight: 'var(--ids-comp-notification-message-size-padding-right-compact)',
136
+ gap: 'var(--ids-comp-notification-message-size-gap-compact)',
137
+ },
138
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container':
139
+ { rowGap: 'var(--ids-comp-notification-message-size-gap-compact)' },
140
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
141
+ {
142
+ fontSize: 'var(--ids-comp-notification-title-typography-font-size-compact)',
143
+ fontWeight: 'var(--ids-comp-notification-title-typography-font-weight-compact)',
144
+ lineHeight: 'var(--ids-comp-notification-title-typography-line-height-compact)',
145
+ letterSpacing: 'var(--ids-comp-notification-title-typography-letter-spacing-compact)',
146
+ },
147
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
148
+ {
149
+ fontSize: 'var(--ids-comp-notification-message-typography-font-size-compact)',
150
+ fontWeight: 'var(--ids-comp-notification-message-typography-font-weight-compact)',
151
+ lineHeight: 'var(--ids-comp-notification-message-typography-line-height-compact)',
152
+ letterSpacing: 'var(--ids-comp-notification-message-typography-letter-spacing-compact)',
153
+ },
154
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
155
+ { gap: 'var(--ids-comp-notification-actions-size-gap-compact)' },
156
+ '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
157
+ {
158
+ width: 'var(--ids-comp-notification-icon-button-size-icon-button-compact)',
159
+ height: 'var(--ids-comp-notification-icon-button-size-icon-button-compact)',
160
+ },
161
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper': {
162
+ gap: 'var(--ids-comp-notification-outlined-container-size-gap-comfortable)',
163
+ padding:
164
+ 'var(--ids-comp-notification-outlined-container-size-padding-y-comfortable) var(--ids-comp-notification-outlined-container-size-padding-x-comfortable)',
165
+ borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-comfortable)',
166
+ borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-comfortable)',
167
+ borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-comfortable)',
168
+ borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-comfortable)',
169
+ borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-comfortable)',
170
+ },
171
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element': {
172
+ paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-comfortable)',
173
+ paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-comfortable)',
174
+ },
175
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon': {
176
+ width: 'var(--ids-comp-notification-icon-size-icon-comfortable)',
177
+ height: 'var(--ids-comp-notification-icon-size-icon-comfortable)',
178
+ fontSize: 'var(--ids-comp-notification-icon-typography-font-size-comfortable)',
179
+ fontWeight: 'var(--ids-comp-notification-icon-typography-font-weight-comfortable)',
180
+ lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-comfortable)',
181
+ },
182
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container': {
183
+ minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-comfortable)',
184
+ paddingRight: 'var(--ids-comp-notification-message-size-padding-right-comfortable)',
185
+ gap: 'var(--ids-comp-notification-message-size-gap-comfortable)',
186
+ },
187
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container':
188
+ { rowGap: 'var(--ids-comp-notification-message-size-gap-comfortable)' },
189
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
190
+ {
191
+ fontSize: 'var(--ids-comp-notification-title-typography-font-size-comfortable)',
192
+ fontWeight: 'var(--ids-comp-notification-title-typography-font-weight-comfortable)',
193
+ lineHeight: 'var(--ids-comp-notification-title-typography-line-height-comfortable)',
194
+ letterSpacing: 'var(--ids-comp-notification-title-typography-letter-spacing-comfortable)',
195
+ },
196
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
197
+ {
198
+ fontSize: 'var(--ids-comp-notification-message-typography-font-size-comfortable)',
199
+ fontWeight: 'var(--ids-comp-notification-message-typography-font-weight-comfortable)',
200
+ lineHeight: 'var(--ids-comp-notification-message-typography-line-height-comfortable)',
201
+ letterSpacing: 'var(--ids-comp-notification-message-typography-letter-spacing-comfortable)',
202
+ },
203
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
204
+ { gap: 'var(--ids-comp-notification-actions-size-gap-comfortable)' },
205
+ '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
206
+ {
207
+ width: 'var(--ids-comp-notification-icon-button-size-icon-button-comfortable)',
208
+ height: 'var(--ids-comp-notification-icon-button-size-icon-button-comfortable)',
209
+ },
210
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper': {
211
+ gap: 'var(--ids-comp-notification-outlined-container-size-gap-spacious)',
212
+ padding:
213
+ 'var(--ids-comp-notification-outlined-container-size-padding-y-spacious) var(--ids-comp-notification-outlined-container-size-padding-x-spacious)',
214
+ borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-spacious)',
215
+ borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-spacious)',
216
+ borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-spacious)',
217
+ borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-spacious)',
218
+ borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-spacious)',
219
+ },
220
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element': {
221
+ paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-spacious)',
222
+ paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-spacious)',
223
+ },
224
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon': {
225
+ width: 'var(--ids-comp-notification-icon-size-icon-spacious)',
226
+ height: 'var(--ids-comp-notification-icon-size-icon-spacious)',
227
+ fontSize: 'var(--ids-comp-notification-icon-typography-font-size-spacious)',
228
+ fontWeight: 'var(--ids-comp-notification-icon-typography-font-weight-spacious)',
229
+ lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-spacious)',
230
+ },
231
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container': {
232
+ minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-spacious)',
233
+ paddingRight: 'var(--ids-comp-notification-message-size-padding-right-spacious)',
234
+ gap: 'var(--ids-comp-notification-message-size-gap-spacious)',
235
+ },
236
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container':
237
+ { rowGap: 'var(--ids-comp-notification-message-size-gap-spacious)' },
238
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
239
+ {
240
+ fontSize: 'var(--ids-comp-notification-title-typography-font-size-spacious)',
241
+ fontWeight: 'var(--ids-comp-notification-title-typography-font-weight-spacious)',
242
+ lineHeight: 'var(--ids-comp-notification-title-typography-line-height-spacious)',
243
+ letterSpacing: 'var(--ids-comp-notification-title-typography-letter-spacing-spacious)',
244
+ },
245
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
246
+ {
247
+ fontSize: 'var(--ids-comp-notification-message-typography-font-size-spacious)',
248
+ fontWeight: 'var(--ids-comp-notification-message-typography-font-weight-spacious)',
249
+ lineHeight: 'var(--ids-comp-notification-message-typography-line-height-spacious)',
250
+ letterSpacing: 'var(--ids-comp-notification-message-typography-letter-spacing-spacious)',
251
+ },
252
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
253
+ { gap: 'var(--ids-comp-notification-actions-size-gap-spacious)' },
254
+ '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
255
+ {
256
+ width: 'var(--ids-comp-notification-icon-button-size-icon-button-spacious)',
257
+ height: 'var(--ids-comp-notification-icon-button-size-icon-button-spacious)',
258
+ },
259
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper': {
260
+ gap: 'var(--ids-comp-notification-outlined-container-size-gap-dense)',
261
+ padding:
262
+ 'var(--ids-comp-notification-outlined-container-size-padding-y-dense) var(--ids-comp-notification-outlined-container-size-padding-x-dense)',
263
+ borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-dense)',
264
+ borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-dense)',
265
+ borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-dense)',
266
+ borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-dense)',
267
+ borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-dense)',
268
+ },
269
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element': {
270
+ paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-dense)',
271
+ paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-dense)',
272
+ },
273
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon': {
274
+ width: 'var(--ids-comp-notification-icon-size-icon-dense)',
275
+ height: 'var(--ids-comp-notification-icon-size-icon-dense)',
276
+ fontSize: 'var(--ids-comp-notification-icon-typography-font-size-dense)',
277
+ fontWeight: 'var(--ids-comp-notification-icon-typography-font-weight-dense)',
278
+ lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-dense)',
279
+ },
280
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container': {
281
+ minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-dense)',
282
+ paddingRight: 'var(--ids-comp-notification-message-size-padding-right-dense)',
283
+ gap: 'var(--ids-comp-notification-message-size-gap-dense)',
284
+ },
285
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container':
286
+ { rowGap: 'var(--ids-comp-notification-message-size-gap-dense)' },
287
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
288
+ {
289
+ fontSize: 'var(--ids-comp-notification-title-typography-font-size-dense)',
290
+ fontWeight: 'var(--ids-comp-notification-title-typography-font-weight-dense)',
291
+ lineHeight: 'var(--ids-comp-notification-title-typography-line-height-dense)',
292
+ letterSpacing: 'var(--ids-comp-notification-title-typography-letter-spacing-dense)',
293
+ },
294
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
295
+ {
296
+ fontSize: 'var(--ids-comp-notification-message-typography-font-size-dense)',
297
+ fontWeight: 'var(--ids-comp-notification-message-typography-font-weight-dense)',
298
+ lineHeight: 'var(--ids-comp-notification-message-typography-line-height-dense)',
299
+ letterSpacing: 'var(--ids-comp-notification-message-typography-letter-spacing-dense)',
300
+ },
301
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
302
+ { gap: 'var(--ids-comp-notification-actions-size-gap-dense)' },
303
+ '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
304
+ {
305
+ width: 'var(--ids-comp-notification-icon-button-size-icon-button-dense)',
306
+ height: 'var(--ids-comp-notification-icon-button-size-icon-button-dense)',
307
+ },
308
+ '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper': {
309
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-error-default)',
310
+ background: 'var(--ids-comp-notification-outlined-color-bg-error-default)',
311
+ },
312
+ '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
313
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-error-default)' },
314
+ '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
315
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-error-default)' },
316
+ '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
317
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-error-default)' },
318
+ '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper': {
319
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-success-default)',
320
+ background: 'var(--ids-comp-notification-outlined-color-bg-success-default)',
321
+ },
322
+ '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
323
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-success-default)' },
324
+ '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
325
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-success-default)' },
326
+ '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
327
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-success-default)' },
328
+ '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper': {
329
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-warning-default)',
330
+ background: 'var(--ids-comp-notification-outlined-color-bg-warning-default)',
331
+ },
332
+ '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
333
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-warning-default)' },
334
+ '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
335
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-warning-default)' },
336
+ '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
337
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-warning-default)' },
338
+ '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper': {
339
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-light-default)',
340
+ background: 'var(--ids-comp-notification-outlined-color-bg-light-default)',
341
+ },
342
+ '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
343
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-light-default)' },
344
+ '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
345
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-light-default)' },
346
+ '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
347
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-light-default)' },
348
+ '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper': {
349
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-dark-default)',
350
+ background: 'var(--ids-comp-notification-outlined-color-bg-dark-default)',
351
+ },
352
+ '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
353
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-dark-default)' },
354
+ '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
355
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-dark-default)' },
356
+ '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
357
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-dark-default)' },
358
+ '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper': {
359
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-surface-default)',
360
+ background: 'var(--ids-comp-notification-outlined-color-bg-surface-default)',
361
+ },
362
+ '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
363
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-surface-default)' },
364
+ '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
365
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-surface-default)' },
366
+ '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
367
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-surface-default)' },
368
+ '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper': {
369
+ borderColor: 'var(--ids-comp-notification-outlined-color-border-info-default)',
370
+ background: 'var(--ids-comp-notification-outlined-color-bg-info-default)',
371
+ },
372
+ '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
373
+ { color: 'var(--ids-comp-notification-outlined-color-fg-icon-info-default)' },
374
+ '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
375
+ { color: 'var(--ids-comp-notification-outlined-color-fg-title-info-default)' },
376
+ '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
377
+ { color: 'var(--ids-comp-notification-outlined-color-fg-message-info-default)' },
378
+ };
379
+
380
+ addComponents(cssObj);
381
+ };
382
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@i-cell/ids-styles",
3
- "version": "0.0.20",
3
+ "version": "0.0.21",
4
4
  "private": false,
5
5
  "description": "Stylesheets for i-Cell Design System UI Kit components (currently Vue and Angular)",
6
6
  "scripts": {