Merge files to theme.css (1)

remove asset and head.php
rename former theme.css to theme_base.css
create new css/options folder for optional CSS files to be added

build.sh

@@ -1,5 +1,5 @@
 #!/bin/bash
 
 cd themes/FlexTheme
-lessc -x ./less/build.less ./css/theme.css
+lessc -x ./less/build.less ./css/theme_base.css
 cd ../../

controllers/ConfigController.php

@@ -22,7 +22,6 @@ public function actionIndex()
         $form = new Config();
 
         if ($form->load(Yii::$app->request->post()) && $form->save()) {
-            Yii::$app->assetManager->clear();
             $this->view->saved();
             return $this->redirect(['/flex-theme/config']);
         }
@@ -35,7 +34,6 @@ public function actionColors()
         $form = new ColorSettings();
 
         if ($form->load(Yii::$app->request->post()) && $form->save()) {
-            Yii::$app->assetManager->clear();
             $this->view->saved();
             return $this->redirect(['/flex-theme/config/colors']);
         }
@@ -71,7 +69,6 @@ public function actionAdvanced()
             }
             // Save
             if ($config->save() && $colorSettings->save() && $form->load(Yii::$app->request->post()) && $form->save()) {
-                Yii::$app->assetManager->clear();
                 $this->view->saved();
                 return $this->redirect(['/flex-theme/config/advanced']);
             }

helpers/FileHelper.php

@@ -0,0 +1,50 @@
+<?php
+
+namespace humhub\modules\flexTheme\helpers;
+
+use humhub\modules\flexTheme\models\Config;
+use Yii;
+
+class FileHelper {
+
+    const THEME_PATH = '@flex-theme/themes/FlexTheme';
+
+    public static function getVarsFile()
+    {
+        return Yii::getAlias(self::THEME_PATH . '/css/variables.css');
+    }
+
+    private static function getOptionsPath()
+    {
+        return Yii::getAlias(self::THEME_PATH . '/css/options');
+    }
+
+    private static function getThemeFile()
+    {
+        return Yii::getAlias(self::THEME_PATH . '/css/theme.css');
+    }
+
+    private static function getThemeBaseFile()
+    {
+        return Yii::getAlias(self::THEME_PATH . '/css/theme_base.css');
+    }
+
+    public static function updateThemeFile()
+    {
+        $theme_base = file_get_contents(self::getThemeBaseFile());
+        $vars = file_get_contents(self::getVarsFile());
+        $options = '';
+
+        $config = new Config();
+        if ($config->showUploadAsButtons) {
+            $options = file_get_contents(self::getOptionsPath() . '/showUploadAsButtons.css');
+        }
+
+        $content = $theme_base . $options . $vars;
+
+        file_put_contents(self::getThemeFile(), $content);
+
+        // Clear Asset Manager to reload theme.css
+        Yii::$app->assetManager->clear();
+    }
+}

models/ColorSettings.php

@@ -4,12 +4,14 @@
 
 use Yii;
 use humhub\modules\flexTheme\helpers\ColorHelper;
+use humhub\modules\flexTheme\helpers\FileHelper;
 use humhub\modules\ui\view\helpers\ThemeHelper;
 use humhub\modules\ui\icon\widgets\Icon;
 
 class ColorSettings extends \yii\base\Model
 {
     const BASE_THEME = 'HumHub';
+    const VARS_FILE = '@flex-theme/themes/FlexTheme/css/variables.css';
 
     // Main Colors (configurable)
     const MAIN_COLORS = ['default', 'primary', 'info', 'link', 'success', 'warning', 'danger'];
@@ -164,9 +166,12 @@ public function save()
         // Calculate and save lightened, darkened and faded colors
         self::saveSpecialColors();
 
-        // Save colors to file
+        // Save colors to variables file
         self::saveVarsToFile();
 
+        // Update theme.css
+        FileHelper::updateThemeFile();
+
         return true;
     }
 
