Skip to content

Commit a31535b

Browse files
FasseFasse
authored
Merge pull request #1988 from Admidio/feature-use-more-theme-base-colors
Better color theming and new color picker for tertiary, text and background
2 parents b205d1c + b86212b commit a31535b

File tree

8 files changed

+136
-62
lines changed

8 files changed

+136
-62
lines changed

‎install/db_scripts/preferences.php‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -40,13 +40,16 @@
4040
// Theme
4141
'theme' => 'simple',
4242
'theme_fallback' => 'simple',
43-
'color_primary' => '#349aaa',
44-
'color_secondary' => '#263340',
45-
'logo_file' => '',
46-
'logo_file_max_height' => '60',
47-
'admidio_headline' => 'SYS_ONLINE_MEMBERSHIP_ADMINISTRATION',
48-
'favicon_file' => '',
49-
'additional_styles_file' => '',
43+
'theme_color_primary' => '#349aaa',
44+
'theme_color_secondary' => '#a7d9e0',
45+
'theme_color_tertiary' => '#e9ecef',
46+
'theme_color_text' => '#263340',
47+
'theme_color_background' => '#ffffff',
48+
'theme_logo_file' => '',
49+
'theme_logo_file_max_height' => '60',
50+
'theme_admidio_headline' => 'SYS_ONLINE_MEMBERSHIP_ADMINISTRATION',
51+
'theme_favicon_file' => '',
52+
'theme_additional_styles_file' => '',
5053

5154
// Registration
5255
'registration_adopt_all_data' => '1',

‎install/db_scripts/update_5_1.xml‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,5 +26,27 @@
2626
<step id="230" database="mysql">UPDATE %PREFIX%_preferences prf INNER JOIN %PREFIX%_organizations org ON org.org_id = prf.prf_org_id SET prf.prf_value = org.org_email_administrator WHERE prf.prf_name = 'mail_sender_email' AND COALESCE(LENGTH(prf.prf_value), 0) = 0</step>
2727
<step id="240" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = org.org_email_administrator FROM %PREFIX%_organizations org WHERE org.org_id = prf.prf_org_id AND prf.prf_name = 'mail_sender_email' AND COALESCE(LENGTH(prf.prf_value), 0) = 0</step>
2828
<step id="250" database="mysql">UpdateStepsCode::updateStep51ConvertCharsetToUtf8mb4</step>
29+
<step id="260">UPDATE %PREFIX%_preferences SET prf_value = '#a7d9e0' WHERE prf_name = 'color_secondary' AND prf_value = '#263340'</step>
30+
<step id="270" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'color_primary' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_color_primary'</step>
31+
<step id="280" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'color_primary' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_color_primary'</step>
32+
<step id="290">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'color_primary'</step>
33+
<step id="280" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'color_secondary' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_color_secondary'</step>
34+
<step id="290" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'color_secondary' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_color_secondary'</step>
35+
<step id="300">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'color_secondary'</step>
36+
<step id="310" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'logo_file' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_logo_file'</step>
37+
<step id="320" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'logo_file' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_logo_file'</step>
38+
<step id="330">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'logo_file'</step>
39+
<step id="340" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'logo_file_max_height' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_logo_file_max_height'</step>
40+
<step id="350" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'logo_file_max_height' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_logo_file_max_height'</step>
41+
<step id="360">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'logo_file_max_height'</step>
42+
<step id="370" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'admidio_headline' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_admidio_headline'</step>
43+
<step id="380" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'admidio_headline' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_admidio_headline'</step>
44+
<step id="390">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'admidio_headline'</step>
45+
<step id="400" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'favicon_file' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_favicon_file'</step>
46+
<step id="410" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'favicon_file' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_favicon_file'</step>
47+
<step id="420">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'favicon_file'</step>
48+
<step id="430" database="mysql">UPDATE %PREFIX%_preferences pr1 INNER JOIN %PREFIX%_preferences pr2 ON pr2.prf_name = 'additional_styles_file' AND pr2.prf_org_id = pr1.prf_org_id SET pr1.prf_value = pr2.prf_value WHERE pr1.prf_name = 'theme_additional_styles_file'</step>
49+
<step id="440" database="pgsql">UPDATE %PREFIX%_preferences pr1 SET prf_value = pr2.prf_value FROM %PREFIX%_preferences pr2 WHERE pr2.prf_name = 'additional_styles_file' AND pr2.prf_org_id = pr1.prf_org_id AND pr1.prf_name = 'theme_additional_styles_file'</step>
50+
<step id="450">DELETE FROM %PREFIX%_preferences WHERE prf_name = 'additional_styles_file'</step>
2951
<step>stop</step>
3052
</update>

