CSS files not added as very last files

No need to load last

I'm sorry, but it need to load last. Other files ordered after my style.css are overridding my style.css because of wrong order. My custom changes are the last order...

In order to move my css to a different weight, I used hook_css_alter. In my case, I needed my custom modules to be able to override previous css.

/**
 * Implements hook_css_alter().
 *
 * @inheritdoc
 */
function sienna_css_alter(array &$css) {
  $base = [
    'themes/custom/sienna/css/3.4.1/bootstrap.css',
    'themes/custom/sienna/css/all.min.css',
    'themes/custom/sienna/css/style.css',
    'themes/custom/sienna/css/paragraphs.css',
    'themes/custom/sienna/css/hero_banner.css',
    'themes/custom/sienna/css/news_article.css',
    'themes/custom/sienna/css/ckeditor.css',
  ];

  foreach ($base as $lib_css) {
    if (isset($css[$lib_css])) {
      $css[$lib_css]['group'] = CSS_COMPONENT;
      $css[$lib_css]['weight'] = -5;
    }
  }
}

This is not a support case. This is a defect in the theme.

Have you disabled aggregation and verified the order of files?

Why are you saying than this is not a defect? I do not get it.

The bug is actually in core and not in the theme.

https://drupal.stackexchange.com/questions/278774/theme-css-libraries-al...

This where I got my solution from.

@shelane: You can set a weight in theme libraries of -100 and you are before core if I remember correctly. Your css_alter works the same way :-). There are default value for core/modules/themes, but you can always change the weight and jump in every position you need.

But here - the theme need to make sure it is properly positioned first... otherwise - possible chaos.

colors.css sets css vars, order is not an issue.
Core styles should be disabled, so no risks on them.
styles.css if no Sass should overrite bootstrap styles, bootstrap as dependency should load first.
Module css loads before themes css.
Furthermore, your custom theme styles order could be set on the subtheme.
So, what styles are overwriten and by who?

Just one simple example. Clone bootstrap_subtheme. Style.css has no weight defined by default.

Add this to css new subtheme style.css

.btn-default, 
.btn-default:hover {
    color: #fff;
}

It gets overridden by _banner.scss and the color becomes blue.

Core styles should be disabled, so no risks on them.

I see many core CSS files loaded?

Furthermore, your custom theme styles order could be set on the subtheme.

I can change the wrong order, but I refer to code example bootstrap_subtheme many will use as a default start point like me.

What about the bootstrap.min.css? Should this have a different weight?

There is really no need to add weights (if bootstrap library is called before global styling library), but for styles and colors weight is harmless and with the new weights applied bootstrap call will occur always before, avoiding any overrides.

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