News:

Wondering if this will always be free?  See why free is better.

Main Menu

Curve2 Color Changer

Started by SMF Customization Team, April 16, 2019, 06:00:27 PM

Previous topic - Next topic

SMF Customization Team

Link to the mod

Curve2 Color Changer



Supported Languages: English, Russian.
Link To Mod | Mod Discussion | Other SMF Customization Team Mods



Compatibility
For SMF 2.1.x

Introduction
Adds color settings for the the SMF 2.1 default theme

Installation
Any previous versions of this mod MUST be uninstalled BEFORE installing this version.
This mod is mainly for the default theme, custom themes might be compatible depending on the author of the custom theme.

Usage in custom themes (for theme authors)
If you wish to make use of the mod and allow admins to change colors in your theme, add an array with the following format to template_init()

$settings['color_changes'] = array(
    
'COLOR_TYPE' => array(
        array(
            
'variable' => 'CSS-VAR',
            
'elements' => '.ELEMENT, #ANOTHER_ELEMENT',
            
'properties' => array('PROPERTY_NAME''ANOTHER_PROPERTY' => '{color}')
        )
        array(...)
    ),
    ...
);


You can use one of the already declared color types :
'background', 'foreground', 'primary_color', 'secondary_color', 'top_section', 'footer', 'links', 'gradient_end', 'gradient_start', 'blocks_color', 'blocks_alternate_color', 'borders_color', 'buttons_text_color', 'buttons_bg', 'buttons_border', 'special_titles_color'

Or you can use a new color type, but you'll have to give it a text string in this format:
$txt['cc_COLOR_TYPE'] = 'STRING';

Properties will be given the value of the color, and you can also use {color} and it will be replaced with the color's value.

And since version v1.4, you can also target css variables and add different selectors.
To add more selectors to root, you can add them to $settings['color_changes_root'] as array values.
$settings['color_changes_root'] = array(
    
'.blue',
    
'.red',
    
'[data-colormode="dark"]'
);

This will output something like this:
:root,:root.blue,:root.red,:root[data-colormode="dark"] { --CSS-VAR: value; };

Example from the default theme:
<?php
$settings
['color_changes'] = array(
    
'background' => array(
        array(
            
'elements' => 'body',
            
'properties' => array('background')
        )
    ),
    
'primary_color' => array(
        array(
            
'elements' => 'div.cat_bar, .amt, .dropmenu li a:hover, .dropmenu li:hover a, .dropmenu li a:focus,
            #top_info > li > a:hover, #top_info > li:hover > a, #top_info > li > a.open, .button.active, .button.active:hover'
,
            
'properties' => array('background''border-color')
        ),
        array(
            
'elements' => '#footer',
            
'properties' => array('background')
        ),
        array(
            
'elements' => '.button.active, .button.active:hover',
            
'properties' => array('color' => '#fff')
        )
    ),
    
'gradient_start' => array(
        array(
            
'elements' => '.dropmenu li ul, .top_menu, .dropmenu li li:hover, .button, .dropmenu li li:hover > a, .dropmenu li li a:focus,
            .dropmenu li li a:hover, #top_section, #search_form .button, .quickbuttons li, .quickbuttons li ul, .quickbuttons li ul li:hover,
            .quickbuttons ul li a:focus, .popup_window, #inner_section'
,
            
'properties' => array('background-image' => 'linear-gradient(to bottom, {color} 0%, transparent 70%)')
        ),
        array(
            
'elements' => '.button:hover, .quickbuttons li:hover, .navigate_section ul, .popup_content, .up_contain,
            .button:hover, #search_form .button:hover, .quickbuttons li:hover'
,
            
'properties' => array('background-image' => 'linear-gradient(to bottom, transparent 0%, {color} 70%)')
        )
    ),
);


Support
Please use the modification thread for support with this modification.

Changelog
Version 1.4.2 - 15 October 2022
- Fixed undefined errors when no settings are saved

Version 1.4.1 - 28 February 2022
- Added option for sticky+locked status
- Added option for :target content

Version 1.4 - 27 February 2022
- Added support for CSS vars
- Added sticky, approved and locked topics color options
- Fixed check for elements/properties before trying to add them
- Fixed "Use default color" for individual settings
- Fixed minor issues with coloring

