#42 fix for checkbox, file, and radio input focus #51
Conversation
Added styles for checkbox, file, and radio input focus as they were not affected by borders.
Added a style so .pure-menu-separator will also work in vertical menu and not just horizontal.
made sure sub menus, the separator is displayed horizontally again
| @@ -109,3 +109,17 @@ | |||
| padding-right:30px; | |||
| } | |||
|
|
|||
| /* Adjusting separator for vertical menus */ | |||
| .pure-menu-horizontal li.pure-menu-separator { | |||
| height: 20px; | |||
There was a problem hiding this comment.
This feel brittle; we should see if there's a more bullet-proof way to make this expand to fill the height of the container and works reasonable across browsers.
There was a problem hiding this comment.
I have updated to what might possibly be a better solution in 8cb7efc. Now sets a height on the menu of 2.4em, and then a 50% height on the separator. Tested in Chrome and IE7+
|
@codepb looks good, thanks! I think it's worth us investigating a better way to make the vertical separator fill its container than using a hard-coded |
|
@ericf no problem. I agree with the hard-coded height being brittle. I couldn't find a responsive solution to fill 100% so fell back on the 20px separator. I believe the menus would require a bit of a rework to be able to do that but someone may have a better idea that I haven't thought about. |
Changed to allow for relative measurements for the separator.
|
@ericf I believe I have made a more robust solution now. It uses em to set a menu height, and a percentage height on separator. |
| .pure-menu-horizontal li.pure-menu-separator { | ||
| height: 50%; | ||
| width: 1px; | ||
| margin: 2px 7px; |
There was a problem hiding this comment.
I think we should now remove the top/bottom margin since you now have height: 50%.
@tilomitra here's another place where the values and units (7px) don't make sense to me. I think this should move to 0.5em which would translate to 8px, which then makes sense for a base font size of 16px.
|
@codepb great idea, I think this is much better! @tilomitra as part of a second pass, I think we need to clean up the pixel values used to something that's more consistent and fits in better with the base |
Removed the top and bottom margin from the separator in the horizontal menu.
| .pure-menu-horizontal li li.pure-menu-separator { | ||
| height: 1px; | ||
| width: auto; | ||
| margin: 7px 2px; |
There was a problem hiding this comment.
Could we use ems instead of px to be consistent?
There was a problem hiding this comment.
Let's do this in another pass, there's px all over the place in this file.
|
@ericf Ok I can go through and clean up the px/em stuff later. Let's pull this in. |
|
@codepb Merging this in now. I will add the HISTORY.md entries for this stuff as well. Thanks so much! In the future it will probably be easier if you end up creating feature/topic branches, that way this could have been split into two PRs and be isolated from your |
|
@ericf no problem, I realised that was easier after I started doing the work! Thanks for the advice. |
Added styles for checkbox, file, and radio input focus as they were not
affected by borders.
Tested in IE7,8,9,10 and Chrome