🚧 Fix css

Author: TimdeBeer1

src/openorganisatie/scss/_app.scss

@@ -3,9 +3,7 @@ h2,
 h3,
 h4,
 h5 {
-    margin-top: 0;
-    margin-bottom: 0;
-    line-height: 1.2;
+    line-height: 1.5;
 }
 
 h1 {

src/openorganisatie/scss/_settings.scss

@@ -23,23 +23,28 @@ $color-border: $color_secondary_dark;
 
 // css vars
 :root {
-    --color_primary: #{$color_primary};
-    --color_primary_dark: #{$color_primary_dark};
-
-    --color_secondary: #{$color_secondary};
-    --color_secondary_dark: #{$color_secondary_dark};
-    --color_secondary_light: #{$color_secondary_light};
-
-    --color_alert: #{$color_alert};
-    --color_alert_dark: #{$color_alert_dark};
-
-    --color-darkest: #{$color-darkest};
-    --color_dark: #{$color_dark};
-    --color_lightest: #{$color_lightest};
-    --color_muted: #{$color_muted};
-
-    --color_link: #{$color_link};
-    --color_link_hover: #{$color_link_hover};
-    --color-text: #{$color-text};
-    --color-border: #{$color-border};
+    // Link component
+    --link-color: #017092;
+    --link-color-hover: var(--link-color);
+    --link-color-muted: #6c757d;
+
+    // footer component
+    --footer-border-color: #dee2e6;
+
+    // tabs component
+    --tabs-border-color: #dee2e6;
+    --tabs-item-hover-border-color: #f3f3f3;
+
+    // Button component
+    --button-color: #ffffff;
+    --button-background-color: #04a5bb;
+    --button-hover-background-color: #017092;
+    --button-alert-background-color: #dc3545;
+    --button-alert-hover-background-color: #bd2130;
+}
+
+.content {
+    &#{&}--align-right {
+        text-align: right;
+    }
 }

src/openorganisatie/scss/screen.scss

@@ -1,3 +1,5 @@
+@use "vendor";
+
 @import 'settings';
 @import 'app';
 @import 'components';

src/openorganisatie/scss/vendor/_fa.scss

@@ -0,0 +1,2 @@
+@use "@fortawesome/fontawesome-free/scss/fontawesome";
+@use "@fortawesome/fontawesome-free/scss/solid";

src/openorganisatie/scss/vendor/_index.scss

@@ -0,0 +1 @@
+@use "fa";

src/openorganisatie/templates/index.html

@@ -42,9 +42,6 @@
 
 
 {% block api_links %}
-    {% url "schema-redoc-producten" as api_docs_producten %}
-    {% url "schema-redoc-producttypen" as api_docs_producttypen %}
-
     <a href="{% url 'identiteit_api:schema-redoc-identiteit' %}" class="button">
         <i class="fas fa-file-alt"></i>
         {% trans "Identiteit API specification" %}

src/openorganisatie/templates/master.html

@@ -25,7 +25,7 @@
 
         {% include "includes/footer.html" %}
         {% block scripts %}
-            <script src="{% static 'bundles/openproduct-js.js' %}" type="text/javascript"></script>
+            <script src="{% static 'bundles/openorganisatie-js.js' %}" type="text/javascript"></script>
         {% endblock scripts %}
     </body>
 </html>