Version 1.3 - 27 October 2021
- Check against theme authors having defined color palette/s for their theme
- Fixed problems with default colors

Version 1.2.2 - 27 October 2021
- Check if there are any default settings first

Version 1.2.1 - 10 October 2021
- Insert default settings if not set

Version 1.2 - 24 August 2021
- Fixed 'Remove shadows' option
- Set a default color on all of the palettes
- Fixed button color on "focus" state

Version 1.1 - 23 August 2021
- Fixed default palette
- Adds labels for palettes
- Added default curve palette
- Added Russian translation

Version 1.0 - April 2019
- Initial Release


Copyright (c) 2021, Simple Machines, under BSD 3-Clause License.
All rights reserved.

GigaWatt

"This is really a generic concept about human thinking - when faced with large tasks we're naturally inclined to try to break them down into a bunch of smaller tasks that together make up the whole."

"A 500 error loosely translates to the webserver saying, "WTF?"..."

-Rock Lee-

¡Regresando como cual Fenix! ~ Bomber Code
Ayudas - Aportes - Tutoriales - Y mucho mas!!!

skb

Can this be board specific ?

SMF 2.1.4 / TP 2.2.2

SychO

Checkout My Themes:
-

Potato  •  Ackerman  •  SunRise  •  NightBreeze

pocttopus

А very useful idea.
Amazing!  :)

Antechinus

Haven't checked out the guts of it yet, but I'm guessing this adds a range of user-specific theme settings to deal with all the possible options.

Has anyone done some checking on the performance implications for large and/or busy sites?

SychO

Quote from: Antechinus on April 17, 2019, 08:40:06 AM
Haven't checked out the guts of it yet, but I'm guessing this adds a range of user-specific theme settings to deal with all the possible options.

Has anyone done some checking on the performance implications for large and/or busy sites?

Not user-specific, that would be too much :/

The settings are admin-specific.
Checkout My Themes:
-

Potato  •  Ackerman  •  SunRise  •  NightBreeze

Antechinus

Then why does it say "allow users to change colors"?

Arantor


Antechinus

A tad ambiguous, as SychO's post demonstrates, but ok.

SychO

Checkout My Themes:
-

Potato  •  Ackerman  •  SunRise  •  NightBreeze

digzu

This is great... but it doesn't seem to work when duplicating the default theme into another folder for the newly created theme.

Also for some reason general text colour can't be changed.

Nice work, though :3

Hatshepsut

Quote from: digzu on June 25, 2019, 06:17:44 AM
This is great... but it doesn't seem to work when duplicating the default theme into another folder for the newly created theme.

Also for some reason general text colour can't be changed.

Nice work, though :3

You can change text color, look for "Foreground color" option in "Configuration => Current theme" :)

vbgamer45

I really like this. Wish this was bundled with 2.1 gives users more options.
Community Suite for SMF - Take your forum to the next level built for SMF, Gallery,Store,Classifieds,Downloads,more!

SMFHacks.com -  Paid Modifications for SMF

Mods:
EzPortal - Portal System for SMF
SMF Gallery Pro
SMF Store SMF Classifieds Ad Seller Pro

jonat

I made a copy of the default Curve theme and added the code as shown above to template_init() right after:

if (!isset($settings['disable_files']))
$settings['disable_files'] = array();


, but I don't get the options for that theme. (I want to make it darker.) I am using 2.1RC2 and there aren't many (any?) dark themes compatible with it yet.  (Tried Lunarfall, but it garbles text for reasons I haven't figured out.) Is there something else I need to do?


GirlinGray

Hi, this looks great. My forum is running SMF 2.0.15.

Do you know if this will work with SMF 2.0.15 -- or must I shift up to SMF 2.1x first?

Thanks.
That Adams Girl

SychO

This is not compatible with 2.0.x
Checkout My Themes:
-

Potato  •  Ackerman  •  SunRise  •  NightBreeze

GirlinGray

Thanks, good to know.

I was not even aware there was an SMF 2.1. Ahhh!
That Adams Girl

beckzy

Hi! Will this work with SMF 2.1 RC3? Thanks :)

Advertisement: