I am not sure if I am using custom layouts in the right way. I am creating a theme and there are some pages like the front page with a slightly different layout. I thought its good to use omegas custom layouts feature together with context module.

If custom layouts are used the page.tpl.php is replaced by the custom-layout.tpl.php and the custom-layout.css is used. I thought I could implement the common layout parts in sass/partials/layout which results in mytheme.styles.css (which could be defined as base layout as in #1894398: Sub layout or Base layout support). The parts which are specific to a layout I wanted to put in sass/layouts/layout-name/layout-name-layout.sass but now I saw that layout-name-layout.css is included before mytheme.styles.css and can't override the general css.

In my opinion layout-name-layout.css should be included after mytheme.styles.css - but it isn't, so I am in doubt if I understood for what custom layouts should be used - or if we just should change the order of the includes.

Comments

fubhy’s picture

fubhy CreditAttribution: fubhy commented
Status: Active » Fixed

Layouts are supposed to only contain structural/architectural styling. Basically, that means you usually don't want to have any colors, typography, etc. styling in there. Just placement-related styling for your containers, regions, etc.

You have to see them as completely decoupled and independent from the rest of the theme. This is also why the other theme CSS overrules the layout CSS. You can alter the weighting using hook_drupal_css_alter() but I would advice you to make the separation between layout (structure) and styling ("painting").

I do see your argument with the layout-specific theme-related styling though... I had the idea of adding layout-dependent theme stylesheets. I am not sure yet how we would support those but probably by adding them in your theme's info file somehow like this:

layout-stylesheets[ohm-hero][all][] = 'css/foo.css';
fubhy’s picture

fubhy CreditAttribution: fubhy commented

Here is the issue where I first had that idea: #2089589: The Ohm Hero layout should probably not have background colors/styling.. We will probably implement those as part of that issue. I do not yet know if the syntax example I just gave makes much sense though. You can also use a pre-process hook to load the stylesheets based on the layout.

YOURTHEME_ohm_hero_preprocess() {
  drupal_add_css('yourcss-file.css', array('group' => CSS_THEME, 'weight' => 100));
}

(That would add that stylesheet whenever the ohm-hero layout is loaded.)

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

Anonymous’s picture

(not verified) CreditAttribution: commented
Issue summary: View changes

Updated issue summary.