Improved Button Usability and Consistency (Issue #378)
This PR addresses two key issues related to button usability and consistency in the application:
-
Added loading spinner and disabled state to buttons in various parts of the application, including the sign-up/login page, video rendering pages, and home page. This enhancement prevents users from clicking buttons multiple times while waiting for backend API responses, improving the overall user experience.
-
Standardized the button styles for "Mark as Complete" and "Slides" on the video rendering pages to match the rest of the application's buttons. This ensures a consistent look and feel across all buttons, enhancing the visual appeal and usability of the application.
Changes Made:
- Added loading spinner and disabled state to affected buttons.
- Standardized button styles for "Mark as Complete" and "Slides" on the video rendering pages.
Affected Areas:
- Sign-up/Login Page: Signin Button
- Video Rendering Page: Mark as Complete Button, Add Comment Button, Upvote Button, Downvote Button
- Home Page: Refresh Database Button
This PR improves the overall usability and consistency of buttons in the application, addressing the issues mentioned in #378.
Button Ui Example-->
Before ->
After ->
Loading Spinner Example -->
Before ->
https://github.com/code100x/cms/assets/112716576/14a78022-2fa9-409f-9a61-4d96ddc98c18
After ->
https://github.com/code100x/cms/assets/112716576/0bcce8f6-2501-44c8-9795-fb171976cfb9