Show theme options

bookwyrm/forms.py

@@ -4,6 +4,8 @@ from collections import defaultdict
 from urllib.parse import urlparse
 
 from django import forms
+from django.contrib.staticfiles.utils import get_files
+from django.contrib.staticfiles.storage import StaticFilesStorage
 from django.forms import ModelForm, PasswordInput, widgets, ChoiceField
 from django.forms.widgets import Textarea
 from django.utils import timezone
@@ -460,13 +462,22 @@ class SiteThemeForm(CustomForm):
         fields = ["default_theme"]
 
 
+def get_theme_choices():
+    """static files"""
+    choices = list(get_files(StaticFilesStorage(), location="css/themes"))
+    current = models.Theme.objects.values_list("path", flat=True)
+    return [(c, c) for c in choices if c not in current and c[-5:] == ".scss"]
+
+
 class ThemeForm(CustomForm):
     class Meta:
         model = models.Theme
         fields = ["name", "path"]
         widgets = {
             "name": forms.TextInput(attrs={"aria-describedby": "desc_name"}),
-            "path": forms.TextInput(attrs={"aria-describedby": "desc_path", "placeholder": _("example-theme.scss")}),
+            "path": forms.Select(
+                attrs={"aria-describedby": "desc_path"}, choices=get_theme_choices()
+            ),
         }
 
 

bookwyrm/migrations/0142_auto_20220227_1752.py

@@ -10,11 +10,11 @@ def add_default_themes(apps, schema_editor):
     theme_model = apps.get_model("bookwyrm", "Theme")
     theme_model.objects.using(db_alias).create(
         name="BookWyrm Light",
-        path="bookwyrm-light.scss",
+        path="css/themes/bookwyrm-light.scss",
     )
     theme_model.objects.using(db_alias).create(
         name="BookWyrm Dark",
-        path="bookwyrm-dark.scss",
+        path="css/themes/bookwyrm-dark.scss",
     )
 
 

bookwyrm/models/user.py

@@ -176,15 +176,13 @@ class User(OrderedCollectionPageMixin, AbstractUser):
     @property
     def get_theme(self):
         """get the theme given the user/site"""
-        path = "bookwyrm-light.scss"
         if self.theme:
-            path = self.theme.path
-        else:
-            site_model = apps.get_model("bookwyrm", "SiteSettings", require_ready=True)
-            site = site_model.objects.get()
-            if site.default_theme:
-                path = site.default_theme.path
-        return f"css/{path}"
+            return self.theme.path
+        site_model = apps.get_model("bookwyrm", "SiteSettings", require_ready=True)
+        site = site_model.objects.get()
+        if site.default_theme:
+            return site.default_theme.path
+        return "css/themes/bookwyrm-light.scss"
 
     @property
     def confirmation_link(self):

bookwyrm/static/css/themes/bookwyrm-dark.scss

@@ -1,4 +1,4 @@
-@import "vendor/bulma/sass/utilities/derived-variables.sass";
+@import "../vendor/bulma/sass/utilities/derived-variables.sass";
 
 /* Colors
  ******************************************************************************/
@@ -54,4 +54,4 @@ $menu-item-active-background-color: $link-background;
 $family-primary: $family-sans-serif;
 $family-secondary: $family-sans-serif;
 
-@import "bookwyrm.scss";
+@import "../bookwyrm.scss";

bookwyrm/static/css/themes/bookwyrm-light.scss

@@ -1,4 +1,4 @@
-@import "vendor/bulma/sass/utilities/derived-variables.sass";
+@import "../vendor/bulma/sass/utilities/derived-variables.sass";
 
 /* Colors
  ******************************************************************************/
@@ -52,4 +52,4 @@ $menu-item-active-background-color: $link-background;
 $family-primary: $family-sans-serif;
 $family-secondary: $family-sans-serif;
 
-@import "bookwyrm.scss";
+@import "../bookwyrm.scss";

bookwyrm/templates/layout.html

@@ -9,7 +9,7 @@
     <title>{% block title %}BookWyrm{% endblock %} - {{ site.name }}</title>
     <meta name="viewport" content="width=device-width, initial-scale=1">
     {% with theme_path=user.get_theme %}
-    <link href="{% sass_src theme_path %}" rel="stylesheet" type="text/css" />
+    <link href="{% sass_src 'css/themes/bookwyrm-light.scss' %}" rel="stylesheet" type="text/css" />
     {% endwith %}
 
     <link rel="search" type="application/opensearchdescription+xml" href="{% url 'opensearch' %}" title="{% blocktrans with site_name=site.name %}{{ site_name }} search{% endblocktrans %}" />

bookwyrm/templates/settings/themes.html

@@ -20,7 +20,7 @@
         <h2 class="title is-5">{% trans "How to add a theme" %}</h2>
         <ol>
             <li>
-                {% trans "Copy the theme file into the <code>bookwyrm/static/css/</code> directory on your server from the command line." %}
+                {% trans "Copy the theme file into the <code>bookwyrm/static/css/themes</code> directory on your server from the command line." %}
             </li>
             <li>
                 {% trans "Run <code>./bw-dev compilescss</code>." %}
@@ -67,7 +67,9 @@
                     {% trans "Theme filename" %}
                 </label>
                 <div class="control">
-                    {{ theme_form.path }}
+                    <div class="select">
+                        {{ theme_form.path }}
+                    </div>
                     {% include 'snippets/form_errors.html' with errors_list=theme_form.path.errors id="desc_path" %}
                 </div>
             </div>