Skip to content

Commit

Permalink
feat(progress): basic variant and support empty bar
Browse files Browse the repository at this point in the history
Added new basic variant for progress, which removes the remaining bar background
Supported a proper minimum bar width when it does not contain any content
  • Loading branch information
lubber-de committed May 13, 2024
1 parent 2f37293 commit 4c35b29
Show file tree
Hide file tree
Showing 2 changed files with 18 additions and 5 deletions.
22 changes: 17 additions & 5 deletions src/definitions/modules/progress.less
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,14 @@
border-radius: @borderRadius;
}

& when (@variationProgressBasic) {
.ui.basic.progress {
background: transparent;
border: none;
box-shadow: none;
}
}

.ui.progress:first-child {
margin: @firstMargin;
}
Expand All @@ -50,14 +58,16 @@
line-height: 1;
position: @barPosition;
width: @barInitialWidth;
min-width: @barMinWidth;
background: @barBackground;
border-radius: @barBorderRadius;
transition: @barTransition;
overflow: hidden;
&:not(:empty) {
min-width: @barMinWidth;
}
}
.ui.ui.ui.progress:not([data-percent]):not(.indeterminate) .bar,
.ui.ui.ui.progress[data-percent="0"]:not(.indeterminate) .bar {
.ui.ui.ui.progress:not([data-percent]):not(.indeterminate) .bar:not(:empty),
.ui.ui.ui.progress[data-percent="0"]:not(.indeterminate) .bar:not(:empty) {
background: transparent;
}
.ui.progress[data-percent="0"] .bar .progress {
Expand Down Expand Up @@ -328,7 +338,9 @@

.ui.active.progress .bar {
position: relative;
min-width: @activeMinWidth;
&:not(:empty) {
min-width: @activeMinWidth;
}
}
.ui.active.progress .bar::after {
content: "";
Expand Down Expand Up @@ -384,7 +396,7 @@
Inverted
--------------- */

.ui.inverted.progress {
.ui.inverted.progress:not(.basic) {
background: @invertedBackground;
border: @invertedBorder;
}
Expand Down
1 change: 1 addition & 0 deletions src/themes/default/globals/variation.variables
Original file line number Diff line number Diff line change
Expand Up @@ -643,6 +643,7 @@
/* Progress */
@variationProgressInverted: true;
@variationProgressDisabled: true;
@variationProgressBasic: true;
@variationProgressIndicating: true;
@variationProgressIndeterminate: true;
@variationProgressSliding: true;
Expand Down

0 comments on commit 4c35b29

Please sign in to comment.