From 33b1d85921e326e0d81c4bf1a6fa02fec2cbbd5c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 1 Apr 2018 22:07:25 +0300
Subject: border-radii moved to variables, made rgbo colors use theme data,
 customizable from settings screen.

---
 src/components/settings/settings.vue | 57 ++++++++++++++++++++----------------
 1 file changed, 32 insertions(+), 25 deletions(-)

(limited to 'src/components/settings/settings.vue')

diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue
index 98f70f7b..9f195687 100644
--- a/src/components/settings/settings.vue
+++ b/src/components/settings/settings.vue
@@ -54,33 +54,40 @@
 </script>
 
 <style lang="scss">
- .setting-item {
-   margin: 1em 1em 1.4em;
+@import '../../_variables.scss';
 
-   textarea {
-     width: 100%;
-     height: 100px;
-   }
+.setting-item {
+    margin: 1em 1em 1.4em;
 
-   .old-avatar {
-     width: 128px;
-     border-radius: 5px;
-   }
+    textarea {
+        width: 100%;
+        height: 100px;
+    }
 
-   .new-avatar {
-     object-fit: cover;
-     width: 128px;
-     height: 128px;
-     border-radius: 5px;
-   }
+    .old-avatar {
+        width: 128px;
+        border-radius: $fallback--avatarRadius;
+        border-radius: var(--avatarRadius, $fallback--avatarRadius);
+    }
 
-   .btn {
-     margin-top: 1em;
-     min-height: 28px;
-     width: 10em;
-   }
- }
- .setting-list {
-   list-style-type: none;
- }
+    .new-avatar {
+        object-fit: cover;
+        width: 128px;
+        height: 128px;
+        border-radius: $fallback--avatarRadius;
+        border-radius: var(--avatarRadius, $fallback--avatarRadius);
+    }
+
+    .btn {
+        margin-top: 1em;
+        min-height: 28px;
+        width: 10em;
+    }
+}
+.setting-list {
+    list-style-type: none;
+    li {
+        margin-bottom: 0.5em;
+    }
+}
 </style>
-- 
cgit v1.2.3-70-g09d2

