Layouts default-grid.css bootstrap v2

[donaldboulton]

If you use layouts on a bootstrap 3 theme spacing alignment is crazy, center-block places images offset from center and grid alignment is not correct.
`

//Has these classes .orchard-layouts-root .table {.container} and some padding. No bootstrap 3 classes.

//=bootstrap 2 Should be container-fluid =bootstrap 3

//Correct

//=bootstrap 2 = Should be class="col-xs-6 col-md-4"

You've successfully setup your Orchard Site`

I am not even getting default-grid.css loading on a fresh Orchard 1.10 site so these classes mean nothing and if default-grid.css is used it conflicts with bootstrap 3 classes and slightly offsets everything and even overlaps items on the top and bottom of pages.
Convert to Bootstrap v4 alpha = changes http://v4-alpha.getbootstrap.com/migration/ put everything .css .sass and .js in Orchard.Resources\Assets for global usage.

[sfmskywalker]

This is by design. When using Layouts with a Bootstrap based theme, you'll need to override 2 element shape templates to change the CSS classes. The classes used are grid framework-agnostic. Some use Bootstrap, others use Foundation or other frameworks (including custom ones). I wrote a section on this topic here that might be helpful: http://www.ideliverable.com/blog/orchard-layouts

[donaldboulton]

Clean instillation of 1.10 created a page with 3 columns as <div class=" span-4 cell"> saved and viewed it displayed top to bottom because no style sheet controlling them = no default-grid.css is present. Override ?????. The classes in default-grid.css are not fully responsive anyway.

Main point NO default-grid.css is being displayed in layouts!

[sfmskywalker]

Ah, so you're saying that even with the default TheThemeMachine theme the custom-grid.css is not loaded. If that's the case, then that is a bug.

[donaldboulton]

With the default TheThemeMachine theme it does and correctly. But with any other theme it does not, maybe it should come from Assets not the theme.

[sfmskywalker]

You mean from a place like Orchard.Resources? Maybe, since it is a generic stylesheet (not specific to any theme), plus we are also providing Bootstrap as a resource. And I suppose there are plenty themes out there that don;t use any grid CSS framework, so they woudl want to use custom-grid.css. They could copy it of course. I'm curious to other people's opinions on this.

[Skrypt]

I think it is fine like it is; since we want this to be framework agnostic. Though, maybe we could provide a warning that the default-grid.css is not included in the currently used theme.

[donaldboulton]

That would be nice. Why do we need .css .js .dll all over the place; in modules the lib folder in assets and in themes. Orchard.Resources is a great idea, one place for all resources needed by most all users, modules themes and core.
Then there is no confusion of where is it. Getting close to 7k files in Orchard. Where would you start looking for assets if you were new to Orchard = one place Orchard.Resources

[Skrypt]

Frontend and Backend are 2 separate things. The backend will be using Bootstrap in the future. But the frontend could be using any other type of grid framework "Skeleton, Foundation ..." just to name a few. That's why @sfmskywalker has included the Layouts grid framework CSS in the default Orchard theme. So that people can make it work like they want. Though, the only problem is that most of people who have custom made theme did'nt knew about this change. So we all end up having our layout grids broken on the frontend.

So, fastest solution is to copy this default-grid.css into your own theme and add the Style.Include("default-grid.css"); in your layout.cshtml view or if you are using PJS Bootstrap Theme that would be in Resources.cshtml.

A solution could be to add default-grid.css to the Layout module resource manifest. But then everyone that would want to modify it for their own grid system would need to do it by overriding the .css file in their own theme. But this would be more like a "hack" than a clean solution.

[donaldboulton]

Removed main content issue resolved

[Skrypt]

I think this is getting away from the main topic here. I found you a solution for the small problem you had there. Though if there is a fix that everyone agrees on then let's do it. Else, I'm fine like it is now.
Peace out :)

[sebastienros]

I updated the release notes to deal with this case.

https://github.com/OrchardCMS/OrchardDoc/blob/master/Documentation/Orchard-1-10.Release-Notes.markdown#themes--layouts

[Skrypt]

Thanks @sebastienros