ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.05k stars 13.51k forks source link

v2 ion-grid feature request - additional percentages (45%) #7508

Closed alexbainbridge closed 7 years ago

alexbainbridge commented 8 years ago

Short description of the problem:

I appreciate that one can create new grid percentages in the CSS, however here is a suggestion for a new default one - 45%

33 > 50 is a large gap, and I often need to do something in between

What behavior are you expecting?

Its Ok at the moment, could be GREAT !

[Not massive high priority or a bug, but if you are looking to add some final sheen, this is one]

Which Ionic Version? 1.x or 2.x 2

brandyscarney commented 7 years ago

Thanks for the issue! I have been working on a new grid system based on Bootstrap 4. Here is a stand alone example of it: grid.zip

I've released a nightly if you'd like to try it out, using this nightly should still work with the old system:

npm install --save ionic-angular@2.0.1-201702142221

And here is a document (a work in progress) where I have written up some information on it: Ionic Grid API

The old grid system will eventually go away, but for now it should still work. If you see your current grid completely break or if you have feedback on the new system please let me know. Thanks! :)

alexbainbridge commented 7 years ago

Hi Brandy You are great!

On the existing system I had to add within my own CSS

ion-col[width-50], ion-col[width-20], ion-col[width-33] {
  margin-bottom: 0px !important;
}

to my css, as if you have two columns, that move to 1 column when responsive, the bottom margin is not equal and the spacing looks odd.

I will check that specifically on the new concept when I test

Where would you like feedback on the new?

Thanks!

brandyscarney commented 7 years ago

@alexbainbridge Thanks! You can either post the feedback here or email me at: brandy@ionic.io 😄

ionitron-bot[bot] commented 6 years ago

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.