feat: add ProgressBar component #3321

dpschen · 2023-03-28T11:46:54Z

dpschen commented

2023-03-28 11:46:54 +00:00

Cherry picked and rebased from #3180

Full rebase coming in follow up PR

Cherry picked and rebased from https://kolaente.dev/vikunja/frontend/pulls/3180 Full rebase coming in follow up PR

dpschen added 1 commit 2023-03-28 11:46:56 +00:00

continuous-integration/drone/pr Build is passing Details

5643dfc000

feat: add ProgressBar component

dpschen requested review from konrad 2023-03-28 11:47:25 +00:00

konrad was assigned by dpschen

2023-03-28 11:47:30 +00:00

konrad reviewed 2023-03-28 11:51:26 +00:00

src/components/misc/ProgressBar.vue Outdated

						
				@ -0,0 +70,4 @@

					@each $name, $pair in $colors {

						$color: nth($pair, 1);

						&.is-#{$name} {

							&::-webkit-progress-value {

konrad commented

2023-03-28 11:50:15 +00:00

Why the different rules instead of something like

&::-webkit-progress-value,
&::-moz-progress-bar,
&::-ms-fill {
	--progress-value-background-color: var(--#{$name}, #{$color}); 
}

Why the different rules instead of something like ``` &::-webkit-progress-value, &::-moz-progress-bar, &::-ms-fill { --progress-value-background-color: var(--#{$name}, #{$color}); } ```

dpschen commented

2023-03-28 12:59:35 +00:00

This would be dropped by some browsers because prefixed selectors need individual rules, because invalid rules might make the whole selector invalid.

👍 1

konrad commented

2023-03-28 13:13:48 +00:00

yeah okay that makes sense

konrad marked this conversation as resolved

src/styles/theme/theme.scss Outdated

						
				@ -107,7 +90,6 @@ button.table {

				.color-bubble {

				  display: inline-block;

				  border-radius: 100%;

				  margin-right: 4px;

konrad commented

2023-03-28 11:51:23 +00:00

Isn't this still used?

dpschen commented

2023-03-28 13:00:40 +00:00

Yes. Right now. Will remove here and instead move to follow up pr

👍 1

frederick commented

2023-03-28 11:52:00 +00:00

Hi dpschen!

Thank you for creating a PR!

I've deployed the changes of this PR on a preview environment under this URL: https://3321-add-progressbar-component--vikunja-frontend-preview.netlify.app

You can use this url to view the changes live and test them out.
You will need to manually connect this to an api running somehwere. The easiest to use is https://try.vikunja.io/.

Have a nice day!

Beep boop, I'm a bot.

Hi dpschen! Thank you for creating a PR! I've deployed the changes of this PR on a preview environment under this URL: https://3321-add-progressbar-component--vikunja-frontend-preview.netlify.app You can use this url to view the changes live and test them out. You will need to manually connect this to an api running somehwere. The easiest to use is https://try.vikunja.io/. Have a nice day! > Beep boop, I'm a bot.

dpschen commented

2023-03-28 13:02:37 +00:00

Maybe let's wait with the merge until I finish the follow up. I thought that component might be compatible alone. But seems like I need to adjust singletaskinproject – which is coming in the second part.

konrad commented

2023-03-28 13:14:48 +00:00

Maybe let's wait with the merge until I finish the follow up. I thought that component might be compatible alone. But seems like I need to adjust singletaskinproject – which is coming in the second part.

Sounds like a good idea.

> Maybe let's wait with the merge until I finish the follow up. I thought that component might be compatible alone. But seems like I need to adjust singletaskinproject – which is coming in the second part. Sounds like a good idea.

konrad force-pushed add-progressbar-component from 5643dfc000 to 7bb110b20e

2024-02-07 10:17:22 +00:00

Compare

konrad added 1 commit 2024-02-07 10:24:27 +00:00