Skip to content

Selecting stylesheets - approaches & methods #45

@hnla

Description

@hnla

In running over the default button.css sheet it occurred to me that things could be improved, there was a slight issue as I came to think about how to make use or availability of the button.blue series of options in the single sheet.

At present really only two options would work -

Trawl through all the template files and change classes to .blue - time consuming and fiddly to ensure all get done, and if dynamic i.e as fed from ?BP could be tricky to accomplish.

or:

Add a class via jQuery or similar - not my favored approach but workable.

what I actually have done is to split out all the color rulesets from button.css into individual color stylesheets and removing the button class i.e 'blue' , keeping button.css for simply the generic button styles site wide, now if I want to change button color, I will simply add my button-color-blue.css to my dynamic inclusion list.

While the approach above works, it does mean I the dev has to make changes where in reality this ought to be a user selection.

What I propose is that a new ability is required in a similar manner to creating a hook or content region for the user.

So we would have (pseudo code)
sections ini:
[styles_selector]
title = "select button styles to use"

options.ini

[button_style_selection]
section = "styles_selector"
title = "Select your prefered button colors"
file_dir = "assets/css/button-color/ ; sets the folder infinity should look in for files

Having set this up user gets a simple select dropdown that will list the file names found in the stated folder, user makes a selection that is saved as an option and used to then enqueue that file in the dynamic.css.

The same basic principle above would/could be extended to cover a lot of style inclusions giving the user a choice, and letting devs simply offer the options.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions