Add progress spinner component

rojanDinc commented 3 years ago

Closing #132

google-cla[bot] commented 3 years ago

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project (if not, look below for help). Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

:memo: Please visit https://cla.developers.google.com/ to sign.

Once you've signed (or fixed any issues), please reply here with @googlebot I signed it! and we'll verify it.

What to do if you already signed the CLA

Individual signers

It's possible we don't have your GitHub username or you're using a different email address on your commit. Check your existing CLA data and verify that your email is set on your git commits.

Corporate signers

Your company has a Point of Contact who decides which employees are authorized to participate. Ask your POC to be added to the group of authorized contributors. If you don't know who your Point of Contact is, direct the Google project maintainer to go/cla#troubleshoot (Public version).
The email used to register you as an authorized contributor must be the email used for the Git commit. Check your existing CLA data and verify that your email is set on your git commits.
The email used to register you as an authorized contributor must also be attached to your GitHub account.

ℹ️ Googlers: Go here for more info.

rojanDinc commented 3 years ago

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project (if not, look below for help). Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

📝 Please visit https://cla.developers.google.com/ to sign.

Once you've signed (or fixed any issues), please reply here with @googlebot I signed it! and we'll verify it.

What to do if you already signed the CLA

Individual signers

It's possible we don't have your GitHub username or you're using a different email address on your commit. Check your existing CLA data and verify that your email is set on your git commits.

Corporate signers

Your company has a Point of Contact who decides which employees are authorized to participate. Ask your POC to be added to the group of authorized contributors. If you don't know who your Point of Contact is, direct the Google project maintainer to go/cla#troubleshoot (Public version).

The email used to register you as an authorized contributor must be the email used for the Git commit. Check your existing CLA data and verify that your email is set on your git commits.

The email used to register you as an authorized contributor must also be attached to your GitHub account.

ℹ️ Googlers: Go here for more info.

@googlebot I signed it!

google-cla[bot] commented 3 years ago

We found a Contributor License Agreement for you (the sender of this pull request), but were unable to find agreements for all the commit author(s) or Co-authors. If you authored these, maybe you used a different email address in the git commits than was used to sign the CLA (login here to double check)? If these were authored by someone else, then they will need to sign a CLA as well, and confirm that they're okay with these being contributed to Google. In order to pass this check, please resolve this problem and then comment @googlebot I fixed it.. If the bot doesn't comment, it means it doesn't think anything has changed.

ℹ️ Googlers: Go here for more info.

rojanDinc commented 3 years ago

We found a Contributor License Agreement for you (the sender of this pull request), but were unable to find agreements for all the commit author(s) or Co-authors. If you authored these, maybe you used a different email address in the git commits than was used to sign the CLA (login here to double check)? If these were authored by someone else, then they will need to sign a CLA as well, and confirm that they're okay with these being contributed to Google. In order to pass this check, please resolve this problem and then comment @googlebot I fixed it.. If the bot doesn't comment, it means it doesn't think anything has changed.

ℹ️ Googlers: Go here for more info.

@googlebot I fixed it.

rojanDinc commented 3 years ago

Many thanks for the pull request.

Could you please explain the benefit of introducing a new component for this?

There is already a mat-spinner component provided by Angular Material, so as far as I can see we should not need to introduce any new components here.

We should be able to achieve the desired positioning just by applying CSS styles to the mat-spinners that we already have. I would expect the whole issue should be possible to close just by modifying existing CSS files.

Could you please let me know if you see a problem with that approach?

I was considering the reusability of the component and the ease of changing the underlying spinner if that would be needed in the future. But you're right I could introduce a global CSS class which all mat-spinner could use if they should be centered but they would need to be wrapped by a div to get the desired outcome. I could go ahead and implement your suggestion. What are your thoughts?

amdw commented 3 years ago

Thanks for explaining! I think we're OK not to have a separate component for now - we can just stick with mat-spinner. I think it's very unlikely we'd move away from mat-spinner in the future, and if we do, we can always create a new component at that point.

I think it should be possible to make the necessary styling changes purely by putting a mat-spinner { ... } clause into the CSS files of the components that use the spinner. If this isn't possible, then adding a div around the spinner in order to apply additional styles is also fine.

rojanDinc commented 3 years ago

Yes I managed to center the mat-spinner by using a css class I created called centered. This css class should work for any element that should be centered. Im against forcing all mat-spinners to be centered I think it should be decided with a css class, what do you think?

google / peoplemath