‎languages/en.xml‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -345,10 +345,16 @@
345345
<string name="SYS_CLAMP_TEXT_LINES_DESC">This setting allows you to specify the maximum number of lines to be displayed as an #VAR1#. If 0 is selected, the complete text will be displayed. (Default: 0)</string>
346346
<string name="SYS_CLOCK">o\'clock</string>
347347
<string name="SYS_CODING">Coding</string>
348-
<string name="SYS_COLOR_PRIMARY">Primary Color</string>
349-
<string name="SYS_COLOR_PRIMARY_DESC">The main color used for Admidio. The title bar will use this color, as well as headlines.</string>
350-
<string name="SYS_COLOR_SECONDARY">Secondary Color</string>
351-
<string name="SYS_COLOR_SECONDARY_DESC">The secondary color used for Admidio. The side bar will use this color, as well as the preferences sections.</string>
348+
<string name="SYS_COLOR_BACKGROUND">Background color</string>
349+
<string name="SYS_COLOR_BACKGROUND_DESC">The color of the background used at all pages for Admidio.</string>
350+
<string name="SYS_COLOR_PRIMARY">Primary color</string>
351+
<string name="SYS_COLOR_PRIMARY_DESC">The main color used for Admidio. The title bar will use this color, as well as headlines, links and buttons.</string>
352+
<string name="SYS_COLOR_SECONDARY">Secondary color</string>
353+
<string name="SYS_COLOR_SECONDARY_DESC">The secondary color used for Admidio. The background of the sidebar, as well as the tooltips or notice alerts, use this color.</string>
354+
<string name="SYS_COLOR_TERTIARY">Tertiary color</string>
355+
<string name="SYS_COLOR_TERTIARY_DESC">The tertiary color used for Admidio. The background of areas such as the group and role overview, preferences, or navigation path use this color.</string>
356+
<string name="SYS_COLOR_TEXT">Text color</string>
357+
<string name="SYS_COLOR_TEXT_DESC">The color of the text used for Admidio.</string>
352358
<string name="SYS_COLUMN">Column</string>
353359
<string name="SYS_COLUMN_POS">Column #VAR1#</string>
354360
<string name="SYS_COLUMN_SELECTION">Column selection</string>
@@ -1228,7 +1234,6 @@
12281234
<string name="SYS_PHP_VERSION_REQUIRED">Admidio requires #VAR1# or higher</string>
12291235
<string name="SYS_PIPE">Pipe (|)</string>
12301236
<string name="SYS_PLEASE_CHOOSE">Select option</string>
1231-
<string name="SYS_PLUGIN_DISABLED">This plugin is disabled.</string>
12321237
<string name="SYS_PLUGIN_INSTALL">Install plugin</string>
12331238
<string name="SYS_PLUGIN_MANAGER">Plugin Manager</string>
12341239
<string name="SYS_PLUGIN_MANAGER_DESC">Here you can manage the plugins of Admidio. Plugins are additional modules that can be installed to extend the functionality of Admidio. You can install, update or remove plugins.</string>

‎src/UI/Presenter/PagePresenter.php‎

Lines changed: 20 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -319,23 +319,36 @@ private function assignBasicSmartyVariables(): void
319319
$this->smarty->assign('registrationEnabled', $gSettingsManager->getBool('registration_module_enabled'));
320320

