custom css not being used

hi @markfieni have tested it , the subtheme works for me.
(screenshot attached - pink color is from subtheme css )

what i have done:
installed the theme -> enabled the subtheme ( Drupal8 W3CSS Sub-theme (default theme) )
-> added styles inside (d8w3css-subtheme-style.css)

Let me know if u have taken any other steps.

That is exactly what I have. Code above is in subtheme css file at bottom. So how do I get it to see, for example, w3-level-5. I tried putting it in heading no go. There is no way I can find to put it in predefined. Thanks

Hello,
To create a custom css color, you should use it with the blue print for the theme's region.
https://www.drupal.org/files/project-images/drupal8-w3css-theme-color-guidance-1.jpg → .
On the image each region has its own css class in yellow/orange
Example: Header region has w3-theme-l4, Highlighted region has w3-theme-l2
To use more classes, you will have to copy the page.twig.html and add css class for each region, or you can use the id/class for any region.
Example:

#header {color:#fff !important; background-color:#f40c10 !important}
#page-title {color:#fff !important; background-color:#a4080a !important}

I attached a sub-theme → and I tested it on my local.

Best wishes,
Alaa

Alaa,

Thank you for the subtheme. I have installed it on the site and am having the same issue. It seems the css color codes (e.g. w3-theme, w3-theme-l5, etc.) do not override the default theme. How do I accomplish this and what am I missing? I'm sure it is something simple I have overlooked.

The site address is site link if you can take a look. I'm happy to provide a login if necessary.

TIA, Mark

Mark,
The sub-theme is working on my local. I inspect the site and I see five regions with the css classes. Header has w3-theme-l4, main-navigation-h has w3-theme, etc. If you define these classes in the css they should be working. Something is not right on the site. Feel free to contact me so I can take a look.

Best wishes,
Aaa

Alaa,
I see the regions in view source.
The thing I find strange is in view source on the main page the custom css is pointing to:
link rel="stylesheet" media="all" href="/themes/custom/markfien/css/d8w3css-subtheme-style.css?rwtm0z" /
and not to markfien-style.css.
So I duplicated markfien-style.css as d8w3css-subtheme-style.css and that too fails.
If I follow the link above for d8w3css-subtheme-style.css in view source it opens a file which shows:
/* Add your css code here */
then blank - I'm not sure where this is coming from or pointing to since no files in the subtheme have this text.
The site address, if you could take a look I'd appreciate it, is: https://twpunion-d9.schoolboard.net/
Many thanks, Mark

Mark,

You will need to login into the server and search for any duplicate files and check the markfien.libraries.yml file has the correct css files.
Best wishes,
Alaa

Alaa,
I'm wondering if my issue is the fact that we are doing multi-site installation on Drupal. So we have one Drupal 9 codebase and the sites are under it. So our path to a site would be master/web/sites/sitename/files/themes/custom/markfien/css (using your example). In multi-site the custom css does not respond for the site.

If I install your markfien.css in a stand-alone site I see the custom css and it does function. That is why I'm wondering if there is something else I must do for multi-site.

Thank you in advance, Mark

Hello Mark
"So our path to a site would be master/web/sites/sitename/files/themes/custom/markfien/css (using your example)." Not my example there. https://www.drupal.org/project/d8w3css/issues/3301227 →

My example:
web/themes/contrib/* It will have all the contrib themes for all sites.
web/themes/custom/* It will have all the custom themes for all sites.

web/modules/contrib/* It will have all the contrib modules for all sites.
web/modules/custom/* It will have all the custom modules for all sites.

There is no need to add a custom theme there "master/web/sites/sitename/files/themes/custom/markfien".
I would not put anything in files, or under sties. I would keep all custom themes or modules in one location and build a sub-theme for each site(with its own css file).

Example (for a 3-site scenario): I will create a sub-theme (markfien) and the base theme will be drupal8_w3css_theme. In this sub-theme I will add all the global styles for all the 3 sites. Then I will create three sub-themes (siteone_sub_theme, sitetwo_sub_theme, and sitethree_sub_theme) and the base theme will be markfien.
Using this method will give you the flexibility to add global styles for all 3 sites at once or target each individual site.

Best wishes,
Alaa

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