CSS issue
avatar brianteeman
brianteeman
13 Nov 2013

Steps to reproduce the issue

In the list view scroll down and observe the green open button floats above the blue subnav bar but the other buttons correctly float below it.

avatar brianteeman brianteeman - open - 13 Nov 2013
avatar brianteeman brianteeman - open - 13 Nov 2013
avatar mbabker
mbabker - comment - 13 Nov 2013

We have this issue too with other implementations of this template, see http://joomla.github.io/phpdoc-jdotorg/packages/Joomla.Libraries.html (I don't think we have anything on the developer site with this type of button use). So if there is a good fix for this, make sure I'm pointed to it so it can be applied universally.

avatar b2z
b2z - comment - 13 Nov 2013

The only fix here is to apply z-index: 3 to .subnav.affix class. Check the fix on my live demo. But it is BS related as I understand and do not know how this will affect other things. Should not in fact :)

avatar elkuku
elkuku - comment - 13 Nov 2013

This also happens on the "bootstrap switch"
j tracker bugs - new item 2013-11-13 15-54-37

avatar b2z
b2z - comment - 13 Nov 2013

I just removed z-index: 3 from my live demo. But it should help also in this case.

avatar b2z
b2z - comment - 15 Nov 2013

Well another way to fix it is to apply z-index:0 to

.btn-group > .btn:hover, .btn-group > .btn:focus, 
.btn-group > .btn:active, .btn-group > .btn.active

And also .has-switch label has z-index: 100. OMG 0_o Why that is needed for a "bootstrap switch"? Cmon...

UPDATE:
After digging a little bit more I found the solution that covers all ugly z-index things (see also #192) - applying z-index: 1020 to .subnav.affix.

Should we stay with it?

avatar betweenbrain
betweenbrain - comment - 15 Nov 2013

OMG 0_o Why that is needed for a "bootstrap switch"? Cmon...

Exactly! You shouldn't need to muck around with such crazy z-indexes. But, your updated solution sounds reasonable (I can't test ATM though), short of rewriting all of the z-indexes in Bootstrap.

avatar mbabker
mbabker - comment - 15 Nov 2013

@betweenbrain - I added you to have full access to the Joomla org on here now. You'll see a couple of private repos including the source files for this version of the j.org template. FWIW, it hasn't been touched yet for CMS 3.2 (but shouldn't need to I hope). If you can update that so everyone using it can update their sources with these fixes until we get it on a CDN, you'd be helping a lot of folks out.

avatar brianteeman
brianteeman - comment - 15 Nov 2013

OT but the dev site suffers from similar issues at certain resolutions

avatar mbabker
mbabker - comment - 15 Nov 2013

As does the API site. Hence my suggestion that if we get this fixed, we do it in our template so we're fixing all sites at once (or whenever their admins get around to updating).

avatar betweenbrain
betweenbrain - comment - 15 Nov 2013

@betweenbrain - I added you to have full access to the Joomla org on here now. You'll see a couple of private repos including the source files for this version of the j.org template. FWIW, it hasn't been touched yet for CMS 3.2 (but shouldn't need to I hope). If you can update that so everyone using it can update their sources with these fixes until we get it on a CDN, you'd be helping a lot of folks out.

Thanks @mbabker, I'll do my best. I'll create a branch and make a PR when I feel that I have something that helps.

avatar elkuku
elkuku - comment - 15 Nov 2013

all :+1: up @betweenbrain

avatar betweenbrain
betweenbrain - comment - 15 Nov 2013

After digging a little bit more I found the solution that covers all ugly z-index things (see also #192) - applying z-index: 1020 to .subnav.affix.

This does seem to fix the issue in the Joomla.org template. Thanks!

avatar betweenbrain betweenbrain - reference | - 15 Nov 13
avatar b2z
b2z - comment - 15 Nov 2013

:+1: goes to me :laughing: Will push changes also to our CSS then ;)

avatar mbabker mbabker - close - 26 Nov 2013

Add a Comment

Login with GitHub to post a comment