Implemented Customized Scrollbar Feature #333
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
In response to user feedback, this commit addresses the spacing concerns within the GetNighthawk website's UI. The existing design was visually appealing but lacked sufficient spacing between certain components. Changes Made: - Added margin-bottom to the analysis, distribution, and standards-based cards to create a clear distinction between them and improve readability. - Introduced appropriate spacing between the 'Nighthawk & Meshery' section and the 'Layer 7 Performance Analysis' division to enhance the overall visual balance. These adjustments have been carefully implemented to maintain the smooth and polished UI while ensuring a more comfortable viewing experience for users. The improved spacing creates a harmonious layout, allowing each component to breathe and stand out effectively. Resolves Issue: layer5io#290 Signed-off-by: Akhilender [email protected] Signed-off-by: Akhilender <[email protected]>
Refactored the CSS code to introduce a custom scrollbar consistent with modern design trends. The new scrollbar design aligns with the desired appearance, replacing the default one. Changes Made: - Added custom scrollbar CSS rules. - Removed the default scrollbar appearance. These adjustments have been carefully implemented to maintain the smooth and polished UI. Resolves Issue: layer5io#327 Signed-off-by: Akhilender <[email protected]>
In response to user feedback, this commit addresses the spacing concerns within the GetNighthawk website's UI. The existing design was visually appealing but lacked sufficient spacing between certain components. Changes Made: - Added margin-bottom to the analysis, distribution, and standards-based cards to create a clear distinction between them and improve readability. - Introduced appropriate spacing between the 'Nighthawk & Meshery' section and the 'Layer 7 Performance Analysis' division to enhance the overall visual balance. These adjustments have been carefully implemented to maintain the smooth and polished UI while ensuring a more comfortable viewing experience for users. The improved spacing creates a harmonious layout, allowing each component to breathe and stand out effectively. Resolves Issue: layer5io#290 Signed-off-by: Akhilender <[email protected]>
Refactored the CSS code to introduce a custom scrollbar consistent with modern design trends. The new scrollbar design aligns with the desired appearance, replacing the default one. Changes Made: - Added custom scrollbar CSS rules. - Removed the default scrollbar appearance. These adjustments have been carefully implemented to maintain the smooth and polished UI. Resolves Issue: layer5io#327 Signed-off-by: Akhilender <[email protected]>
✅ Website preview ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
malaviya-parth
suggested changes
Sep 8, 2023
There was a problem hiding this comment.
Have this type of styling on the scrollbar to keep it in Sync for all websites
Reference: Layer5.io
…ighthawk into customscrollbar
- Made the required changes for the custom scrollbar to be in sync with remaining all websites of Layer5 Organization. Signed-off-by: Akhilender <[email protected]>
malaviya-parth
suggested changes
Sep 8, 2023
Signed-off-by: Akhilender <[email protected]>
|
Sure @malaviya-parth. Thank you : ) ... |
malaviya-parth
suggested changes
Sep 8, 2023
There was a problem hiding this comment.
The code for scrollbar in docs/_sass/getnighthawk.scss differs from the one you defined in docs/_sass/layout.scss either remove the scrollbar code from docs/_sass/getnighthawk.scss if this doesn't work then make it the same to the one in docs/_sass/layout.scss.
Also the margin changes was not defined in the issue, so I guess we should it as it was originally.
This comment was marked as spam.
This comment was marked as spam.
Sorry, something went wrong.
Signed-off-by: Akhilender Bongirwar <[email protected]>
Removed the extra spacing code form the issue customscrollbar. Signed-off-by: Akhilender Bongirwar <[email protected]>
|
@malaviya-parth, Could you please review the changes. |
|
@malaviya-parth , Could you please merge the PR : ) |
I can't as I am currently don't hold that position, but don't worry after the discussion in the meeting, Maintainers will merge it. |
vishalvivekm
approved these changes
Oct 2, 2023
|
LGTM 👍 |
// @Mohith234 |
|
@leecalcote ^^ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Refactored the CSS code to introduce a custom scrollbar consistent with modern design trends. The new scrollbar design aligns with the desired appearance, replacing the default one.
Changes Made:
These adjustments have been carefully implemented to maintain the smooth
and polished UI.
This PR fixes #327
Notes for Reviewers
Signed commits