Skip to content

docs(tokens): consistency pass for new component descriptions #12148

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
DitwanP merged 4 commits into from
May 15, 2025
Merged

docs(tokens): consistency pass for new component descriptions #12148

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e793941
docs(tokens): consistency pass for new component descriptions
DitwanP May 14, 2025
f51a2e4
feedback changes
DitwanP May 14, 2025
0eff94e
feedback changes
DitwanP May 15, 2025
2e9d5f1
Merge branch 'dev' of https://github.com/Esri/calcite-design-system i…
DitwanP May 15, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions packages/calcite-components/src/components/input-number/input-number.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,11 @@
* These properties can be overridden using the component's tag as selector.
*
* @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-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-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.
Comment thread
DitwanP marked this conversation as resolved.
* @prop --calcite-input-loading-background-color: Specifies the background color of the `loading` element.
* @prop --calcite-input-loading-fill-color: Specifies the fill color of the `loading` element.
* @prop --calcite-input-number-background-color: Specifies the background color of the component.
Expand Down
2 changes: 1 addition & 1 deletion packages/calcite-components/src/components/shell-panel/shell-panel.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
*
* @prop --calcite-shell-panel-background-color: Specifies the background color of the component.
* @prop --calcite-shell-panel-border-color: When `displayMode` is `"float-all"`, specifies the component's border color.
* @prop --calcite-shell-panel-corner-radius: When `displayMode` is `"float-all"`, specifies the component's corner radius
* @prop --calcite-shell-panel-corner-radius: When `displayMode` is `"float-all"`, specifies the component's corner radius.
* @prop --calcite-shell-panel-height: When `layout` is `horizontal`, or `layout` is `vertical` and `displayMode` is `float-content` or `float`, specifies the height of the component.
* @prop --calcite-shell-panel-max-height: When `layout` is `horizontal`, or `layout` is `vertical` and `displayMode` is `float-content` or `float`, specifies the maximum height of the component.
* @prop --calcite-shell-panel-max-width: Specifies the maximum width of the component.
Expand Down
4 changes: 2 additions & 2 deletions packages/calcite-components/src/components/stepper-item/stepper-item.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,9 @@
* @prop --calcite-stepper-bar-fill-color: Specifies the component's fill color.
* @prop --calcite-stepper-bar-fill-color-hover: Specifies the component's fill color when hovered or focused.
* @prop --calcite-stepper-bar-complete-fill-color: Specifies the component's fill color when complete.
* @prop --calcite-stepper-bar-complete-fill-color-hover: When item is complete, specifies the component's fill color when hovered or focused.
* @prop --calcite-stepper-bar-complete-fill-color-hover: When the component is `complete`, specifies the component's fill color when hovered or focused.
* @prop --calcite-stepper-bar-error-fill-color: Specifies the component's fill color when in error.
* @prop --calcite-stepper-bar-error-fill-color-hover: When item is error, specifies the component's fill color when hovered or focused.
* @prop --calcite-stepper-bar-error-fill-color-hover: When the component contains an `error`, specifies the component's fill color when hovered or focused.
* @prop --calcite-stepper-bar-selected-fill-color: Specifies the component's fill color when selected.
*/

Expand Down
10 changes: 5 additions & 5 deletions packages/calcite-components/src/components/stepper/stepper.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,11 @@
*
* These properties can be overridden using the component's tag as selector.
*
* @prop --calcite-stepper-bar-gap: Specifies the space between items in the step bar.
* @prop --calcite-stepper-bar-inactive-fill-color: Specifies the fill color of items in the step bar.
* @prop --calcite-stepper-bar-active-fill-color: Specifies the fill color of active items in the step bar.
* @prop --calcite-stepper-bar-complete-fill-color: Specifies the fill color of complete items in the step bar.
* @prop --calcite-stepper-bar-error-fill-color: Specifies the fill color of error items in the step bar.
* @prop --calcite-stepper-bar-gap: Specifies the space between items in the component.
* @prop --calcite-stepper-bar-inactive-fill-color: Specifies the fill color of items in the component.
* @prop --calcite-stepper-bar-active-fill-color: Specifies the fill color of active items in the component.
* @prop --calcite-stepper-bar-complete-fill-color: Specifies the fill color of complete items in the component.
* @prop --calcite-stepper-bar-error-fill-color: Specifies the fill color of error items in the component.
*/

:host([scale="s"]) {
Expand Down
2 changes: 1 addition & 1 deletion packages/calcite-components/src/components/tabs/tabs.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
*
* These properties can be overridden using the component's tag as selector.
*
* @prop --calcite-tab-background-color: When `bordered`, specifies the component's background color.
* @prop --calcite-tab-background-color: When `bordered`, specifies the component's background color when `bordered`.
Copy link
Copy Markdown
Member

@geospatialem geospatialem May 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@DitwanP Can you do a follow-up PR to remove the extra "when bordered" at the end of this sentence?

Copy link
Copy Markdown
Contributor Author

@DitwanP DitwanP May 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oops! on it.

* @prop --calcite-tab-border-color: Specifies the component's border color.
*/

Expand Down
4 changes: 2 additions & 2 deletions packages/calcite-components/src/components/time-picker/time-picker.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
*
* These properties can be overridden using the component's tag as selector.
*
* @prop --calcite-time-picker-background-color: The background color of the time picker.
* @prop --calcite-time-picker-corner-radius: The border radius of the time picker.
* @prop --calcite-time-picker-background-color: Specifies the background color of the time picker.
* @prop --calcite-time-picker-corner-radius: Specifies the border radius of the time picker.
Comment thread
DitwanP marked this conversation as resolved.
* @prop --calcite-time-picker-button-background-color-hover: Specifies the button's background color when hovered or focused.
* @prop --calcite-time-picker-button-background-color-press: Specifies the button's background color when active.
* @prop --calcite-time-picker-color: Specifies the component's text color.
Expand Down
Loading