Learn More
Resend Email
1
IntrusionCM
6y

Hi, in my latest project I'm stuck on the CSS part.

I've already an Grunt + Sass Asset Generator for bootstrap.

The project has several (> 70) subpages aka modules.

The theming is client based, currently 4 clients with different colors.

At first I thought it was easy...

Splitting bootstrap to variables per client + bootstrap, so:

client1_variables.scss
client1_bootstrap.scss (including client1_variables).

client2_variables.scss
client2_bootstrap.scss
. . .

But now I'm stuck.

Reaason: The css classes are the same between the clients, eg client-bg-primary is the class.

I wanted to prevent generating for each client a folder - as every folder would contain the same content:

module/news/client1.scss
module/news/client2.scss
module/news/client3.scss

module/dashboard/client1.scss
module/dashboard/client2.scss
module/dashboard/client3.scss
...

Each SCSS file would only differ in the variable import...

Is there a way to prevent a Global Module CSS file for each client (as there are @##* fucking classes duplicated and I really don't want to untangle that mess) but not ending up with writing the same Code over and over?

The IRC sass channel is moderated, not possible to ask there... And when I google I find mostly themes based on an class approach (border-light vs border-dark)… :(

question

css

sass
Favorite
Ranter
Comments
  • 1
    6y
    If it's only colours changing you could just add preset colours in a client file and include the correct custom file when needed.

    Something like

    Client-1-theme.scss
    $red = "#ff0000"

    Client-2-theme.scss
    $red = "#8b0000";

    Then call $red for all locations being styled with that color.
    If this was vanilla css you could have done the same with the :root selector and var(--red)
  • 0
    6y
    Yes... That's one part of the problem.

    But in your example I would end with one file per client containing everything...

    I need to have it per module / per page AND per client.

    But I guess that's not doable...

    :(

    I must admit that I am not frontend developer. I'm trying to get an frontend developer in team, but I think that this will be very hard (don't ask, bullshit bingo company wise).

    I'll have to untangle the mess and split it up in bootstrap / large global CSS per client / module (page) related per client.... I'll just hope I understand the clusterfuck that it will become :( *sad*
Related Rants
devRant © 2021 Hexical Labs LLC
Privacy Policy  |  Terms of Service
Add Comment