321321
// Design variables
322-
$this->smarty->assign('additionalStylesFile', $gSettingsManager->getString('additional_styles_file'));
323-
$this->smarty->assign('logoFile', $gSettingsManager->getString('logo_file'));
324-
$this->smarty->assign('logoFileMaxHeight', $gSettingsManager->getString('logo_file_max_height'));
325-
$this->smarty->assign('faviconFile', $gSettingsManager->getString('favicon_file'));
326-
$this->smarty->assign('admidioHeadline', Language::translateIfTranslationStrId($gSettingsManager->getString('admidio_headline')));
322+
$this->smarty->assign('additionalStylesFile', $gSettingsManager->getString('theme_additional_styles_file'));
323+
$this->smarty->assign('logoFile', $gSettingsManager->getString('theme_logo_file'));
324+
$this->smarty->assign('logoFileMaxHeight', $gSettingsManager->getString('theme_logo_file_max_height'));
325+
$this->smarty->assign('faviconFile', $gSettingsManager->getString('theme_favicon_file'));
326+
$this->smarty->assign('admidioHeadline', Language::translateIfTranslationStrId($gSettingsManager->getString('theme_admidio_headline')));
327327

328328
$styles = '';
329-
$color_primary = $gSettingsManager->getString('color_primary');
329+
$color_primary = $gSettingsManager->getString('theme_color_primary');
330330
if ($color_primary && $this->isValidHexColor($color_primary)) {
331331
$styles .= ' --bs-primary: ' . $color_primary . ";\n";
332332
$styles .= ' --bs-primary-rgb: ' . hexdec(substr($color_primary, 1, 2)) . ', ' . hexdec(substr($color_primary, 3, 2)) . ', ' . hexdec(substr($color_primary, 5, 2)) . ";\n";
333333
}
334-
$color_secondary = $gSettingsManager->getString('color_secondary');
334+
$color_secondary = $gSettingsManager->getString('theme_color_secondary');
335335
if ($color_secondary && $this->isValidHexColor($color_secondary)) {
336336
$styles .= ' --bs-secondary: ' . $color_secondary . ";\n";
337337
$styles .= ' --bs-secondary-rgb: ' . hexdec(substr($color_secondary, 1, 2)) . ', ' . hexdec(substr($color_secondary, 3, 2)) . ', ' . hexdec(substr($color_secondary, 5, 2)) . ";\n";
338338
}
339+
$color_tertiary = $gSettingsManager->getString('theme_color_tertiary');
340+
if ($color_tertiary && $this->isValidHexColor($color_tertiary)) {
341+
$styles .= ' --bs-tertiary: ' . $color_tertiary . ";\n";
342+
$styles .= ' --bs-tertiary-rgb: ' . hexdec(substr($color_tertiary, 1, 2)) . ', ' . hexdec(substr($color_tertiary, 3, 2)) . ', ' . hexdec(substr($color_tertiary, 5, 2)) . ";\n";
343+
}
344+
$color_text = $gSettingsManager->getString('theme_color_text');
345+
if ($color_text && $this->isValidHexColor($color_text)) {
346+
$styles .= ' --bs-body-color: ' . $color_text . ";\n";
347+
}
348+
$color_background = $gSettingsManager->getString('theme_color_background');
349+
if ($color_background && $this->isValidHexColor($color_background)) {
350+
$styles .= ' --bs-body-bg: ' . $color_background . ";\n";
351+
}
339352
if (!empty($styles)) {
340353
$this->smarty->assign('additionalStyles', ":root {\n$styles};");
341354
}

‎src/UI/Presenter/PreferencesPresenter.php‎