@@ -246,12 +251,9 @@ public function saveVarsToFile()
               $vars = $vars .  '--' . $key . ':' . $value . ';';
         }
 
-        $config = new Config();
-        $additionalCss = $config->additionalCss();
-
-        $content = ':root {' . $vars . $additionalCss . '}';
+        $content = ':root {' . $vars . '}';
 
-        $filename = Yii::getAlias('@flex-theme/themes/FlexTheme/css/variables.css');
+        $filename = FileHelper::getVarsFile();
 
         file_put_contents($filename, $content);
     }

models/Config.php

@@ -4,6 +4,7 @@
 
 use Yii;
 use humhub\modules\flexTheme\helpers\ColorHelper;
+use humhub\modules\flexTheme\helpers\FileHelper;
 use humhub\modules\ui\view\helpers\ThemeHelper;
 use humhub\modules\user\models\User;
 use humhub\modules\ui\icon\widgets\Icon;
@@ -25,8 +26,6 @@ class Config extends \yii\base\Model
     public $showTopicMenu;
     public $showUploadAsButtons;
 
-    const UPLOAD_BUTTONS_CSS = '.upload-buttons .btn-group .fileinput-button {display: none;} .upload-buttons .btn-group .dropdown-toggle {display: none;} .upload-buttons .btn-group .dropdown-menu {display: inline-block; position: relative; border: none; padding: 0; margin: 0; width: auto; min-width: 0;} .upload-buttons .btn-group .dropdown-menu li { float: left; margin: 0; line-height: 1; border-radius: 10px;} .upload-buttons .btn-group .dropdown-menu li a {margin: 0 3px; padding: 3px;} .upload-buttons .btn-group .dropdown-menu li a i {margin: 1px;} .upload-buttons .btn-group .dropdown-menu li a[data-action-click="file.uploadByType"] {font-size: 0; padding: 5px 3px; } .upload-buttons .btn-group .dropdown-menu li:hover {   border-left-color: transparent !important; }';
-
     public static function getSetting(string $setting_name) {
 
         // Note: return can be empty
@@ -99,19 +98,9 @@ public function save() {
         $module->settings->set('showTopicMenu', $this->showTopicMenu);
         $module->settings->set('showUploadAsButtons', $this->showUploadAsButtons);
 
-        // Update variables.css (apply showUploadAsButtons)
-        $colors = new ColorSettings();
-        $colors->saveVarsToFile();
+        // Update theme.css (apply showUploadAsButtons)
+        FileHelper::updateThemeFile();
 
         return true;
     }
-
-    /* Additional CSS (ColorSettings uses it to generate the variables.css */
-    public function additionalCss()
-    {
-        if ($this->showUploadAsButtons) {
-            return self::UPLOAD_BUTTONS_CSS;
-        }
-        return '';
-    }
 }

themes/FlexTheme/css/options/showUploadAsButtons.css

@@ -0,0 +1,31 @@
+.upload-buttons .btn-group .fileinput-button, .upload-buttons .btn-group .dropdown-toggle {
+    display: none;
+}
+.upload-buttons .btn-group .dropdown-menu {
+    display: inline-block;
+    position: relative;
+    border: none;
+    padding: 0;
+    margin: 0;
+    width: auto;
+    min-width: 0;
+}
+.upload-buttons .btn-group .dropdown-menu li {
+    float: left;
+    margin: 0;
+    line-height: 1;
+    border-radius: 10px;
+}
+.upload-buttons .btn-group .dropdown-menu li a {
+    margin: 0 3px;
+    padding: 3px;
+}
+.upload-buttons .btn-group .dropdown-menu li a i {
+    margin: 1px;
+}
+.upload-buttons .btn-group .dropdown-menu li a[data-action-click="file.uploadByType"] {
+    font-size: 0; padding: 5px 3px;
+}
+.upload-buttons .btn-group .dropdown-menu li:hover {
+    border-left-color: transparent !important;
+}