After debugging why my css were not being preprocessing, I found

function radix_css_alter(&$css) {
  // Allow themes to set preprocess to FALSE.
  // Enable the ability to toggle <link> as opposed to <style> @import.
  // Useful for injecting CSS.
  $preprocess_css = theme_get_setting('preprocess_css', $active_theme);
  foreach ($css as $key => $value) {
    $css[$key]['preprocess'] = $preprocess_css;
  }
}

Which apparently needs the following on the info file on the theme:

settings[preprocess_css] = TRUE

For the css to be preprocessed

Why is that or what's the point behind it? I would like the ability to control the preprocessing of css by the usual drupal setting, and this makes it very hard to have different configuration for different staging/dev and live environments.

CommentFileSizeAuthor
#10 radix-proper_preprocess_css-2744371-10.patch534 byteshanoii
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

hanoii created an issue. See original summary.

hanoii’s picture

hanoii
Primary language Spanish
Location 🇦🇷UTC-3
CreditAttribution: hanoii commented
Issue summary: View changes
shadcn’s picture

shadcn CreditAttribution: shadcn at Chapter Three commented

This setting is for injecting the CSS changes when gulp runs. Normally, Drupal would use @import for stylesheets but we need <link href="" /> for CSS injection to work. Use this setting to turn this on for development.

hanoii’s picture

hanoii
Primary language Spanish
Location 🇦🇷UTC-3
CreditAttribution: hanoii commented

Well, not really familiar with gulp or what's needed, but how would you set this for development? If it's writing the info file, then it's not very nice because you will eventually, and probably often, end up committing that to your repo. And also, this actually requires you to put settings[preprocess_css] = TRUE for any preprocessing to work so again, you rely into writing an info file. I am trying to think a better way to implement this, I'd think a form alter to the theme settings page should do it, is the issue I am looking at clear?

Thanks!

shadcn’s picture

shadcn CreditAttribution: shadcn at Chapter Three commented

Agreed. The current setup means you have to manually set settings[preprocess_css] = FALSE when you deploy to production and back to TRUE when you're developing locally.

@jacine solved this on one project by having this settings in the settings.local.php file instead of the theme .info file.

Add the following code to settings.local.php:

// Disable <style> @import CSS in favor of <link> element. 
$settings['radix_preprocess_css'] = TRUE;

Then replace the code above by:

// Allow themes to set preprocess to FALSE.
// Enable the ability to toggle <link> as opposed to <style> @import.
// Useful for injecting CSS.
$preprocess_css = variable_get('radix_preprocess_css', FALSE);
foreach ($css as $key => $value) {
  $css[$key]['preprocess'] = $preprocess_css;
}

This way you can keep this setting for local development only. If this is a viable solution, we might make this the default.

hanoii’s picture

hanoii
Primary language Spanish
Location 🇦🇷UTC-3
CreditAttribution: hanoii commented

Definitely better, however, I am really struggle to see the benefit of this, why not simply rely on the global setting for this and do something like:

// Allow themes to set preprocess to FALSE.
// Enable the ability to toggle  as opposed to  @import.
// Useful for injecting CSS.
$preprocess_css = variable_get('preprocess_css', FALSE);
if (!$preprocess_css) {
  foreach ($css as $key => $value) {
    $css[$key]['preprocess'] = $preprocess_css;
  }
}

It seems that you get the same result while relying in the global preprocess_css option that you can either set in your local settings.php file, in your production one or through the interface.

The if clause was a logical addition, but would likely work the same without it.

shadcn’s picture

shadcn CreditAttribution: shadcn at Chapter Three commented

Yes. Using variable_get('preprocess_css', FALSE); means we can provide this value via a settings.local.php and/or a theme settings form.

I think this is the way forward. I'll work on this in the weekend.

hanoii’s picture

hanoii
Primary language Spanish
Location 🇦🇷UTC-3
CreditAttribution: hanoii commented

@arshadcn, there's nothing really to work on :), because 'preprocess_css' i the variable provided from core and you can enable/disable it on Configurations->Performance as well as settings.php with any variable, if that's acceptable I am happy to submit a patch.

shadcn’s picture

shadcn CreditAttribution: shadcn at Chapter Three commented

@hanoii oh yeah. I did not know that. Thanks +1. Yes please submit a patch. :)

hanoii’s picture

hanoii
Primary language Spanish
Location 🇦🇷UTC-3
CreditAttribution: hanoii commented
Status: Active » Needs review
FileSize
radix-proper_preprocess_css-2744371-10.patch534 bytes

Attached is the patch and the settings is in /admin/config/development/performance (Aggregate and compress CSS files. checbox).

hanoii’s picture

hanoii
Primary language Spanish
Location 🇦🇷UTC-3
CreditAttribution: hanoii commented

Hi, just bumping this one as it looks very easy to review.

  • arshadcn committed a640b01 on 7.x-3.x authored by hanoii 
    Issue #2744371 by hanoii: Preprocessing css, how to, whats the point of...
shadcn’s picture

shadcn CreditAttribution: shadcn as a volunteer and at Chapter Three commented

Looks good. I've committed this. Thanks @hanoii.

shadcn’s picture

shadcn CreditAttribution: shadcn as a volunteer and at Chapter Three commented
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

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