$this->data['theme'] = new Data($themeData);
}
+
protected function writeStyles()
{
+ $darkTheme = $this->theme->isDarkTheme();
+ $textsColor = $this->theme->getTextsColor();
+ $oppositeTextsColor = $this->theme->getTextsColor(true);
+
// Main texts color
- $this->sassVariables['texts-color'] = $this->theme->getTextsColor();
+ $this->sassVariables['texts-color'] = $textsColor;
$this->sassVariables['button-texts-color'] = $this->theme->getButtonTextColor();
- $this->sassVariables['opposite-texts-color'] = $this->theme->getTextsColor(true);
+ $this->sassVariables['opposite-texts-color'] = $oppositeTextsColor;
// Font
$this->sassVariables['font'] = $this->_font($this->theme->font);
// Colors
$this->sassVariables['neutral-color'] = $this->theme->neutralColor;
$this->sassVariables['ok-color'] = $this->theme->okColor;
$this->sassVariables['nok-color'] = $this->theme->nokColor;
+ $this->sassVariables['card-disabled-background'] = $darkTheme ? $this->theme->neutralColor : $textsColor;
+ $this->sassVariables['card-disabled-color'] = $darkTheme ? $textsColor : $oppositeTextsColor;
// Fonts size:Line Height
$this->sassVariables['fonts-size'] = "(14: 20px, 16: 22px, 20: 28px, 24: 35px)";
$this->sassVariables['intro-fill-area'] = $this->theme->introColor ?: 'transparent';
$this->sassVariables['outro-fill-area'] = $this->theme->outroColor ?: 'transparent';
$this->sassVariables['standard-fill-area'] = $this->theme->standardColor ?: 'transparent';
- $this->sassVariables['drangandrop-area1-fill-area'] = $this->theme->draganddropArea1Color ?: 'transparent';
- $this->sassVariables['drangandrop-area2-fill-area'] = $this->theme->draganddropArea2Color ?: 'transparent';
+ $this->sassVariables['drangandrop-fill-area'] = $this->theme->draganddropColor ?: 'transparent';
// Main background
$this->sassVariables['background-color'] = Color::colorToCSS($this->theme->backgroundColor);
const MOBILE_SIZE = '390 x 844px';
const ICON_SIZE = '512 x 512px';
+ const DARK_COLOR = '#383838';
+ const LIGHT_COLOR = '#ffffff';
+
public function setFields()
{
parent::setFields();
return $this->_getAutoTextColor($this->neutralColor, $this->textColor, $opposite);
}
+ public function isDarkTheme()
+ {
+ return $this->getTextsColor() === self::LIGHT_COLOR;
+ }
+
+ public function isLightTheme()
+ {
+ return !$this->isDarkTheme();
+ }
+
public function getButtonTextColor($opposite = false)
{
return $this->_getAutoTextColor($this->mainColor, $this->buttonTextColor, $opposite);
protected function _getAutoTextColor($base, $color, $opposite = false)
{
- $darkColor = '#383838';
- $lightColor = '#ffffff';
+
if ($color == 'auto' || !$color) {
// If auto mode, check between black and white which have the biggest distance (i.e. most contrast) with neutralColor
$neutral = new \Cubist\Util\Graphics\Color($base);
- $black = new \Cubist\Util\Graphics\Color($darkColor);
- $white = new \Cubist\Util\Graphics\Color($lightColor);
+ $black = new \Cubist\Util\Graphics\Color(self::DARK_COLOR);
+ $white = new \Cubist\Util\Graphics\Color(self::LIGHT_COLOR);
$distBlack = $neutral->distance($black);
$distWhite = $neutral->distance($white);
if ($distWhite > $distBlack) {
- $res = $lightColor;
+ $res = self::LIGHT_COLOR;
} else {
- $res = $darkColor;
+ $res = self::DARK_COLOR;
}
} else {
$res = match ($color) {
- 'dark' => $darkColor,
- '#000000' => $darkColor,
- '#ffffff' => $lightColor,
- 'light' => $lightColor,
+ 'dark' => self::DARK_COLOR,
+ '#000000' => self::DARK_COLOR,
+ '#ffffff' => self::LIGHT_COLOR,
+ 'light' => self::LIGHT_COLOR,
};
}
return $res;
}
- if ($res === $darkColor) {
- return $lightColor;
+ if ($res === self::DARK_COLOR) {
+ return self::LIGHT_COLOR;
} else {
- return $darkColor;
+ return self::DARK_COLOR;
}
}