diff --git a/packages/calcite-components/src/components/input/input.scss b/packages/calcite-components/src/components/input/input.scss index c8c1be2f87b..62281825c3e 100755 --- a/packages/calcite-components/src/components/input/input.scss +++ b/packages/calcite-components/src/components/input/input.scss @@ -6,30 +6,30 @@ * @prop --calcite-input-prefix-size: Specifies the component's prefix width, when present. * @prop --calcite-input-suffix-size: Specifies the component's suffix width, when present. * - * @prop --calcite-input-background-color: Specifies the background color of the component. - * @prop --calcite-input-border-color: Specifies the border color of the component. - * @prop --calcite-input-corner-radius: Specifies the corner radius of the component. - * @prop --calcite-input-shadow: Specifies the shadow of the component. - - * @prop --calcite-input-icon-color: Specifies the icon color of the component. - * @prop --calcite-input-text-color: Specifies the text color of the component. - * @prop --calcite-input-placeholder-text-color: Specifies the color of placeholder text in the component. - - * @prop --calcite-input-actions-background-color: Specifies the background color of Input's `clearable` and `number-button-type` elements. - * @prop --calcite-input-actions-background-color-hover: Specifies the background color of Input's `clearable` and `number-button-type` elements when hovered. - * @prop --calcite-input-actions-background-color-press: Specifies the background color of Input's `clearable` and `number-button-type` elements when pressed. - * @prop --calcite-input-actions-icon-color: Specifies the icon color of Input's `clearable` and `number-button-type` elements. - * @prop --calcite-input-actions-icon-color-hover: Specifies the icon color of Input's `clearable` and `number-button-type` elements when hovered. - * @prop --calcite-input-actions-icon-color-press: Specifies the icon color of Input's `clearable` and `number-button-type` elements when pressed. + * @prop --calcite-input-background-color: Specifies the component's background color. + * @prop --calcite-input-border-color: Specifies the component's border color. + * @prop --calcite-input-corner-radius: Specifies the component's corner radius. + * @prop --calcite-input-shadow: Specifies the shadow around the component. + + * @prop --calcite-input-icon-color: Specifies the component's icon color. + * @prop --calcite-input-text-color: Specifies the component's text color. + * @prop --calcite-input-placeholder-text-color: Specifies the component's placeholder text color. + + * @prop --calcite-input-actions-background-color: Specifies the background color of the component's `clearable` and `number-button-type` elements. + * @prop --calcite-input-actions-background-color-hover: Specifies the background color of the component's `clearable` and `number-button-type` elements when hovered. + * @prop --calcite-input-actions-background-color-press: Specifies the background color of the component's `clearable` and `number-button-type` elements when pressed. + * @prop --calcite-input-actions-icon-color: Specifies the icon color of the component's `clearable` and `number-button-type` elements. + * @prop --calcite-input-actions-icon-color-hover: Specifies the icon color of the component's `clearable` and `number-button-type` elements when hovered. + * @prop --calcite-input-actions-icon-color-press: Specifies the icon color of the component's `clearable` and `number-button-type` elements when pressed. * @prop --calcite-input-loading-background-color: Specifies the background color of the `loading` element, when present. * @prop --calcite-input-loading-fill-color: Specifies the fill color of the `loading` element, when present. - * @prop --calcite-input-prefix-background-color: Specifies the background color of the component's prefix, when present. - * @prop --calcite-input-prefix-text-color: Specifies the text color of the component's prefix, when present. + * @prop --calcite-input-prefix-background-color: Specifies the component's prefix background color, when present. + * @prop --calcite-input-prefix-text-color: Specifies the component's prefix text color, when present. - * @prop --calcite-input-suffix-background-color: Specifies the background color of the component's suffix, when present. - * @prop --calcite-input-suffix-text-color: Specifies the text color of the component's suffix, when present. + * @prop --calcite-input-suffix-background-color: Specifies the component's suffix background color, when present. + * @prop --calcite-input-suffix-text-color: Specifies the component's suffix text color, when present. * */ diff --git a/packages/calcite-components/src/components/list-item/list-item.scss b/packages/calcite-components/src/components/list-item/list-item.scss index 9ede3bad45d..2f4600b75ba 100755 --- a/packages/calcite-components/src/components/list-item/list-item.scss +++ b/packages/calcite-components/src/components/list-item/list-item.scss @@ -8,9 +8,9 @@ * @prop --calcite-list-background-color: Specifies the component's background color. * @prop --calcite-list-border-color: Specifies the component's border color. * @prop --calcite-list-content-text-color: Specifies the content color. - * @prop --calcite-list-description-text-color: Specifies the description color. + * @prop --calcite-list-description-text-color: Specifies the `description` color. * @prop --calcite-list-icon-color: Specifies the component's icon color. - * @prop --calcite-list-label-text-color: Specifies the label color. + * @prop --calcite-list-label-text-color: Specifies the `label` color. * @prop --calcite-list-selection-border-color: Specifies the component's selection border color. */ diff --git a/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss b/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss index 9103ea0d047..298263c38c2 100644 --- a/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss +++ b/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss @@ -5,7 +5,6 @@ * @prop --calcite-navigation-background-color: Specifies the component's background color. * @prop --calcite-navigation-logo-heading-text-color: Specifies the component's default color for heading text. * @prop --calcite-navigation-logo-text-color: Specifies the component's default color for icon and description text. -* */ :host { diff --git a/packages/calcite-components/src/components/navigation-user/navigation-user.scss b/packages/calcite-components/src/components/navigation-user/navigation-user.scss index c0c44f6c33e..593662509a0 100644 --- a/packages/calcite-components/src/components/navigation-user/navigation-user.scss +++ b/packages/calcite-components/src/components/navigation-user/navigation-user.scss @@ -4,11 +4,11 @@ * These properties can be overridden using the component's tag as selector. * * @prop --calcite-navigation-accent-color: Specifies the components's border color when `active`. - * @prop --calcite-navigation-user-avatar-corner-radius: Specifies the corner radius of avatar. - * @prop --calcite-navigation-user-avatar-color: Specifies the icon color of avatar. + * @prop --calcite-navigation-user-avatar-corner-radius: Specifies the component's avatar corner radius. + * @prop --calcite-navigation-user-avatar-color: Specifies the component's avatar icon color. * @prop --calcite-navigation-background-color: Specifies the component's background color. - * @prop --calcite-navigation-user-full-name-text-color: Specifies the component's full name text color. - * @prop --calcite-navigation-user-name-text-color: Specifies the component's username text color. + * @prop --calcite-navigation-user-full-name-text-color: Specifies the component's `fullName` text color. + * @prop --calcite-navigation-user-name-text-color: Specifies the component's `username` text color. * */ diff --git a/packages/calcite-components/src/components/navigation/navigation.scss b/packages/calcite-components/src/components/navigation/navigation.scss index 0ac0a8d81e3..4cd7955884c 100644 --- a/packages/calcite-components/src/components/navigation/navigation.scss +++ b/packages/calcite-components/src/components/navigation/navigation.scss @@ -5,8 +5,8 @@ * * @prop --calcite-navigation-width: Specifies the width of the component's content area. * @prop --calcite-navigation-background: [Deprecated] Use `--calcite-navigation-background-color`. Specifies the background color of the component. - * @prop --calcite-navigation-background-color: Specifies component's background color. - * @prop --calcite-navigation-border-color: Specifies the border color of the component. + * @prop --calcite-navigation-background-color: Specifies the component's background color. + * @prop --calcite-navigation-border-color: Specifies the component's border color. */ @include base-component(); diff --git a/packages/calcite-components/src/components/panel/panel.scss b/packages/calcite-components/src/components/panel/panel.scss index 3339939d9f5..3cb4518df30 100644 --- a/packages/calcite-components/src/components/panel/panel.scss +++ b/packages/calcite-components/src/components/panel/panel.scss @@ -3,29 +3,29 @@ * * These properties can be overridden using the component's tag as selector. - * @prop --calcite-panel-corner-radius: Specifies the corner radius of the component. + * @prop --calcite-panel-corner-radius: Specifies the component's corner radius. * @prop --calcite-panel-heading-text-color: Specifies the text color of the component's `heading`. * @prop --calcite-panel-description-text-color: Specifies the text color of the component's `description`. - * @prop --calcite-panel-border-color: Specifies the border color of the component. + * @prop --calcite-panel-border-color: Specifies the component's border color. - * @prop --calcite-panel-background-color: Specifies the background color of the component. - * @prop --calcite-panel-header-background-color: Specifies the background color of the component's footer. + * @prop --calcite-panel-background-color: Specifies the component's background color. + * @prop --calcite-panel-header-background-color: Specifies the background color of the component's header. * @prop --calcite-panel-footer-background-color: Specifies the background color of the component's footer. * @prop --calcite-panel-space: Specifies the padding of the component's `"unnamed (default)"` slot. * @prop --calcite-panel-header-content-space: Specifies the padding of the `"header-content"` slot. * @prop --calcite-panel-footer-space: Specifies the padding of the component's footer. - * @prop --calcite-action-background-color: Specifies the background color of the component's `closable`, `collapsible`, and `back` Calcite Action components. Will apply to any slotted Calcite Action components. - * @prop --calcite-action-background-color-hover: Specifies the background color of the component's `closable`, `collapsible`, and `back` Calcite Action components when hovered. Will apply to any slotted Calcite Action components. - * @prop --calcite-action-background-color-pressed: Specifies the background color of the component's `closable`, `collapsible`, and `back` Calcite Action components when pressed. Will apply to any slotted Calcite Action components. - * @prop --calcite-action-text-color-hover: Specifies the text and icon color of the component's `closable`, `collapsible`, and `back` Calcite Action components when hovered. Will apply to any slotted Calcite Action components. - * @prop --calcite-action-text-color-pressed: Specifies the text and icon color of the component's `closable`, `collapsible`, and `back` Calcite Action components when pressed. Will apply to any slotted Calcite Action components. - * @prop --calcite-popover-border-color: Specifies the border color of the component's internally rendered Calcite Popover component, which is rendered within a Calcite Action Menu when slotted Calcite Actions are present in the `header-actions-end` slot. Will apply to any slotted Calcite Popover components. + * @prop --calcite-action-background-color: Specifies the background color of the component's `closable`, `collapsible`, and `back` `calcite-action`s. Applies to any slotted `calcite-action`s. + * @prop --calcite-action-background-color-hover: Specifies the background color of the component's `closable`, `collapsible`, and `back` `calcite-action`s when hovered. Applies to any slotted `calcite-action`s. + * @prop --calcite-action-background-color-pressed: Specifies the background color of the component's `closable`, `collapsible`, and `back` `calcite-action`s when pressed. Applies to any slotted `calcite-action`s. + * @prop --calcite-action-text-color-hover: Specifies the text and icon color of the component's `closable`, `collapsible`, and `back` `calcite-action`s when hovered. Applies to any slotted `calcite-action`s. + * @prop --calcite-action-text-color-pressed: Specifies the text and icon color of the component's `closable`, `collapsible`, and `back` `calcite-action`s when pressed. Applies to any slotted `calcite-action`s. + * @prop --calcite-popover-border-color: Specifies the border color of the component's internally rendered `calcite-popover`, which is rendered within a `calcite-action` menu when slotted `calcite-action`s are present in the `header-actions-end` slot. Applies to any slotted `calcite-popover`s. - * @prop --calcite-panel-content-space: [Deprecated] Specifies the padding of the component's content. Use `--calcite-panel-space` instead. - * @prop --calcite-panel-footer-padding: [Deprecated] Specifies the padding of the component's footer. Use `--calcite-panel-footer-space` instead. - * @prop --calcite-panel-header-border-block-end: [Deprecated] Specifies the component header's block end border. Use `--calcite-panel-border-color` instead. + * @prop --calcite-panel-content-space: [Deprecated] Use `--calcite-panel-space` instead. Specifies the padding of the component's content. + * @prop --calcite-panel-footer-padding: [Deprecated] Use `--calcite-panel-footer-space` instead. Specifies the padding of the component's footer. + * @prop --calcite-panel-header-border-block-end: [Deprecated] Use `--calcite-panel-border-color` instead. Specifies the component header's block end border. */ :host { diff --git a/packages/calcite-components/src/components/tooltip/tooltip.scss b/packages/calcite-components/src/components/tooltip/tooltip.scss index 1a667a7ed5f..37cded702e1 100644 --- a/packages/calcite-components/src/components/tooltip/tooltip.scss +++ b/packages/calcite-components/src/components/tooltip/tooltip.scss @@ -3,11 +3,11 @@ * * These properties can be overridden using the component's tag as selector. * - * @prop --calcite-tooltip-background-color: Specifies the background color of the component. - * @prop --calcite-tooltip-border-color: Specifies the border color of the component. - * @prop --calcite-tooltip-corner-radius: Specifies the corner radius of the component. - * @prop --calcite-tooltip-text-color: Specifies the text color of the component. - * @prop --calcite-tooltip-z-index: Sets the z-index value for the component. + * @prop --calcite-tooltip-background-color: Specifies the component's background color. + * @prop --calcite-tooltip-border-color: Specifies the component's border color. + * @prop --calcite-tooltip-corner-radius: Specifies the component's corner radius. + * @prop --calcite-tooltip-text-color: Specifies the component's text color. + * @prop --calcite-tooltip-z-index: Specifies the z-index value for the component. */ :host {