Skip to content
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.

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

style(loader): Replace all loaders with centered blue circular spinner #927

Merged
merged 3 commits into from
Mar 6, 2025

Conversation

abansal15
Copy link
Contributor

Description

Replaced the default triangular loader with the blue circular spinner to maintain UI consistency across the site. Updated the corresponding CSS and markup without affecting functionality.

Related issue

#924

Screenshots (if appropriate):

Screenshot 2025-03-04 130133

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

  • My code follows the code style of this project.
  • [] My change requires a change to the documentation.
  • [] I have updated the documentation accordingly.

@dpgiakatos dpgiakatos self-requested a review March 5, 2025 06:02
Copy link
Member

@dpgiakatos dpgiakatos left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello, I have only one question. I added it inline. Overall, this is a good PR. After my question is answered, I will continue the code review. Thanks.

Comment on lines 643 to 644
<div class="row q-col-gutter-md">
<div class="col-6">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why did you change the style here?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Revert the changes here

</QCardSection>
</QCard>
</div>
<div class="col">
<div class="col-6">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also, here the change of style is related to the changes in 643.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Revert the changes here

@abansal15
Copy link
Contributor Author

@dpgiakatos i have done the changes in these style beacuse when i was solving the issue then i was facing a problem that charts Alarms over Time and Alarms by Severities were appearing one below the other instead of in the same row as intended therefore i tried to change the style to solve this and done the above changes and just now when i revert these style changes in my local then i found that there is much not big problem but with these changes charts are taking half of the container width and ensuring a consistent and balanced layout.. if you did prefer to revert these changes please let me know..

@dpgiakatos
Copy link
Member

This depends on the screen size and your screen resolution. Before making any changes in the style, make sure that you have tried all the available screen sizes and resolutions. If you have not tested them, then you should either test them and have a detailed report or revert to the previous settings.

@dpgiakatos
Copy link
Member

If adding the new loading component breaks the page, then you should adjust the loading component, not the page itself.

@abansal15
Copy link
Contributor Author

@dpgiakatos when i revert the above style then also its working fine and no page break is there then should i revert these changes ?

@dpgiakatos dpgiakatos self-requested a review March 6, 2025 02:21
Copy link
Member

@dpgiakatos dpgiakatos left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please address my inline comments. Thank you.

Comment on lines 643 to 644
<div class="row q-col-gutter-md">
<div class="col-6">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Revert the changes here

</QCardSection>
</QCard>
</div>
<div class="col">
<div class="col-6">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Revert the changes here

@abansal15
Copy link
Contributor Author

Hello @dpgiakatos i have done the changes as per instructed please review it ..

@dpgiakatos dpgiakatos self-requested a review March 6, 2025 05:11
Copy link
Member

@dpgiakatos dpgiakatos left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks.

@dpgiakatos dpgiakatos merged commit 2d7ba83 into InternetHealthReport:master Mar 6, 2025
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants