884 accordion styling(normal&dark theme) #888
Merged
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
css changes for button padding
Accordion styles Default Slim Dark
Saravanan-Tangoe
approved these changes
Oct 19, 2022
projects/go-lib/src/lib/components/go-accordion/go-accordion-panel.component.scss
Show resolved
Hide resolved
projects/go-lib/src/lib/components/go-accordion/go-accordion-panel.component.scss
Outdated
Show resolved
Hide resolved
stolve
reviewed
Jan 31, 2023
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.
[Chore] Accordion Styling (Normal & Dark theme) #884
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
Resolves 884
What is the new behavior?
Changed below styles
Default Accordion
Header should be equivalent to an H4 (18px - 1.125rem).
The body contains unexpected padding around the content (1.5rem top/bottom) where UX outlined in as 1rem all around.
The body text should always be 14px (0.875rem) default.
Slim Accordion
Header should be equivalent to an H5 (14px - 0.875rem).
Header section padding should be 10px (0.625rem) top and bottom and 16px(1rem) left and right
The body text should always be 14px (0.875rem) default.
The padding around the body should be 16px (1rem) all around.
Dark Theme
Follows the above rules with the following additions
Header background color when collapsed is #313536
Header background color hovered when collapsed is #313536 3.5% darkened (HEX equivalent #292C2D)
Header background color when expanded is #181C1C.
Header background color hovered when expanded is #181C1C 3.5% darkened (HEX equivalent #101212)
border-radius needs to be 0px when the accordion reached the full width of the off-canvas container.
Does this PR introduce a breaking change?