themes properly implemented #1 - requires db init

README.md

@@ -35,6 +35,7 @@ BLINKIES_UPLOAD_FOLDER = 'myriad/static/blinkies' # where site assets "blinkies"
 STAMPS_UPLOAD_FOLDER = 'myriad/static/stamps' # where site assets "stamps" will be stored
 INLINE_UPLOAD_FOLDER = 'myriad/static/inline' # where site assets "misc inline" will be stored
 MISC_UPLOAD_FOLDER = 'myriad/static/misc' # where other small images will be stored
+THEMES_FOLDER = 'myriad/static/themes' # where theme choices will be stored
 ```
 
 # usage

myriad/manage.py

@@ -44,8 +44,9 @@ def edit(mid):
             name = request.form['name']
             bio = request.form['bio']
             subtitle = request.form['subtitle']
+            theme = request.form["theme"]
             privacy = request.form["privacy"]
-            db.execute("UPDATE member SET member_name=(?), bio=(?), subtitle=(?), public=(?) WHERE id=(?)",(name, bio, subtitle, privacy, mid))
+            db.execute("UPDATE member SET member_name=(?), bio=(?), subtitle=(?), public=(?), theme=(?) WHERE id=(?)",(name, bio, subtitle, privacy, theme, mid))
             db.commit()
 
         if "file" in request.files:
@@ -106,7 +107,9 @@ def edit(mid):
         else:
             unjoined_groups.append(group)
 
-    return render_template("manage/edit.html", member=member, icons=icons, unjoined_groups=unjoined_groups, joined_groups=joined_groups)
+    themes = os.listdir(current_app.config["THEMES_FOLDER"])
+
+    return render_template("manage/edit.html", member=member, icons=icons, unjoined_groups=unjoined_groups, joined_groups=joined_groups, themes=themes)
 
 @bp.route("/set_main_icon/<mid>/<icon_id>")
 @login_required

myriad/schema.sql

@@ -21,21 +21,8 @@ CREATE TABLE member (
   main_icon INTEGER,
   homepage BOOLEAN NOT NULL DEFAULT 0,
   front BOOLEAN NOT NULL DEFAULT 0,
-  card_border TEXT NOT NULL DEFAULT '#99dfff',
-  card_bg TEXT NOT NULL DEFAULT '#e6f7ff',
-  heading_bg TEXT NOT NULL DEFAULT '#b3e7ff',
-  heading_border TEXT NOT NULL DEFAULT '#008bcc',
-  heading_name TEXT NOT NULL DEFAULT 'black',
-  heading_subtitle TEXT NOT NULL DEFAULT 'black',
-  card_text TEXT NOT NULL DEFAULT 'black',
-  icon_border TEXT NOT NULL DEFAULT '#008bcc',
-  page_bg TEXT NOT NULL DEFAULT '#00b7ff',
-  gradient1 TEXT NOT NULL DEFAULT '#00b7ff',
-  gradient2 TEXT NOT NULL DEFAULT '#57c785',
-  gradient3 TEXT NOT NULL DEFAULT '#eddd53',
-  a1 TEXT NOT NULL DEFAULT '#008bcc',
-  a2 TEXT NOT NULL DEFAULT '#026897',
   public BOOLEAN NOT NULL DEFAULT 1,
+  theme TEXT NOT NULL DEFAULT 'default',
   FOREIGN KEY (user_id) REFERENCES user (id),
   FOREIGN KEY (main_icon) REFERENCES icons (id)
 );

myriad/static/themes/default.css

@@ -0,0 +1,40 @@
+.default{
+    background-color:#e6f7ff;
+    border-color:#99dfff;
+    color:black;
+}
+.default .heading
+{
+    background-color:#b3e7ff;
+    border-color:#008bcc;
+    color:black;
+}
+.default .heading b
+{
+    color:black;
+}
+.default a{
+    color: #008bcc;
+}
+.default a:hover{
+    color: #026897;
+}
+.default ::selection {
+    background: #008bcc;
+    color: white;
+    text-shadow: none;
+}
+.default ::-moz-selection {
+    background: #008bcc;
+    color: #EEE;
+    text-shadow: none;
+}
+.default .icon{
+    border-color:#008bcc;
+}
+
+.default body{
+    background: #00b7ff;
+    background: linear-gradient(90deg, #00b7ff 0%, #57c785 50%, #eddd53 100%);
+    scrollbar-color:#008bcc #b3e7ff;
+}

myriad/static/themes/purple.css

@@ -0,0 +1,44 @@
+.purple{
+    background-color:#ecc9fa;
+    border-color:#a414da;
+    color:black;
+}
+.purple .heading
+{
+    background-color:#d991f4;
+    border-color:#a414da;
+    color:black;
+}
+.purple .heading b
+{
+    color:black;
+}
+.purple a{
+    color: #a414da;
+}
+.purple a:hover{
+    color: #720e98;
+}
+.purple ::selection {
+    background:#a414da;
+    color: white;
+    text-shadow: none;
+}
+.purple ::-moz-selection {
+    background: #a414da;
+    color: #EEE;
+    text-shadow: none;
+}
+.purple .icon{
+    border-color:#a414da;
+}
+
+body.purple{
+    background: #fb46c0;
+    background: linear-gradient(90deg, #fb46c0 0%, #a414da 50%, #720e98 100%);
+    scrollbar-color:#a414da #d991f4;
+}
+.purple .container{
+    background-color:#ecc9fa;
+    border-color:#a414da;
+}

myriad/templates/auth/login.html

@@ -5,6 +5,8 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
+  
   <form method="post">
     <label for="username">Username</label>
     <input name="username" id="username" required><br>
@@ -12,4 +14,6 @@
     <input type="password" name="password" id="password" required><br>
     <input type="submit" value="Log In">
   </form>
+
+  </div>
 {% endblock %}

myriad/templates/auth/register.html

@@ -5,6 +5,8 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
+
   <form method="post">
     <label for="username">Username</label>
     <input name="username" id="username" required><br>
@@ -12,4 +14,6 @@
     <input type="password" name="password" id="password" required><br>
     <input type="submit" value="Register">
   </form>
+
+  </div>
 {% endblock %}

myriad/templates/base.html

@@ -3,6 +3,9 @@
 <title>{% block title %}{% endblock %} - Myriad</title>
 <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
 
+<link rel="stylesheet" href="{{ url_for('static', filename='themes/default.css') }}">
+<link rel="stylesheet" href="{{ url_for('static', filename='themes/purple.css') }}">
+
 
 <div id="main">
   
@@ -40,13 +43,7 @@
 
     </div>
 
-  <div class="container">
-
-    {% block header %}{% endblock %}
-    {% for message in get_flashed_messages() %}
-      <div class="flash">{{ message }}</div>
-    {% endfor %}
+  
     {% block content %}{% endblock %}
-  </div>
 
 </div>

myriad/templates/blog/blog.html

@@ -5,10 +5,11 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
   
   {% for post in blog %}
     {% set op = member_ids[post[1]] %}
-    {% if not g.user and op[23]==0 %}
+    {% if not g.user and op[9]==0 %}
     {% elif not g.user and post[5]==0 %}
     {% else %}
     <div class="post">
@@ -18,7 +19,7 @@
         <img src="{{ url_for('static', filename='any.jpg') }}" class="icon">
       {% endif %}
         <div class="title">{{post[3]|safe}}</div>
-        <div class="timestamp">{{post[2]}} - <a href="{{ url_for('home.page', mid=post[1]) }}">{{op[3]}}</a> {% if g.user %}{% if op[23]==0 %}(Private){% else %}(Public)</b>{% endif %}{% endif %}</div>
+        <div class="timestamp">{{post[2]}} - <a href="{{ url_for('home.page', mid=post[1]) }}">{{op[3]}}</a> {% if g.user %}{% if op[9]==0 %}(Private){% else %}(Public)</b>{% endif %}{% endif %}</div>
         <div class="content">
             {{post[4]|safe}}
         </div>
@@ -30,4 +31,9 @@
     {% endif %}
   {% endfor %}
 
+  {% if not blog %}
+  <p>There are currently no posts to view</p>
+  {% endif %}
+
+</div>
 {% endblock %}

myriad/templates/blog/edit.html

@@ -5,6 +5,8 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
+
   <form method="post">
     <label for="title">Title</label>
     <input name="title" id="title" value="{{post[3]}}"><br>
@@ -24,4 +26,5 @@
     <input type="submit" value="Submit">
   </form>
 
+</div>
 {% endblock %}

myriad/templates/blog/new.html

@@ -5,6 +5,8 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
+
   <form method="post">
     <label for="title">Title</label>
     <input name="title" id="title"><br>
@@ -24,6 +26,6 @@
     <input type="submit" value="Submit">
   </form>
 
-  {{ error }}
 
+</div>
 {% endblock %}

myriad/templates/full.html

@@ -5,60 +5,26 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
 
+    {% if memberlist %}
     <div class="maintext">
         jump to:<br>
         {% for member in memberlist %}
-        {% if not g.user and member[23]==0  %}
+        {% if not g.user and member[9]==0  %}
         {% else %}
         <a href="#m{{ member[0] }}">{{ member[3] }}</a> | 
         {% endif %}
         {% endfor %}
     </div>
+    {% endif %}
   
     {% for member in memberlist %}
 
-    <style>
-        #m{{member[0]}}{
-            background-color:{{member[10]}};
-	        border-color:{{member[9]}};
-            color:{{member[15]}};
-        }
-        #m{{member[0]}} .heading
-        {
-            background-color:{{member[11]}};
-            border-color:{{member[12]}};
-            color:{{member[14]}};
-        }
-        #m{{member[0]}} .heading b
-        {
-            color:{{member[13]}};
-        }
-        #m{{member[0]}} a{
-            color: {{member[21]}};
-        }
-        #m{{member[0]}} a:hover{
-            color: {{member[22]}};
-        }
-        #m{{member[0]}} ::selection {
-            background: {{member[12]}};
-            color: white;
-            text-shadow: none;
-        }
-        #m{{member[0]}} ::-moz-selection {
-            background: {{member[12]}};
-            color: #EEE;
-            text-shadow: none;
-        }
-        #m{{member[0]}} .icon{
-            border-color:{{member[16]}};
-        }
-    </style>
-
-    {% if not g.user and member[23]==0  %}
+    {% if not g.user and member[9]==0  %}
     
     {% else %}
-    <div class="profile" id="m{{ member[0] }}">
+    <div class="profile {{member[10]}}" id="m{{ member[0] }}">
         <div class="heading"><b>{{ member[3]|safe }}</b> {{ member[4]|safe }}</div>
         {% if icons[member[0]] %}
         <img src="{{ url_for('static', filename='icons/'+icons[member[0]]) }}" class="icon">
@@ -77,4 +43,9 @@
 
     {% endfor %}
 
+    {% if not memberlist %}
+    <p>There are currently no members to view</p>
+    {% endif %}
+
+</div>
 {% endblock %}

myriad/templates/groups.html

@@ -2,6 +2,7 @@
 {% block title %}Groups{% endblock %}
 
 {% block content %}
+<div class="container">
 
   {% for group in groups %}
   {% if not g.user and group[3]==0 %}
@@ -18,4 +19,9 @@
     {% endif %}
   {% endfor %}
 
+  {% if not groups %}
+  <p>There are currently no groups to view</p>
+  {% endif %}
+
+</div>
 {% endblock %}

myriad/templates/index.html

@@ -2,57 +2,23 @@
 {% block title %}Welcome{% endblock %}
 
 {% block content %}
+<div class="container">
 
   {% if front_list|length > 0 %}
   <div id="frontbanner" class="heading">
     <b>currently fronting: </b> {% for member in front_list %} <a href="{{ url_for('home.page', mid=member[0]) }}">{{ member[3] }}</a> {% if front_list.index(member) != front_list|length -1 %}&{% endif %} {% endfor %}
   </div>
+  {% else %}
+    <p>There are currently no members listed as fronting</p>
   {% endif %}
 
   {% for member in home_pins %}
 
-  {% if not g.user and member[23]==0 %}
+  {% if not g.user and member[9]==0 %}
   {% else %}
 
-  <style>
-        #m{{member[0]}}{
-            background-color:{{member[10]}};
-	        border-color:{{member[9]}};
-            color:{{member[15]}};
-        }
-        #m{{member[0]}} .heading
-        {
-            background-color:{{member[11]}};
-            border-color:{{member[12]}};
-            color:{{member[14]}};
-        }
-        #m{{member[0]}} .heading b
-        {
-            color:{{member[13]}};
-        }
-        #m{{member[0]}} a{
-            color: {{member[21]}};
-        }
-        #m{{member[0]}} a:hover{
-            color: {{member[22]}};
-        }
-        #m{{member[0]}} ::selection {
-            background: {{member[12]}};
-            color: white;
-            text-shadow: none;
-        }
-        #m{{member[0]}} ::-moz-selection {
-            background: {{member[12]}};
-            color: #EEE;
-            text-shadow: none;
-        }
-        #m{{member[0]}} .icon{
-            border-color:{{member[16]}};
-        }
-    </style>
-
 
-  <div class="profile" id="m{{ member[0] }}">
+  <div class="profile {{member[10]}}" id="m{{ member[0] }}">
         <div class="heading"><b>{{ member[3]|safe }}</b> {{ member[4]|safe }}</div>
         {% if icons[member[0]] %}
         <img src="{{ url_for('static', filename='icons/'+icons[member[0]]) }}" class="icon">
@@ -71,5 +37,9 @@
     {% endif %}
     {% endfor %}
 
+    {% if not home_pins %}
+        <p>There are currently no members pinned to the homepage.</p>
+    {% endif %}
 
+</div>
 {% endblock %}

myriad/templates/manage/assets.html

@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
 
   <div class="heading big">Icons</div>
 
@@ -38,4 +39,5 @@
 
   <div class="heading big">Stamps</div>
 
+  </div>
 {% endblock %}

myriad/templates/manage/edit.html

@@ -5,6 +5,8 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
+
   
   <a href="{{url_for('home.page', mid=member[0])}}">View {{member[3]}}'s page</a>
   <br class="clear" />
@@ -17,10 +19,17 @@
     <label for="subtitle">Subtitle</label>
     <input name="subtitle" id="subtitle" value="{{ member[4] }}"><br>
     <label for="bio">Description</label>
-    <textarea name="bio" id="bio">{{ member[5] }}</textarea><br>
-    <input type="radio" id="public" name="privacy" value=1 {% if member[23]==1 %}checked{% endif %}>
+    <textarea name="bio" id="bio">{{ member[5] }}</textarea><br><br>
+    <label for="theme">Theme</label>
+    <select name="theme" id="theme">
+      {% for theme in themes %}
+      {% set theme_name = theme.split(".")[0] %}
+      <option value="{{theme_name}}" {% if theme_name==member[10] %}selected{% endif %}>{{theme_name}}</option>
+      {% endfor %}
+    </select><br><br>
+    <input type="radio" id="public" name="privacy" value=1 {% if member[9]==1 %}checked{% endif %}>
     <label for="public">Public</label><br>
-    <input type="radio" id="private" name="privacy" value=0 {% if member[23]==0 %}checked{% endif %}>
+    <input type="radio" id="private" name="privacy" value=0 {% if member[9]==0 %}checked{% endif %}>
     <label for="private">Private</label><br>
     <input type="submit" value="Submit">
   </form>
@@ -66,55 +75,5 @@
     {% endfor %}
   </div>
 
-  <div class="heading">Manage Theme</div>
-
-  <form method="post">
-    <label for="c9">Card border colour:</label>
-    <input type="color" id="c9" name="c9" value="{{member[9]}}"><br>
-
-    <label for="c10">Card background colour:</label>
-    <input type="color" id="c10" name="c10" value="{{member[10]}}"><br>
-
-    <label for="c11">Heading background colour:</label>
-    <input type="color" id="c11" name="c11" value="{{member[11]}}"><br>
-
-    <label for="c12">Accent colour:</label>
-    <input type="color" id="c12" name="c12" value="{{member[12]}}"><br>
-
-    <label for="c13">Heading name text colour:</label>
-    <input type="color" id="c13" name="c13" value="{{member[13]}}"><br>
-    
-    <label for="c14">Heading subtitle text colour:</label>
-    <input type="color" id="c14" name="c14" value="{{member[14]}}"><br>
-
-    <label for="c15">Card text colour:</label>
-    <input type="color" id="c15" name="c15" value="{{member[15]}}"><br>
-
-    <label for="c16">Icon border colour:</label>
-    <input type="color" id="c16" name="c16" value="{{member[16]}}"><br>
-
-    <label for="c21">Links colour:</label>
-    <input type="color" id="c21" name="c21" value="{{member[21]}}"><br>
-
-    <label for="c22">Links hover colour:</label>
-    <input type="color" id="c22" name="c22" value="{{member[22]}}"><br>
-
-    <hr>
-
-    <label for="c18">Page Gradient colour 1</label>
-    <input type="color" id="c18" name="c18" value="{{member[18]}}"><br>
-
-    <label for="c19">Page Gradient colour 2</label>
-    <input type="color" id="c19" name="c19" value="{{member[19]}}"><br>
-
-    <label for="c20">Page Gradient colour 3</label>
-    <input type="color" id="c20" name="c20" value="{{member[20]}}"><br>
-
-    <input type="submit" value="Set Member Theme">
-  </form>
-
-  <a href="{{ url_for('manage.reset_theme', mid=member[0]) }}">Click here to reset member theme to default</a>
-
-  {{ error }}
-
+</div>
 {% endblock %}

myriad/templates/manage/groups.html

@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
 
   <div class="heading big">Create new group</div>
   <form method="post">
@@ -34,4 +35,5 @@
     <hr>
   {% endfor %}
 
+  </div>
 {% endblock %}

myriad/templates/manage/new.html

@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block content %}
+<div class="container">
   <form method="post">
     <label for="name">Name</label>
     <input name="name" id="name" required><br>
@@ -13,6 +14,6 @@
     <input type="submit" value="Submit">
   </form>
 
-  {{ error }}
 
+</div>
 {% endblock %}

myriad/templates/page.html

@@ -1,52 +1,13 @@
 {% extends 'base.html' %}
 {% block title %}{{ member[3] }}{% endblock %}
 
-
-
 {% block content %}
 
+<script>document.body.classList.add("{{member[10]}}");</script>
 
-<style>
-    body{
-        background: {{member[17]}};
-        background: linear-gradient(90deg, {{member[17]}} 0%, {{member[18]}} 50%, {{member[19]}} 100%);
-        scrollbar-color:{{member[12]}}{{member[11]}};
-    }
-    .container{
-        background-color:{{member[10]}};
-        border-color:{{member[9]}};
-    }
-    .heading{
-        background-color:{{member[11]}};
-        border-color:{{member[12]}};
-        color:{{member[14]}};
-    }
-    .icon{
-        border-color:{{member[16]}};
-    }
-    .bio{
-        color:{{member[15]}};
-    }
-    .heading b
-    {
-        color:{{member[13]}};
-    }
-    a{
-        color: {{member[21]}};
-    }
-    a:hover{
-        color: {{member[22]}};
-    }
-    ::selection {
-        background: {{member[12]}};
-    }
-    ::-moz-selection {
-        background: {{member[12]}};
-    }
-</style>
+    <div class="container {{member[10]}}">
 
-
-    {% if not g.user and member[23]==0 %}
+    {% if not g.user and member[9]==0 %}
     permission denied
     {% else %}
 
@@ -95,4 +56,6 @@
 
     {% endif %}
 
+    </div>
+
 {% endblock %}