Digi

Change background colour? - Digi

Change background colour?

by devnulljp » Thu Dec 28, 2017 6:40 am

How do I change the background colour? the standard theme is a kind of grey/blue. I'd prefer if it was just black.
I tried to use some of the other coloured themes but couldn't get them to compile, which is weird: I get the error "Digi Orange Invalid content in stylesheet.scss" So I'll stick to using the standard but editing the colour scheme a little).

As a quickfix, I replaced the pattern.png file with a 1x1 pixel black png. I can't see a way to change the page colours directly though.

Thanks!
User avatar
devnulljp
Registered User
Posts: 43
Joined: Fri Aug 20, 2010 4:07 pm
Contact:

Re: Change background colour?

by MrGaby » Thu Dec 28, 2017 9:58 am

Hello

First of all, please use the latest version available on github. Indeed, there is a problem in the version currently available on phpbb.com for the comilation of styles (SASS Compiler extension does not allow for files from parent directory).

Then, the customizations of colors are to be made in the file 'theme/_style_config.scss' of the style to be modified. Find the following lines and change the colors as needed (ex. Digi style):

Code: Select all

//
// Color palette
//

// Absolute black and white colors. Reverse them for dark styles
$black-color:							#fff !default;		// Main color to mix with. Black for light styles, white for dark styles
$white-color:							#000 !default;		// Opposite of $black-color

// Page colors
$page-background:						#1a1f26 !default;	// HTML element
$content-background:					#1c232e !default;	// Page inside content wrapper
$content-border-color:					#1c232e !default;	// Border color for content wrapper

// Primary colors
$primary-color:							#174c97 !default;	// Main color, used for links and stuff
$primary-darker-color:					#2c415f !default;
$primary-lighter-color:					#6593d6 !default;
$primary-lightest-color:				#f1f6fc !default;
$secondary-color:						#c35824 !default;	// Secondary color, usually in red - yellow range
$overlay-color:							$white-color !default;	// Text on top of sections that use colorful background.
$block-background:						#252b33 !default;	// Background of blocks
$block-background-reported:				#362a25 !default;	// Background for reported posts

// Global color values
$text-color:							#aaa !default;	// Text color
$bold-text-color:						$black-color !default;	// Text color with higher contrast to background. #000 or #fff
$post-text-color:						$text-color !default;	// Text inside posts
$link-color:							#6593d6 !default;	// Links
$link-hover-color:						$secondary-color !default;	// Links, hover state
$muted-color:							mix($black-color, $content-background, 60%) !default;	// Gray color
$faint-color:							mix($black-color, $content-background, 30%) !default;	// Gray color
$rules-color:							lighten(saturate($secondary-color, 20%), 10%) !default;	// Forum rules

For your need, I think you have to change these lines:

Find:

Code: Select all

$content-background:					#1c232e !default;	// Page inside content wrapper
Replace with:

Code: Select all

$content-background:					#000000 !default;	// Page inside content wrapper

Find:

Code: Select all

$block-background:						#252b33 !default;	// Background of blocks
Replace with:

Code: Select all

$block-background:						#000000 !default;	// Background of blocks
Then recompile the style and enjoy :)
If you like my work, you can support me with a donation. Thanks!
Donate via Paypal
MrGaby
Registered User
Posts: 164
Joined: Sun Apr 02, 2017 8:04 pm
Contact:

Re: Change background colour?

by devnulljp » Thu Dec 28, 2017 6:09 pm

Thank you! That worked perfectly. I'll use the github version in future too.
User avatar
devnulljp
Registered User
Posts: 43
Joined: Fri Aug 20, 2010 4:07 pm
Contact: