1 files changed, 32 insertions, 25 deletions
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>