search

jennyvallon / anklebootstrap

The easiest way to use half-size columns with Twitter Bootstrap
1 stars 1 forks source link

Complementing vs. replacing Bootstrap #2

Open amaisano opened 9 years ago

amaisano commented 9 years ago

I use Drupal and Radix. The latter is a theme system for Drupal that is a modified version of the latest Bootstrap framework/CSS.

I didn't want to replace or repeat any styles when adding anklebootstrap in, so I went through and stripped all the non "XpointY" classes, and also removed all non-column rules, so all I was left with were the "point" classes that provide in-betweens for columns.

Doing that lets me rely on the core, maintained version of Radix/Bootstrap without having to worry about updating this custom version, while also getting those half columns that are so awesome.

So I was wondering why you went with a complete custom build of Bootstrap rather than supplying a additional layer CSS that only has the half column styles?

jennyvallon commented 9 years ago

I had an initial css library of just half column styles, but depending on which was linked first in the head, the mixing of different column sizes (sm, md, lg, etc.) would not function correctly.

So from what ur saying, i should just make the barebones half size columns available as a seperate library as well and just warn people about the core bootstrap functionality they might loose. What do u think?

Jv

Sent from my iPhone, so please excuse any mistakes.

On Sep 4, 2015, at 4:28 PM, Adamo Maisano notifications@github.com wrote:

I use Drupal and Radix. The latter is a theme system for Drupal that is a modified version of the latest Bootstrap framework/CSS.

I didn't want to replace or repeat any styles when adding anklebootstrap in, so I went through and stripped all the non "XpointY" classes, and also removed all non-column rules, so all I was left with were the "point" classes that provide in-betweens for columns.

Doing that lets me rely on the core, maintained version of Radix/Bootstrap without having to worry about updating this custom version, while also getting those half columns that are so awesome.

So I was wondering why you went with a complete custom build of Bootstrap rather than supplying a additional layer CSS that only has the half column styles?

— Reply to this email directly or view it on GitHub.

amaisano commented 9 years ago

Ha, you know what's funny? I JUST ran into that issue! So I totally understand what you're talking about now. It's definitely an order of selectors and order of stylesheet problem as you say.

It wouldn't hurt to have a barebones version / alternate, but because this would cause a lot of frustration when multiple size classes are added, definitely keep going with the full bootstrap version.

Although it would be cool to figure out how to interweave these in a separate file. Might be impossible though. I will think on it, and see how best to override w/o A) completely ignoring the original bootstrap CSS Drupal/Radix already has, and B) not have multiple column size classes break.

Thanks for your work on this, btw!

amaisano commented 9 years ago

Doing some more experimentation, it seems loading the stripped-down grid-only stylesheet above (before) the default bootstrap stylesheet allows both ankle and the default styles to co-exist nicely. It may depend on which xs/sm/md/lg mixes are used between the two stylesheets though. So far so good!

jennyvallon commented 9 years ago

There is an order to put them in that makes it less annoying, but doesn't fix the problem entirely.

I'm looking up ways to splice two css styles sheets together in runtime using diff*patch. It will take a while for that version to come out because of my schedule.

jennyvallon commented 9 years ago

Until that version comes out, I will keep this issue open. It is valid.

amaisano commented 9 years ago

Wow that runtime diff would be awesome. I was just playing around with selector specificity, but it's a losing battle. Can't find a way to logic with my selectors "when there are two .col-X-Y classes and one of them contains the word 'point.'"