I’m using Concrete 9 and developing my first theme. My issue is when logged in as an admin the toolbar appears at the top of the page, but apparently has a lower z-index value than my site. For that reason when I start to scroll, the website covers the toolbar making it inaccessible.
Is there a way to create a custom css page that I can overwrite the z-index for the toolbar? (I don’t want to have to keep editing every time I update my version of Concrete). I’d change the z-index on my site, but the theme I am using is filled with z-index statements and I’m worried I’ll mess up the theme.
Just inspect the admin tool bar find the class or I’d it uses then in your theme CSS just set it’s z-index with a really high value and add ! important on it.
Thanks. I have already tried that, and at least the tag I believe is the right one isn’t working. I’ll keep plugging away, but if anyone knows the correct css tag for the toolbar please let me know. This is driving me nuts.
Create a css folder in the applications folder (application/css/)
Next copy the cms.css file from concrete/css/ folder to the application/css/ folder (application/css/cms.css)
Go to line 69 of the cms.css file and find ‘div#ccm-toolbar{background-color:#f7f7f7;border-bottom:1px solid #e9ecef;height:48px;left:0;position:fixed;top:0;width:100%;z-index:1000}’
and change the z-index as you like.
Now when you update your concrete core it will not overwrite your over-ride file.
2 Likes
You are beyond awesome!! Thank you so much. That worked perfectly.