Jump to content
Sign in to follow this  
juliencharette

Bootstrap tables break the responsive layout?

Recommended Posts

evert100

I think the solution is different than Rangelone suggests. It has to do with something i've studying last couple of days. Problem is that Pagelines isn't fully compatible with Bootstrap. If i look at the code in combination with the css for tables at your website and the example in Twitter Bootstrap you see what i mean. The twitter guys make use of the file bootstrap.css This code is missing in pagelines. It would be for us users and developers much more easy, at least that's my opinion, that we can use the bootstrap code. Pagelines made some kind of re-code and as i said didn't fully integrate the twitter bootstrap. So there we are lost. The documentation of pagelines is not up to date or very limited. So there you go. The wiki is still not updated. For bootstrap we only have, as far as i know, the page http://demo.pagelines.com/framework/tools/ The solution for you could be to look for the css code in bootstrap.css http://twitter.github.com/bootstrap/assets/css/bootstrap.css and place it in your child theme css or in the plugin for customization css as i do. A lot of work. Second remark: if i look at http://twitter.github.com/bootstrap/base-css.html#tables on my iphone it's doing better in responsive design but not perfect! So? Anybody ideas? Do i miss something? I like to hear the vision of the pagelines team of developers on this, because i see it more lately in the forum. Need some enlightment. Cheers, Evert

Share this post


Link to post
Share on other sites
beardedavenger

Tables aren't responsive. We have a half-baked responsive solution on the demo, and heres a link to a few options. http://css-tricks.com/responsive-data-table-roundup/ We are FULLY compatible with Bootstrap, and just because you dont' see a "bootstrap.css" doesn't mean it's not there. We're not using a "recode" as you say, we're using a LESS pre-processor, which means all of our files, are in LESS, then processed into CSS. You can find these files for yourself under /includes/less. They're all broken down into sections, then combined by the processor. So, if you decide to move bootstrap.css into your child theme, its not going to do anything. We're already using it. All of it. Nick

  • Like 1

Something big is coming for DMS + photographers.

http://fotostheme.com

 

Nick Haskins & CO - New home for all of my PageLines Store products! 

http://nickhaskins.co

 

Better DMS - News, Tutorials, and Tips

http://betterdms.com

 

Share this post


Link to post
Share on other sites
evert100

Hi beardedavenger Thanks for your answer. Your answer is very clear, but still how do you explain the difference? "Second remark: if i look at http://twitter.github.com/bootstrap/base-css.html#tables on my iphone it's doing better in responsive design but not perfect! So?" And still the fact is that pagelines documentation on bootstrap is little. I noticed few of us discuss with eachother to solve problems for button-modal glyphon combinations. Because the pagelines shortcodes fail. Thanks anyway, it has become clearer to me now. A little bit explanation to the more dev clients would still be nice. Idea?

Share this post


Link to post
Share on other sites
Danny

Hi, We appreciate this feedback and we will take on it board.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
beardedavenger

Bootstrap site is using specific CSS for their demo to make their tables look good on mobile, and its' specific to the content they have in the tables. Just like our demo, we're also using a half-concocted solution to make it so it doesn't break. We have full documentation on Bootstrap. http://demo.pagelines.com/framework/tools There it explains how to use the grid, gives markup for the grid, and also gives every shortcode, their atts, and how to use them. http://demo.pagelines.com/framework/theming/ This goes even further, and explains how to theme with Bootstrap, and how to use them. And as if that wasnt enough, we have this: http://demo.pagelines.com/framework/cheat-sheet/ Which covers every variable that we use, with minor instructions on how to use them. So, I think we have a pretty exorbitant amount of information on how to use Bootstrap, not to mention the Bootstrap site itself, which also shows you how to make buttons with icons. Back to your last comment, if you stick a shortcode inside an ya it probably wont' work. You'll have to use real markup, and that's covered on the bootstrap site. If you think we're really missing information, let us know and we can fill it. But between our docs, and Boostraps, you should really have no issues.


Something big is coming for DMS + photographers.

http://fotostheme.com

 

Nick Haskins & CO - New home for all of my PageLines Store products! 

http://nickhaskins.co

 

Better DMS - News, Tutorials, and Tips

http://betterdms.com

 

Share this post


Link to post
Share on other sites
juliencharette

Well I impressed with the quantity and quality of support you get in PageLines forums. Thanks for all the help, I will try all your suggestions.

Share this post


Link to post
Share on other sites
catrina

Please let us know how the suggestions work out and if you need further assistance.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
Jenny

You're welcome @juliencharette - we're happy to help!


Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
juliencharette

I tried the Zurb technique and I can't make it work. I put the javascript into Custom Code > FooterScripts Code and the css into Custom Code > CSS Rules It didn't work as expected so I took it out. Maybe I'm doing something wrong?

Share this post


Link to post
Share on other sites
Rob

Julien, Honestly, I don't know much about either Bootstrap or responsive table design, but I suspect you may just need some professional help with this issue as it may be beyond the scope of my skills and that of some of my colleagues. We're just getting accustomed to dealing with it and only our developers are truly skilled with it at present. I'd suggest therefore, that you request a bid from several of our Pros at http://www.pagelines.com/pros to help with this. Likely it's a very quick fix and I wish I knew just how to help. Eventually, I expect I will.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×