Add custom CSS option

kizniche · Mar 4, 2024 · df64ee7 · df64ee7
1 parent 3841b95
commit df64ee7
Show file tree

Hide file tree

Showing 9 changed files with 69 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -19,6 +19,7 @@ This release changes the install directory from ~/Mycodo to /opt/Mycodo. This ne
  - Add ability to switch displaying hostname with custom text
  - Add Step Line Series Type to Graph (Synchronous) Widget
  - Add controller_restart as client endpoint
+ - Add option for custom CSS
 
 ### Miscellaneous
 

diff --git a/alembic_db/alembic/versions/a338ed3dce74_add_custom_css.py b/alembic_db/alembic/versions/a338ed3dce74_add_custom_css.py
@@ -0,0 +1,40 @@
+"""add custom CSS
+
+Revision ID: a338ed3dce74
+Revises: c7942284b74e
+Create Date: 2024-03-01 22:46:52.383396
+
+"""
+import sys
+import os
+
+sys.path.append(os.path.abspath(os.path.join(__file__, "../../../..")))
+
+from alembic_db.alembic_post_utils import write_revision_post_alembic
+
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = 'a338ed3dce74'
+down_revision = 'c7942284b74e'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    with op.batch_alter_table("misc") as batch_op:
+        batch_op.add_column(sa.Column('custom_css', sa.Text))
+
+    op.execute(
+        '''
+        UPDATE misc
+        SET custom_css=''
+        '''
+    )
+
+
+def downgrade():
+    with op.batch_alter_table("misc") as batch_op:
+        batch_op.drop_column('custom_css')
diff --git a/mycodo/config.py b/mycodo/config.py
@@ -14,7 +14,7 @@
 from config_translations import TRANSLATIONS as T
 
 MYCODO_VERSION = '8.15.13'
-ALEMBIC_VERSION = 'c7942284b74e'
+ALEMBIC_VERSION = 'a338ed3dce74'
 
 # FORCE UPGRADE MASTER
 # Set True to enable upgrading to the master branch of the Mycodo repository.

diff --git a/mycodo/databases/models/misc.py b/mycodo/databases/models/misc.py
@@ -48,6 +48,7 @@ class Misc(CRUDMixin, db.Model):
     net_test_timeout = db.Column(db.Integer, default=3)
     default_login_page = db.Column(db.String, default='password')
     hostname_override = db.Column(db.String, default='')
+    custom_css = db.Column(db.String, default='')
 
     # Measurement database
     db_name = 'influxdb'  # Default

diff --git a/mycodo/mycodo_flask/forms/forms_settings.py b/mycodo/mycodo_flask/forms/forms_settings.py
@@ -19,6 +19,7 @@
 from wtforms.validators import DataRequired
 from wtforms.validators import Optional
 from wtforms.widgets import NumberInput
+from wtforms.widgets import TextArea
 
 from mycodo.config_translations import TRANSLATIONS
 
@@ -90,6 +91,7 @@ class SettingsGeneral(FlaskForm):
     index_page = StringField(lazy_gettext('Index Page'))
     language = StringField(lazy_gettext('Language'))
     rpyc_timeout = StringField(lazy_gettext('Pyro Timeout'))
+    custom_css = StringField(lazy_gettext('Custom CSS'), widget=TextArea())
     hostname_override = StringField(lazy_gettext('Hostname Override'))
     daemon_debug_mode = BooleanField(lazy_gettext('Enable Daemon Debug Logging'))
     force_https = BooleanField(lazy_gettext('Force HTTPS'))

diff --git a/mycodo/mycodo_flask/routes_general.py b/mycodo/mycodo_flask/routes_general.py
@@ -81,6 +81,18 @@ def index_page():
     return clear_cookie_auth()
 
 
