N°3516 Add Fullmoon 🌕 to theme mechanism, update test-red theme for 3.0

This commit is contained in:
Stephen Abello
2021-01-05 17:14:30 +01:00
parent 82e98ced85
commit 5ef75772f0
9 changed files with 115 additions and 4317 deletions

View File

@@ -43,15 +43,13 @@ class ThemeHandler
public static function GetDefaultThemeInformation()
{
return [
'name' => 'light-grey',
'name' => 'fullmoon',
'parameters' => [
'variables' => [],
'imports' => [
'css-variables' => '../css/css-variables.scss',
],
'stylesheets' => [
'jqueryui' => '../css/ui-lightness/jqueryui.scss',
'main' => '../css/light-grey.scss',
'main' => '../css/backoffice/main.scss',
],
],
];

View File

@@ -1293,7 +1293,7 @@ class Config
'backoffice_default_theme' => [
'type' => 'string',
'description' => 'Default theme used for '.ITOP_APPLICATION_SHORT.'\'s console',
'default' => 'light-grey',
'default' => 'fullmoon',
'value' => '',
'source_of_value' => '',
'show_in_conf_sample' => false,

View File

@@ -22,142 +22,142 @@
font-weight: 100;
font-style: normal;
src: local('Raleway-v4020 Thin'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Thin.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Thin.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Thin.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Thin.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 100;
font-style: italic;
src: local('Raleway-v4020 Thin'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-ThinItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-ThinItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-ThinItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-ThinItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 200;
font-style: normal;
src: local('Raleway-v4020 ExtraLight'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraLight.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraLight.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraLight.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraLight.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 200;
font-style: italic;
src: local('Raleway-v4020 ExtraLight'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraLightItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraLightItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraLightItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraLightItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 300;
font-style: normal;
src: local('Raleway-v4020 Light'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Light.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Light.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Light.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Light.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 300;
font-style: italic;
src: local('Raleway-v4020 Light'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-LightItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-LightItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-LightItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-LightItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 400;
font-style: normal;
src: local('Raleway-v4020'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Regular.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Regular.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Regular.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Regular.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 400;
font-style: italic;
src: local('Raleway-v4020'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Italic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Italic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Italic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Italic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 500;
font-style: normal;
src: local('Raleway-v4020 Medium'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Medium.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Medium.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Medium.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Medium.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 500;
font-style: italic;
src: local('Raleway-v4020 Medium'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-MediumItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-MediumItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-MediumItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-MediumItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 600;
font-style: normal;
src: local('Raleway-v4020 SemiBold'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-SemiBold.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-SemiBold.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-SemiBold.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-SemiBold.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 600;
font-style: italic;
src: local('Raleway-v4020 SemiBold'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-SemiBoldItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-SemiBoldItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-SemiBoldItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-SemiBoldItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 700;
font-style: normal;
src: local('Raleway-v4020'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Bold.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Bold.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Bold.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Bold.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 700;
font-style: italic;
src: local('Raleway-v4020'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-BoldItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-BoldItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-BoldItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-BoldItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 800;
font-style: normal;
src: local('Raleway-v4020 ExtraBold'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraBold.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraBold.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraBold.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraBold.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 800;
font-style: italic;
src: local('Raleway-v4020 ExtraBold'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraBoldItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraBoldItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-ExtraBoldItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-ExtraBoldItalic.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 900;
font-style: normal;
src: local('Raleway-v4020 Black'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-Black.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-Black.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-Black.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-Black.woff') format('woff');
}
@font-face {
font-family: Monorale;
font-weight: 900;
font-style: italic;
src: local('Raleway-v4020 Black'),
url('../../lib/samvk/monorale-raleway-sober/otf/Monorale-BlackItalic.otf') format('otf'),
url('../../lib/samvk/monorale-raleway-sober/woff/Monorale-BlackItalic.woff') format('woff');
url('../../../../lib/samvk/monorale-raleway-sober/otf/Monorale-BlackItalic.otf') format('otf'),
url('../../../../lib/samvk/monorale-raleway-sober/woff/Monorale-BlackItalic.woff') format('woff');
}

View File

@@ -17,18 +17,18 @@
* * You should have received a copy of the GNU Affero General Public License
*
*/
$backoffice-environment-banner-background-color: #C53030 !default;
$backoffice-environment-banner-text-color: #F7FAFC !default;
$backoffice-environment-banner-text-content: "THIS IS NOT PRODUCTION INSTANCE" !default;
$ibo-page-banner-background-color: $ibo-color-red-600 !default;
$ibo-page-banner-text-color: $ibo-color-red-100 !default;
$ibo-page-banner-text-content: "THIS IS NOT PRODUCTION INSTANCE" !default;
div#top-bar::before {
#ibo-page-banner::before {
display: block;
width: 100%;
padding: 0.2rem;
text-align: center;
font-size: 1rem;
background: $backoffice-environment-banner-background-color;
color: $backoffice-environment-banner-text-color;
content: $backoffice-environment-banner-text-content;
background: $ibo-page-banner-background-color;
color: $ibo-page-banner-text-color;
content: $ibo-page-banner-text-content;
}

View File

@@ -1822,31 +1822,26 @@
</menus>
<branding>
<themes>
<theme id="light-grey" _delta="define">
<theme id="fullmoon" _delta="define">
<variables>
</variables>
<imports>
<import id="css-variables">../css/css-variables.scss</import>
</imports>
<stylesheets>
<stylesheet id="jqueryui">../css/ui-lightness/jqueryui.scss</stylesheet>
<stylesheet id="main">../css/light-grey.scss</stylesheet>
<stylesheet id="fullmoon">../css/backoffice/main.scss</stylesheet>
</stylesheets>
<precompiled_stylesheet>itop-structure/precompiled-themes/light-grey/main.css</precompiled_stylesheet>
</theme>
<theme id="test-red" _delta="define">
<variables>
<variable id="backoffice-environment-banner-background-color">#C53030</variable>
<variable id="backoffice-environment-banner-text-color">#F7FAFC</variable>
<variable id="backoffice-environment-banner-text-content">"THIS IS A TEST INSTANCE"</variable>
<variable id="ibo-page-banner-background-color">$ibo-color-red-600</variable>
<variable id="ibo-page-banner-text-color">$ibo-color-red-100</variable>
<variable id="ibo-page-banner-text-content">"THIS IS A TEST INSTANCE"</variable>
</variables>
<imports>
<import id="css-variables">../css/css-variables.scss</import>
</imports>
<stylesheets>
<stylesheet id="jqueryui">../css/ui-lightness/jqueryui.scss</stylesheet>
<stylesheet id="main">../css/light-grey.scss</stylesheet>
<stylesheet id="environment-banner">../css/backoffice-environment-banner.scss</stylesheet>
<stylesheet id="fullmoon">../css/backoffice/main.scss</stylesheet>
<stylesheet id="environment-banner">../css/backoffice/themes/page-banner.scss</stylesheet>
</stylesheets>
<precompiled_stylesheet>itop-structure/precompiled-themes/test-red/main.css</precompiled_stylesheet>
</theme>

View File

@@ -2803,6 +2803,7 @@ EOF;
// - The SCSS from modules
$aImportsPaths = array(
APPROOT.'css/',
APPROOT.'css/backoffice/main.scss',
$sTempTargetDir.'/',
);

View File

@@ -815,6 +815,24 @@ class iTopDesignFormat
$oCodeNode = $oNode->ownerDocument->createElement("enum_code", $oNode->textContent);
$oNode->appendChild($oCodeNode);
}
// N°3516 Remove legacy backoffice theme
// Remove completely light-grey theme
$this->RemoveNodeFromXPath('/itop_design/branding/themes/theme[@id="light-grey"]');
// Update test-red theme
$this->RemoveNodeFromXPath('/itop_design/branding/themes/theme[@id="test-red"]/imports/import[@id="css-variables"]');
$this->RemoveNodeFromXPath('/itop_design/branding/themes/theme[@id="test-red"]/stylesheets/stylesheet[@id="jqueryui"]');
$this->RemoveNodeFromXPath('/itop_design/branding/themes/theme[@id="test-red"]/stylesheets/stylesheet[@id="main"]');
$sTestRedBannerBackgroundColorPath = '/itop_design/branding/themes/theme[@id="test-red"]/variables/variable[@id="backoffice-environment-banner-background-color"]';
$this->SetNodeAttribute($sTestRedBannerBackgroundColorPath, 'id', 'ibo-page-banner-background-color');
$sTestRedBannerTextColorPath = '/itop_design/branding/themes/theme[@id="test-red"]/variables/variable[@id="backoffice-environment-banner-text-color"]';
$this->SetNodeAttribute($sTestRedBannerTextColorPath, 'id', 'ibo-page-banner-text-color');
$sTestRedBannerTextContentPath = '/itop_design/branding/themes/theme[@id="test-red"]/variables/variable[@id="backoffice-environment-banner-text-content"]';
$this->SetNodeAttribute($sTestRedBannerTextContentPath, 'id', 'ibo-page-banner-text-content');
}
/**
@@ -884,8 +902,51 @@ class iTopDesignFormat
$sPath = "/itop_design/classes//class/fields/field[@xsi:type='AttributeMetaEnum']/default_style";
$this->RemoveNodeFromXPath($sPath);
// N°3516 Bring back legacy themes
// Update test-red theme
$sTestRedBannerBackgroundColorPath = '/itop_design/branding/themes/theme[@id="test-red"]/variables/variable[@id="ibo-page-banner-background-color"]';
$this->SetNodeAttribute($sTestRedBannerBackgroundColorPath, 'id', 'backoffice-environment-banner-background-color');
$sTestRedBannerTextColorPath = '/itop_design/branding/themes/theme[@id="test-red"]/variables/variable[@id="ibo-page-banner-text-color"]';
$this->SetNodeAttribute($sTestRedBannerTextColorPath, 'id', 'backoffice-environment-banner-text-color');
$sTestRedBannerTextContentPath = '/itop_design/branding/themes/theme[@id="test-red"]/variables/variable[@id="ibo-page-banner-text-content"]';
$this->SetNodeAttribute($sTestRedBannerTextContentPath, 'id', 'backoffice-environment-banner-text-content');
}
/**
*
* Replace those weird setAttribute calls on DOMNode above 🤷
*
* @param string $sPath
* @param string $sAttributeName
* @param string $sAttributeValue
*
* @return void
*
* @since 3.0.0
*/
private function SetNodeAttribute($sPath, $sAttributeName, $sAttributeValue)
{
$oXPath = new DOMXPath($this->oDocument);
$oNodeList = $oXPath->query($sPath);
foreach ($oNodeList as $oNode)
{
if($oNode->attributes)
{
foreach ($oNode->attributes as $oAttribute)
{
if($oAttribute->nodeName === $sAttributeName)
{
$oAttribute->nodeValue = $sAttributeValue;
}
}
}
}
}
/**
* @param string $sPath
*

View File

@@ -233,6 +233,5 @@ EOF
APPROOT.'css/backoffice/',
)
);
$this->add_saas($sCssRelPath);
}
}