C2LC-400: Removed seemingly unnecessary margin-bottom from toggle switch inner circle. #204
Conversation
…tch inner circle.
|
In working on C2LC-333, Sepi pointed out issues with the vertical alignment of the toggle switch inner circle. Although I suspect those issues were unique to the pull, I did notice that the bottom margin seemingly has no effect, this pull cleans that up. |
| @@ -26,7 +26,6 @@ | |||
| background: #F1F1F1; | |||
| border-radius: 50%; | |||
| display: inline-block; | |||
| margin-bottom: 0.1rem; | |||
There was a problem hiding this comment.
Apparently this margin has no effect at all -- I changed it to 100rem and still look the same, which means that we can get rid of margin-top on the next line as well.
There was a problem hiding this comment.
I cleaned this up and a similar one in the Audio Feedback toggle. I checked the expand add node as well.
|
Thanks for the work @the-t-in-rtf and I apologize for the late review. I have checked and what's causing that weird vertical alignment issue was max-height set on ToggleSwitch component on line https://github.com/the-t-in-rtf/c2lc-coding-environment/blob/027ed1953ca00c8f8e93c24f7a75887fe53216ed/src/ToggleSwitch.scss#L5. AudioToggleSwitch has the value set to 2.6 and other toggle switches have 2.5rem specified in ToggleSwitch component. After I changed the max-height value set in ToggleSwitch to 2.6rem, every toggle switches look vertically centred. We can also remove all the margins (not just margin bottoms you removed, but also margin-tops) specified for the inner circle of the toggle switches. |
|
The max height was already set to I was able to remove the margin-top from the audio feedback toggle's inner circle, but it appears necessary for the main toggles. If I comment it out the alignment for those is off again. With the margin:
And without:
|
Currently that AudioToggleSwitch's max height is 2.6 but the ToggleSwitch's max height is set to 2.5. |
|
I get it now, you changed all of the toggles to use 2.6rem. I thought you meant that one of them didn't have rem units. |
See C2LC-400 for details.