+@blueprint.route('/custom.css')
+@flask_login.login_required
+def custom_css():
+    """Load custom CSS"""
+    try:
+        settings = Misc.query.first()
+        if settings and settings.custom_css:
+            return settings.custom_css
+    except:
+        return ""
+
+
 @blueprint.route('/settings', methods=('GET', 'POST'))
 @flask_login.login_required
 def page_settings():

diff --git a/mycodo/mycodo_flask/templates/layout.html b/mycodo/mycodo_flask/templates/layout.html
@@ -169,6 +169,10 @@
 
   </script>
 
+  {% if misc.custom_css %}
+    <link href="/custom.css" rel="stylesheet">
+  {% endif %}
+
   {% block head %}{% endblock %}
   </head>
   <body>
@@ -217,7 +221,7 @@
               <a class="dropdown-item{% if active_page == 'notes' %} active{% endif %}" href="{{url_for('routes_page.page_notes')}}"><i class="fas fa-edit"></i> {{dict_translation['note']['title']}}</a>
               <a class="dropdown-item{% if active_page == 'export' %} active{% endif %}" href="{{url_for('routes_page.page_export')}}"><i class="fas fa-save"></i> {{dict_translation['export']['title'] + ' ' + dict_translation['import']['title']}}</a>
               <a class="dropdown-item{% if active_page == 'energy_usage_outputs' %} active{% endif %}" href="{{url_for('routes_page.page_energy_usage_outputs')}}"><i class="fas fa-sliders-h"></i> {{_('Energy Usage')}} ({{_('Outputs')}})</a>
-              <a class="dropdown-item{% if active_page == 'energy_usage_inputs_amps' %} active{% endif %}" href="{{url_for('routes_page.page_energy_usage_input_amps')}}"><i class="fas fa-sliders-h"></i> {{_('Energy Usage')}} ({{_('Amp Measure')}})</a>
+              <a id="energy_usage_inputs_amps" class="dropdown-item{% if active_page == 'energy_usage_inputs_amps' %} active{% endif %}" href="{{url_for('routes_page.page_energy_usage_input_amps')}}"><i class="fas fa-sliders-h"></i> {{_('Energy Usage')}} ({{_('Amp Measure')}})</a>
             </div>
           </li>
         {% for each_dash in dashboards if each_dash.unique_id == dashboard_id %}

diff --git a/mycodo/mycodo_flask/templates/settings/general.html b/mycodo/mycodo_flask/templates/settings/general.html
@@ -134,6 +134,12 @@ <h3 style="text-align: right; padding-bottom: 1.3em;"><a href="https://kizniche.
           {{form_settings_general.rpyc_timeout(class_='form-control', value=misc.rpyc_timeout, **{'title':_("Set the timeout (seconds) for Pyro connections (client-daemon communication). Requires daemon restart.")})}}
         </div>
       </div>
+      <div class="form-group">
+        {{form_settings_general.custom_css.label(class_='col-sm-12 control-label checkbox-nopad')}}
+        <div class="col-sm-12">
+          <textarea class="form-control" id="custom_css" name="custom_css" title="Set custom CSS" rows="4">{{misc.custom_css}}</textarea>
+        </div>
+      </div>
       <div class="form-group">
         {{form_settings_general.daemon_debug_mode.label(class_='col-sm-12 control-label checkbox-nopad')}}
         <div class="col-sm-12">

diff --git a/mycodo/mycodo_flask/utils/utils_settings.py b/mycodo/mycodo_flask/utils/utils_settings.py
@@ -387,6 +387,7 @@ def settings_general_mod(form):
                 force_https = mod_misc.force_https
                 mod_misc.force_https = form.force_https.data
                 mod_misc.rpyc_timeout = form.rpyc_timeout.data
+                mod_misc.custom_css = form.custom_css.data
                 mod_misc.hostname_override = form.hostname_override.data
                 mod_misc.daemon_debug_mode = form.daemon_debug_mode.data
                 mod_misc.hide_alert_success = form.hide_success.data