Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Re: Help choosing CSS framework
I’m looking into Foundation now, because 1) Joshua Vaage has setup a repo at GitHub called: > txp.foundation and I think that’s a good thing … and 2) all other (small) frameworks mostly have only one dev working at it. I presume Foundation will be updated frequently the years to come and version 4 is more than interesting. The grid is very easy to work with.
If there are more Txp men/women going into Foundation then that would give txp.foundation a real boost. This is an invitation … :)
I have setup a static site (only Foundation (raw); no Txp) to play with the grid and layout > Foundation-3C-1200-2/ … and of course I’ve a question:
The default nav of Foundation is rather complicated (for me that is) and I found and like a ‘better’ nav: Responsive Nav … but the #nav is displayed as an overlay on top of the header … instead I want #nav ‘above’ the header. I’ve tried everything possible that I know of (I’m not a dev) but I can’t manage this … :(
Is this possible and how can it be achieved?
[edit]
Same question on StackOverflow
Last edited by RedFox (2013-09-16 12:35:34)
Offline
Re: Help choosing CSS framework
RedFox wrote:
The default nav of Foundation is rather complicated (for me that is) and I found and like a ‘better’ nav: Responsive Nav … but the #nav is displayed as an overlay on top of the header … instead I want #nav ‘above’ the header. I’ve tried everything possible that I know of (I’m not a dev) but I can’t manage this … :(
Wait, I’m confused… Looking at that ‘Responsive Nav’ demo, on smaller screens (aka phones), the full navigation slides down from the top, and pushes the header and the rest of the page down the screen. Is that not what you want? An overlay would be the menu covering/hiding the header of the page, or IOW position on top of the header as new layer.
(Tested both desktop Safari and iOS6 Safari).
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Help choosing CSS framework
Hi Phil … sorry, that my post is confusing you … maybe my English isn’t good enough … so, I’ve taken a screendump (laptop) >
All the green is the header and as I see it the #nav (orange li’s) is on top of it. I think it has something to do with the HTML because indeed the homepage of Responsive Nav is doing just fine.
[edit]
After reading the demo (code) of Responsive Nav in detail, it’s clear to me (and to Phil) that it can’t be the header although the background-color:green is ‘floating’ around the right side of the nav. Giving #nav ul a unique background-color makes it clear … :)
Last edited by RedFox (2013-09-16 22:38:38)
Offline
Re: Help choosing CSS framework
To keep the in the grid you need to Put your ul#nav back into the grid flow…. there are many different ways to do this in Foundation – here is a quick fix which uses the grid classes:
<div lass="collapse row you_custom_class">
<div class="columns large-12">
<ul aria-hidden="false" style="transition: max-height 400ms ease 0s; position: relative;" class="closed" id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Work</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
</div>
.your_custom_class {padding:0;}Then remove your max-width from your .row and .one and create a custom class with max-width and wrap the on page elements you require with these.
And add a background color to your ul to match the li’s…. if that is what you are wanting
Offline
Re: Help choosing CSS framework
Thanks Tye … a lot of div’s and classes but the template ‘looks’ alright.
Now I can ‘play’ with all kinds backgrounds … yes, colors … but soon images, patterns, video, animated gifs … :)
Last edited by RedFox (2013-09-17 16:03:33)
Offline
Re: Help choosing CSS framework
I’ve been looking at skeleton here, but isn’t the 4.5 install kind of a minimal framework all ready.
its a bad hen that wont scratch itself.
photogallery
Offline
#31 2016-06-26 03:26:45
- kristiiina91
- New Member
- Registered: 2016-06-24
- Posts: 5
Re: Help choosing CSS framework
RedFox wrote #275279:
I’m looking into Foundation now, because 1) Joshua Vaage has setup a repo at GitHub called: > txp.foundation and I think that’s a good thing … and 2) all other (small) frameworks mostly have only one dev working at it. I presume Foundation will be updated frequently the years to come and version 4 is more than interesting. The grid is very easy to work with.
If there are more Txp men/women going into Foundation then that would give txp.foundation a real boost. This is an invitation … :)
I have setup a static site (only Foundation (raw); no Txp) to play with the grid and layout > Foundation-3C-1200-2/ … and of course I’ve a question:
The default nav of Foundation is rather complicated (for me that is) and I found and like a ‘better’ nav: Responsive Nav … but the #nav is displayed as an overlay on top of the header … instead I want #nav ‘above’ the header. I’ve tried everything possible that I know of (I’m not a dev) but I can’t manage this … :(
Is this possible and how can it be achieved?
[edit]
Same question on StackOverflow
I know this thread is old, but how the hell do you use Responsive Nav with Textpattern? I’m super new at all of this, and I have tried about 1000 different ways and I can’t get Responsive Nav to work. Do you upload it under plugins?
Offline
#32 2016-06-26 12:23:02
- uli
- Moderator
- From: Cologne
- Registered: 2006-08-15
- Posts: 4,306
Re: Help choosing CSS framework
Hi kristiiina91 and welcome to the Textpattern forum.
Looks like you didn’t subscribe to your topic, there was an answer already waiting for you. BTW, there’s a subscription button at the bottom of each topic page, right above the reply form, both visible as soon as you’re logged in.
(And no, responsive nav is not uploaded via textpattern. See your own topic.)
In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links
Offline
Re: Help choosing CSS framework
kristiiina91 wrote #299976:
how the hell do you use Responsive Nav with Textpattern?
As I mentioned in a different thread…
Destry wrote #299962:
For what it’s worth, if you’re using Textpattern (presumably)… you should use the native Hive menu (markup and CSS) and just modify the presentation as needed. It’s already functional in all device sizes, plus your menu will be forward compatible to future Txp updates too, when dependencies are updated in the process.
In other words, it’s already responsive. You don’t need to add any additional responsive code or library, as long as you use the same markup and CSS selectors.
I don’t know how far you modified things, but the default hive code is always on Github, where you can copy and rebuild parts of your template to get them back to the native way of things. It’s not the only way of doing it, of course, but it’s a good way, and especially if you’re interested in changing front-side themes at some point. The day will come when themes are more available again.
Any replies to this, you might want to make them in that the thread.
Offline