Skip to content

refactor(progress-circular): rename base-circle-color to track-color for consitency with linear-bar #565

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
simeonoff merged 2 commits into from
Apr 16, 2026
Merged

refactor(progress-circular): rename base-circle-color to track-color for consitency with linear-bar #565

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
85dc09d
refactor(progress-circular): rename base-circle-color to track-color …
desig9stein Apr 15, 2026
7a507ca
Merge branch 'master' into mpopov/circular/rename-css-token
simeonoff Apr 16, 2026
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
6 changes: 3 additions & 3 deletions packages/theming/sass/themes/components/progress/_circular-theme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
/// The fill-color-default can accept a single color or a list of two colors for gradient effect.
///
/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
/// @param {Color} $base-circle-color [null] - The base circle fill color.
/// @param {Color} $track-color [null] - The base circle fill color.
/// @param {Color | List<Color>} $fill-color-default [null] - The progress circle fill color. Can be a single color or list of two colors for gradient.
/// @param {Color} $fill-color-danger [null] - The track danger fill color.
/// @param {Color} $fill-color-warning [null] - The track warning fill color.
Expand All @@ -39,7 +39,7 @@
/// @include igx-progress-circular($my-progress-circle-theme);
@function progress-circular-theme(
$schema: $light-material-schema,
$base-circle-color: null,
$track-color: null,
$fill-color-default: null,
$fill-color-danger: null,
$fill-color-warning: null,
Expand Down Expand Up @@ -78,7 +78,7 @@
$theme,
(
selector: $selector,
base-circle-color: $base-circle-color,
track-color: $track-color,
fill-color-default: $fill-color-default,
fill-color-default-start: $fill-color-default-start,
fill-color-default-end: $fill-color-default-end,
Expand Down
8 changes: 4 additions & 4 deletions packages/theming/sass/themes/schemas/components/dark/_progress.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,9 +91,9 @@ $dark-indigo-progress-linear: extend(

/// Generates a base dark progress-circular schema.
/// @type Map
/// @prop {Map} base-circle-color [color: ('gray', 300)] - The base circle fill color.
/// @prop {Map} track-color [color: ('gray', 300)] - The base circle fill color.
$dark-base-progress-circular: (
base-circle-color: (
track-color: (
color: (
'gray',
300,
Expand Down Expand Up @@ -125,14 +125,14 @@ $dark-bootstrap-progress-circular: extend($bootstrap-progress-circular, $dark-ba

/// Generates a dark indigo progress-circular schema.
/// @type Map
/// @prop {Map} base-circle-color [contrast-color: ('gray', 50, .2)] - The base circle fill color.
/// @prop {Map} track-color [contrast-color: ('gray', 50, .2)] - The base circle fill color.
/// @prop {Map} text-color [contrast-color: ('gray', 50, .8)] - The value text color.
/// @requires $indigo-progress-circular
$dark-indigo-progress-circular: extend(
$indigo-progress-circular,
$dark-base-progress-circular,
(
base-circle-color: (
track-color: (
contrast-color: (
'gray',
50,
Expand Down
8 changes: 4 additions & 4 deletions packages/theming/sass/themes/schemas/components/light/_progress.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -237,7 +237,7 @@ $indigo-progress-linear: extend(

/// Generates a base light progress-circular schema.
/// @type Map
/// @prop {Map} base-circle-color [color: ('gray', 300)] - The base circle fill color.
/// @prop {Map} track-color [color: ('gray', 300)] - The base circle fill color.
/// @prop {Map} fill-color-default [color: ('primary', 500)] - The progress circle default fill color.
/// @prop {Map} fill-color-danger [color: ('error')] - The progress circle danger fill color.
/// @prop {Map} fill-color-warning [color: ('warn')] - The progress circle warning fill color.
Expand All @@ -248,7 +248,7 @@ $indigo-progress-linear: extend(
/// @prop {List} track-border-radius [rem(0)] - The border radius used for the progress bar track.
$light-progress-circular: extend(
(
base-circle-color: (
track-color: (
color: (
'gray',
300,
Expand Down Expand Up @@ -342,7 +342,7 @@ $bootstrap-progress-circular: extend(

/// Generates an indigo progress-circular schema.
/// @type Map
/// @prop {Map} base-circle-color [color: ('gray', 900, .15)] - The base circle fill color.
/// @prop {Map} track-color [color: ('gray', 900, .15)] - The base circle fill color.
/// @prop {Map} fill-color-default [color: ('primary', 400)] - The track default fill color.
/// @prop {Map} fill-color-danger [color: ('error', 400)] - The track danger fill color.
/// @prop {Map} fill-color-warning [color: ('warn', 400)] - The track warning fill color.
Expand All @@ -353,7 +353,7 @@ $bootstrap-progress-circular: extend(
$indigo-progress-circular: extend(
$light-progress-circular,
(
base-circle-color: (
track-color: (
color: (
'gray',
900,
Expand Down
Loading