major style overhaul

fix the button
oops broke the button
2020-04-24 21:00:29 -04:00 · 2020-04-24 20:54:05 -04:00 · 2020-04-24 20:51:53 -04:00
3 changed files with 48 additions and 28 deletions
--- a/ui/static/ui/button.css
+++ b/ui/static/ui/button.css
--- a/ui/templates/ui/base.html
+++ b/ui/templates/ui/base.html
@@ -0,0 +1,24 @@
+{% load static %}
+
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>The Button</title>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.2/css/bulma.min.css">
+    <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
+    {% block css %}
+    {% endblock %}
+</head>
+
+<body>
+    {% csrf_token %}
+
+    {% block body %}
+    {% endblock %}
+
+    {% block js %}
+    {% endblock %}
+</body>
--- a/ui/templates/ui/button.html
+++ b/ui/templates/ui/button.html
@@ -1,33 +1,29 @@
+{% extends 'ui/base.html' %}
+
 {% load static %}

-<!DOCTYPE html>
-<html>
+{% block css %}
+<link rel="stylesheet" href="{% static 'ui/button.css' %}">
+{% endblock %}

-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Hello Bulma!</title>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.2/css/bulma.min.css">
-    <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
-</head>
+{% block js %}
+<script src="{% static 'ui/button.js' %}"></script>
+{% endblock %}

-<body>
-    {% csrf_token %}
-    <section class="section">
-        <div class="container">
-            <div>
-                <h1 class="title">
-                    The Button
-                </h1>
-                <button class="button" id="BUTTON">Press</button>
-            </div>
-            <div><br></div>
-            <div>
-                <h1 class="title" id="COUNT">{{ pressed }}</h1>
-            </div>
+
+{% block body %}
+<section class="section">
+    <div class="container">
+        <div>
+            <h1 class="title">
+                The Button
+            </h1>
+            <button class="button is-primary" id="BUTTON">Press</button>
        </div>
-    </section>
-    <script src="{% static 'ui/button.js' %}"></script>
-</body>
-
-</html>
+        <div><br></div>
+        <div>
+            <h1 class="title" id="COUNT">{{ pressed }}</h1>
+        </div>
+    </div>
+</section>
+{% endblock %}
Author	SHA1	Message	Date
ducoterra	1adaf20f61	major style overhaul	2020-04-24 21:00:29 -04:00
ducoterra	c32ed88713	fix the button	2020-04-24 20:54:05 -04:00
ducoterra	1d572cec43	oops broke the button	2020-04-24 20:51:53 -04:00