4 files changed, 43 insertions, 7 deletions
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 505182c6..311e36b8 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="attachment">
+  <div class="attachment" :class="type">
     <a class="image-attachment" v-if="hidden" v-on:click.prevent="toggleHidden()">
       <img :key="nsfwImage" :src="nsfwImage"></img>
     </a>
@@ -42,6 +42,10 @@
           margin: 0.2em;
           align-self: flex-start;
 
+          &.html {
+            flex-basis: 100%;
+          }
+
           .hider {
               position: absolute;
               margin: 10px;
@@ -74,12 +78,11 @@
           .oembed {
               img {
                   width: 100%;
-                  height: 100%;
               }
           }
 
           .oembed {
-              border: 1px solid rgba(0, 0, 0, 0.14);
+              border: 1px solid;
               width: 100%;
 
               display: flex;
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
new file mode 100644
index 00000000..f979e7ab
--- /dev/null
+++ b/src/components/settings/settings.js
@@ -0,0 +1,9 @@
+import StyleSwitcher from '../style_switcher/style_switcher.vue'
+
+const settings = {
+  components: {
+    StyleSwitcher
+  }
+}
+
+export default settings
diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue
new file mode 100644
index 00000000..8bb0ffb1
--- /dev/null
+++ b/src/components/settings/settings.vue
@@ -0,0 +1,22 @@
+<template>
+  <div class="settings panel panel-default base00-background">
+    <div class="panel-heading base01-background base04">
+      Settings
+    </div>
+    <div class="panel-body">
+      <div class="setting-item">
+        <h2>Theme</h2>
+        <style-switcher></style-switcher>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script src="./settings.js">
+</script>
+
+<style>
+ .setting-item {
+   margin: 1em
+ }
+</style>
diff --git a/src/components/style_switcher/style_switcher.js b/src/components/style_switcher/style_switcher.js
index 954e2ff0..d265572d 100644
--- a/src/components/style_switcher/style_switcher.js
+++ b/src/components/style_switcher/style_switcher.js
@@ -1,8 +1,10 @@
 export default {
-  data: () => ({
-    availableStyles: [],
-    selected: false
-  }),
+  data () {
+    return {
+      availableStyles: [],
+      selected: this.$store.state.config.theme
+    }
+  },
   created () {
     const self = this
     window.fetch('/static/css/themes.json')