[api] Give operators the ability to easily add custom CSS

This enables various use-cases like custom icons and other personalisations.

custom.sample/css/custom.css

@@ -0,0 +1 @@
+/* Operator-provided custom CSS code */

dd-ctl

@@ -499,6 +499,12 @@ setup_moodle(){
 	php7 admin/cli/cfg.php --name=enablebadges --set=0
 	php7 admin/cli/cfg.php --name=timezone --set="${MOODLE_TIMEZONE-Europe/Madrid}"
 	php7 admin/cli/cfg.php --name=cookiehttponly --set=1
+	# Add operator custom CSS
+	php7 admin/cli/cfg.php --component=theme_cbe --name=scss \
+		--set="\$(cat <<-eof
+		$(sed -E "s/DOMAIN/${DOMAIN}/g" custom/css/custom.css 2>/dev/null || true)
+		eof
+		)"
 	php7 admin/cli/purge_caches.php
 	EOF
 }

dd-sso/docker-compose-parts/api.yml

@@ -30,9 +30,9 @@ services:
     container_name: dd-sso-api
     volumes:
       - /etc/localtime:/etc/localtime:ro
-      #- ${BUILD_SSO_ROOT_PATH}/docker/api/src:/api:rw ## Develop
       - ${CUSTOM_PATH}/custom/menu:/api/menu
       - ${CUSTOM_PATH}/custom/img:/api/api/static/img
+      - ${CUSTOM_PATH}/custom:/custom:ro
       - ${DATA_FOLDER}/avatars:/api/avatars:ro
     restart: unless-stopped
     networks:

dd-sso/docker/api/src/api/lib/menu.py

@@ -20,6 +20,7 @@
 
 import json
 import logging
+import os.path
 import pprint
 import time
 import traceback
@@ -33,12 +34,19 @@ if TYPE_CHECKING:
     from api.flaskapp import ApiFlaskApp
 
 
-def write_css() -> None:
+def write_css(app: "ApiFlaskApp") -> None:
     env = Environment(loader=FileSystemLoader("api/static/_templates"))
     css_template = env.get_template("dd.css")
     with open("menu/custom.yaml", "r") as menu_custom_file:
         menu_custom_yaml = menu_custom_file.read()
     menu_custom = yaml.full_load(menu_custom_yaml)
+    # Add custom CSS from operator
+    menu_custom["custom_css"] = ""
+    custom_css_file = "/custom/css/custom.css"
+    if os.path.isfile(custom_css_file):
+        menu_custom["custom_css"] = (
+            open(custom_css_file).read().replace("DOMAIN", app.config["DOMAIN"])
+        )
     css = css_template.render(data=menu_custom)
     with open("api/static/css/dd.css", "w") as css_file:
         css_file.write(css)
@@ -56,7 +64,7 @@ class Menu:
         self.menudict = self.gen_header()
         pprint.pprint(self.menudict)
         self.write_headers()
-        write_css()
+        write_css(app)
 
     def patch_url(self, subdomain_part: str, domain: str, url: str) -> str:
         """

dd-sso/docker/api/src/api/static/_templates/admin.html

@@ -1,3 +1,4 @@
+{#
 <!--
 #   Copyright © 2021,2022 IsardVDI S.L.
 #
@@ -18,6 +19,7 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 -->
+#}
 {% block css %}
 <style>
   /* Header used classes */

dd-sso/docker/api/src/api/static/_templates/admin_old.html

@@ -1,3 +1,4 @@
+{#
 <!--
 #   Copyright © 2021,2022 IsardVDI S.L.
 #
@@ -18,6 +19,7 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 -->
+#}
 {% block css %}
 <style>
   /* Header used classes */

dd-sso/docker/api/src/api/static/_templates/apps_menu.html

@@ -1,3 +1,4 @@
+{#
 <!--
 #   Copyright © 2021,2022 IsardVDI S.L.
 #
@@ -18,6 +19,7 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 -->
+#}
 <div id="navbar-menu-apps">
     <div id="menu-apps-btn">
         <div id="dropdownMenuAppsButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

dd-sso/docker/api/src/api/static/_templates/dd.css

@@ -1,3 +1,4 @@
+{#
 /*!
 *   Copyright © 2021,2022 IsardVDI S.L.
 *
@@ -18,6 +19,7 @@
 *
 * SPDX-License-Identifier: AGPL-3.0-or-later
 */
+#}
 
 #body-user, #body-settings, #body-public {
     font-family: 'Montserrat', sans-serif;
@@ -216,3 +218,8 @@ div#content-vue {
 #content.app-files [data-path="/"][data-file="Talk"] {
   display: none !important;
 }
+
+{% if data.custom_css %}
+/* Add custom CSS from operator */
+{{ data.custom_css }}
+{% endif %}

dd-sso/docker/api/src/api/static/_templates/sso.html

@@ -1,3 +1,4 @@
+{#
 <!--
 #   Copyright © 2021,2022 IsardVDI S.L.
 #
@@ -18,6 +19,7 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 -->
+#}
 {% block css %}
 <style>
   /* Header used classes */

dd-sso/docker/api/src/api/static/_templates/sso_old.html

@@ -1,3 +1,4 @@
+{#
 <!--
 #   Copyright © 2021,2022 IsardVDI S.L.
 #
@@ -18,6 +19,7 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 -->
+#}
 {% block css %}
 <style>
   /* Header used classes */

dd-sso/docker/api/src/api/static/_templates/user_menu.html

@@ -1,3 +1,4 @@
+{#
 <!--
 #   Copyright © 2021,2022 IsardVDI S.L.
 #
@@ -18,6 +19,7 @@
 #
 # SPDX-License-Identifier: AGPL-3.0-or-later
 -->
+#}
 <div id="navbar-menu-apps">
     <div id="menu-apps-btn">
         <button type="button" id="dropdownMenuAppsButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">