Lines changed: 32 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -828,46 +828,63 @@ public function createDesignForm(): string
828828
array('property' => FormPresenter::FIELD_REQUIRED, 'defaultValue' => $formValues['theme_fallback'], 'arrayKeyIsNotValue' => true, 'helpTextId' => 'ORG_ADMIDIO_THEME_FALLBACK_DESC')
829829
);
830830
$formDesign->addInput(
831-
'color_primary',
831+
'theme_color_primary',
832832
$gL10n->get('SYS_COLOR_PRIMARY'),
833-
$formValues['color_primary']??'#349aaa',
833+
$formValues['theme_color_primary']??'#349aaa',
834834
array('type' => 'color', 'helpTextId' => 'SYS_COLOR_PRIMARY_DESC')
835835
);
836836
$formDesign->addInput(
837-
'color_secondary',
837+
'theme_color_secondary',
838838
$gL10n->get('SYS_COLOR_SECONDARY'),
839-
$formValues['color_secondary']??'#263340',
839+
$formValues['theme_color_secondary']??'#263340',
840840
array('type' => 'color', 'helpTextId' => 'SYS_COLOR_SECONDARY_DESC')
841841
);
842-
843842
$formDesign->addInput(
844-
'additional_styles_file',
843+
'theme_color_tertiary',
844+
$gL10n->get('SYS_COLOR_TERTIARY'),
845+
$formValues['theme_color_tertiary']??'#e9ecef',
846+
array('type' => 'color', 'helpTextId' => 'SYS_COLOR_TERTIARY_DESC')
847+
);
848+
$formDesign->addInput(
849+
'theme_color_background',
850+
$gL10n->get('SYS_COLOR_BACKGROUND'),
851+
$formValues['theme_color_background']??'#ffffff',
852+
array('type' => 'color', 'helpTextId' => 'SYS_COLOR_BACKGROUND_DESC')
853+
);
854+
$formDesign->addInput(
855+
'theme_color_text',
856+
$gL10n->get('SYS_COLOR_TEXT'),
857+
$formValues['theme_color_text']??'#263340',
858+
array('type' => 'color', 'helpTextId' => 'SYS_COLOR_TEXT_DESC')
859+
);
860+
$formDesign->addInput(
861+
'theme_additional_styles_file',
845862
$gL10n->get('SYS_ADDITIONAL_CSS_FILE'),
846-
$formValues['additional_styles_file']??'',
863+
$formValues['theme_additional_styles_file']??'',
847864
array('helpTextId' => 'SYS_ADDITIONAL_CSS_FILE_DESC')
848865
);
849866
$formDesign->addInput(
850-
'logo_file',
867+
'theme_logo_file',
851868
$gL10n->get('SYS_LOGO_FILE'),
852-
$formValues['logo_file']??'',
869+
$formValues['theme_logo_file']??'',
853870
array('helpTextId' => 'SYS_LOGO_FILE_DESC')
854871
);
855872
$formDesign->addInput(
856-
'logo_file_max_height',
873+
'theme_logo_file_max_height',
857874
$gL10n->get('SYS_LOGO_FILE_MAX_HEIGHT'),
858-
$formValues['logo_file_max_height']??'',
875+
$formValues['theme_logo_file_max_height']??'',
859876
array('property' => FormPresenter::FIELD_REQUIRED, 'type' => 'number', 'minNumber' => 40, 'maxNumber' => 200, 'step' => 1,'helpTextId' => 'SYS_LOGO_FILE_MAX_HEIGHT_DESC')
860877
);
861878
$formDesign->addInput(
862-
'admidio_headline',
879+
'theme_admidio_headline',
863880
$gL10n->get('SYS_HEADLINE'),
864-
$formValues['admidio_headline']??'',
881+
$formValues['theme_admidio_headline']??'',
865882
array('helpTextId' => 'SYS_ADMIDIO_HEADLINE_DESC')
866883
);
867884
$formDesign->addInput(
868-
'favicon_file',
885+
'theme_favicon_file',
869886
$gL10n->get('SYS_FAVICON_FILE'),
870-
$formValues['favicon_file']??'',
887+
$formValues['theme_favicon_file']??'',
871888
array('helpTextId' => 'SYS_FAVICON_FILE_DESC')
872889
);
873890
$formDesign->addSubmitButton(

‎system/classes/HtmlPage.php‎

Lines changed: 22 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -303,27 +303,40 @@ private function assignBasicSmartyVariables()
303303
$this->smarty->assign('registrationEnabled', $gSettingsManager->getBool('registration_module_enabled'));
304304

305305
// Design variables
306-
$this->smarty->assign('additionalStylesFile', $gSettingsManager->getString('additional_styles_file'));
307-
$this->smarty->assign('logoFile', $gSettingsManager->getString('logo_file'));
308-
$this->smarty->assign('logoFileMaxHeight', $gSettingsManager->getString('logo_file_max_height'));
309-
$this->smarty->assign('faviconFile', $gSettingsManager->getString('favicon_file'));
310-
$this->smarty->assign('admidioHeadline', Language::translateIfTranslationStrId($gSettingsManager->getString('admidio_headline')));
306+
$this->smarty->assign('additionalStylesFile', $gSettingsManager->getString('theme_additional_styles_file'));
307+
$this->smarty->assign('logoFile', $gSettingsManager->getString('theme_logo_file'));
308+
$this->smarty->assign('logoFileMaxHeight', $gSettingsManager->getString('theme_logo_file_max_height'));
309+
$this->smarty->assign('faviconFile', $gSettingsManager->getString('theme_favicon_file'));
310+
$this->smarty->assign('admidioHeadline', Language::translateIfTranslationStrId($gSettingsManager->getString('theme_admidio_headline')));
311311

312312
$styles = '';
313-
$color_primary = $gSettingsManager->getString('color_primary');
313+
$color_primary = $gSettingsManager->getString('theme_color_primary');
314314
if ($color_primary && $this->isValidHexColor($color_primary)) {
315315
$styles .= ' --bs-primary: ' . $color_primary . ";\n";
316316
$styles .= ' --bs-primary-rgb: ' . hexdec(substr($color_primary, 1, 2)) . ', ' . hexdec(substr($color_primary, 3, 2)) . ', ' . hexdec(substr($color_primary, 5, 2)) . ";\n";
317317
}
318-
$color_secondary = $gSettingsManager->getString('color_secondary');
318+
$color_secondary = $gSettingsManager->getString('theme_color_secondary');
319319
if ($color_secondary && $this->isValidHexColor($color_secondary)) {
320320
$styles .= ' --bs-secondary: ' . $color_secondary . ";\n";
321321
$styles .= ' --bs-secondary-rgb: ' . hexdec(substr($color_secondary, 1, 2)) . ', ' . hexdec(substr($color_secondary, 3, 2)) . ', ' . hexdec(substr($color_secondary, 5, 2)) . ";\n";
322322
}
323+
$color_tertiary = $gSettingsManager->getString('theme_color_tertiary');
324+
if ($color_tertiary && $this->isValidHexColor($color_tertiary)) {
325+
$styles .= ' --bs-tertiary: ' . $color_tertiary . ";\n";
326+
$styles .= ' --bs-tertiary-rgb: ' . hexdec(substr($color_tertiary, 1, 2)) . ', ' . hexdec(substr($color_tertiary, 3, 2)) . ', ' . hexdec(substr($color_tertiary, 5, 2)) . ";\n";
327+
}
328+
$color_text = $gSettingsManager->getString('theme_color_text');
329+
if ($color_text && $this->isValidHexColor($color_text)) {
330+
$styles .= ' --bs-body-color: ' . $color_text . ";\n";
331+
}
332+
$color_background = $gSettingsManager->getString('theme_color_background');
333+
if ($color_background && $this->isValidHexColor($color_background)) {
334+
$styles .= ' --bs-body-bg: ' . $color_background . ";\n";
335+
}
323336
if (!empty($styles)) {
324337
$this->smarty->assign('additionalStyles', ":root {\n$styles};");
325338
}
326-
339+
327340
// add imprint and data protection
328341
if ($gSettingsManager->has('system_url_imprint') && strlen($gSettingsManager->getString('system_url_imprint')) > 0) {
329342
$urlImprint = $gSettingsManager->getString('system_url_imprint');
@@ -668,7 +681,7 @@ public function show()
668681
echo $e->getMessage();
669682
}
670683
}
671-
684+
672685
/**
673686
* Checks if the provided color string is a valid hex color format.
674687
* @param string $color Color string to check.

0 commit comments

Comments
 (0)