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

**Related Issue:** n/a

## Summary
Updates token documentation for the following components:
- `input-number`
- `shell-panel`
- `stepper-item`
- `stepper`
- `tabs`
- `time-picker`

Author: DitwanP

packages/calcite-components/src/components/input-number/input-number.scss

@@ -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.
  * @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.

packages/calcite-components/src/components/shell-panel/shell-panel.scss

@@ -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.

packages/calcite-components/src/components/stepper-item/stepper-item.scss

@@ -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.
 */
 

packages/calcite-components/src/components/stepper/stepper.scss

@@ -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"]) {

packages/calcite-components/src/components/tabs/tabs.scss

@@ -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`.
  * @prop --calcite-tab-border-color: Specifies the component's border color.
  */
 

packages/calcite-components/src/components/time-picker/time-picker.scss

@@ -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.
  * @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.