more formatting

src/components/blurhash/Blurhash.vue

@@ -6,61 +6,59 @@
 </template>
 
 <script>
-import { decode } from "blurhash";
+import { decode } from 'blurhash'
 
 export default {
   name: 'Blurhash',
   props: {
     hash: {
       type: String,
-      required: true,
+      required: true
     },
     width: {
       type: Number,
-      required: true,
+      required: true
     },
     height: {
       type: Number,
-      required: true,
+      required: true
     },
     punch: {
       type: Number,
-      default: null,
+      default: null
-    },
+    }
   },
   data() {
     return {
       canvas: null,
-      ctx: null,
+      ctx: null
-    };
+    }
   },
   mounted() {
-    this.canvas = this.$refs.canvas;
+    this.canvas = this.$refs.canvas
-    this.ctx = this.canvas.getContext('2d');
+    this.ctx = this.canvas.getContext('2d')
-    this.canvas.width = 1024;
+    this.canvas.width = 1024
-    this.canvas.height = 512;
+    this.canvas.height = 512
-    this.draw();
+    this.draw()
   },
   methods: {
     draw() {
-      const pixels = decode(this.hash, this.width, this.height, this.punch);
+      const pixels = decode(this.hash, this.width, this.height, this.punch)
-      const imageData = this.ctx.createImageData(this.width, this.height);
+      const imageData = this.ctx.createImageData(this.width, this.height)
-      imageData.data.set(pixels);
+      imageData.data.set(pixels)
-      this.ctx.putImageData(imageData, 0, 0);
+      this.ctx.putImageData(imageData, 0, 0)
-      fetch("/static/blurhash-overlay.png")
+      fetch('/static/blurhash-overlay.png')
         .then((response) => response.blob())
         .then((blob) => {
-          const img = new Image();
+          const img = new Image()
-          img.src = URL.createObjectURL(blob);
+          img.src = URL.createObjectURL(blob)
           img.onload = () => {
-            this.ctx.drawImage(img, 0, 0, this.width, this.height);
+            this.ctx.drawImage(img, 0, 0, this.width, this.height)
-          };
+          }
-        });
+        })
-    },
+    }
   }
 }
 </script>
 
-<style scoped>
+<style scoped></style>
-
-</style>

src/components/emoji_grid/emoji_grid.js

@@ -9,7 +9,7 @@ const EmojiGrid = {
       type: Array
     }
   },
-  data () {
+  data() {
     return {
       containerWidth: 0,
       containerHeight: 0,
@@ -17,7 +17,7 @@ const EmojiGrid = {
       resizeObserver: null
     }
   },
-  mounted () {
+  mounted() {
     const rect = this.$refs.container.getBoundingClientRect()
     this.containerWidth = rect.width
     this.containerHeight = rect.height
@@ -29,29 +29,29 @@ const EmojiGrid = {
     })
     this.resizeObserver.observe(this.$refs.container)
   },
-  beforeUnmount () {
+  beforeUnmount() {
     this.resizeObserver.disconnect()
     this.resizeObserver = null
   },
   watch: {
-    groups () {
+    groups() {
       // Scroll to top when grid content changes
       if (this.$refs.container) {
         this.$refs.container.scrollTo(0, 0)
       }
     },
-    activeGroup (group) {
+    activeGroup(group) {
       this.$emit('activeGroup', group)
     }
   },
   methods: {
-    onScroll () {
+    onScroll() {
       this.scrollPos = this.$refs.container.scrollTop
     },
-    onEmoji (emoji) {
+    onEmoji(emoji) {
       this.$emit('emoji', emoji)
     },
-    scrollToItem (itemId) {
+    scrollToItem(itemId) {
       const container = this.$refs.container
       if (!container) return
 
@@ -65,7 +65,7 @@ const EmojiGrid = {
   },
   computed: {
     // Total height of scroller content
-    gridHeight () {
+    gridHeight() {
       if (this.itemList.length === 0) return 0
       const lastItem = this.itemList[this.itemList.length - 1]
       return (
@@ -73,7 +73,7 @@ const EmojiGrid = {
         ('title' in lastItem ? GROUP_TITLE_HEIGHT : EMOJI_SIZE)
       )
     },
-    activeGroup () {
+    activeGroup() {
       const items = this.itemList
       for (let i = items.length - 1; i >= 0; i--) {
         const item = items[i]
@@ -83,7 +83,7 @@ const EmojiGrid = {
       }
       return null
     },
-    itemList () {
+    itemList() {
       const items = []
       let x = 0
       let y = 0
@@ -111,14 +111,14 @@ const EmojiGrid = {
       }
       return items
     },
-    visibleItems () {
+    visibleItems() {
       const startPos = this.scrollPos - BUFFER_SIZE
       const endPos = this.scrollPos + this.containerHeight + BUFFER_SIZE
       return this.itemList.filter((i) => {
         return i.position.y >= startPos && i.position.y < endPos
       })
     },
-    scrolledClass () {
+    scrolledClass() {
       if (this.scrollPos <= 5) {
         return 'scrolled-top'
       } else if (this.scrollPos >= this.gridHeight - this.containerHeight - 5) {

src/components/emoji_grid/emoji_grid.vue

@@ -7,7 +7,7 @@
   >
     <div
       :style="{
-        height: `${gridHeight}px`,
+        height: `${gridHeight}px`
       }"
     >
       <template v-for="item in visibleItems">
@@ -37,7 +37,7 @@
           <img
             v-else
             :src="item.emoji.imageUrl"
-          >
+          />
         </span>
       </template>
     </div>

src/components/follow_request_card/follow_request_card.js

@@ -86,8 +86,10 @@ const FollowRequestCard = {
     shouldConfirmDeny() {
       return this.mergedConfig.modalOnDenyFollow
     },
-    show () {
+    show() {
-      const notifId = this.$store.state.api.followRequests.find(req => req.id === this.user.id)
+      const notifId = this.$store.state.api.followRequests.find(
+        (req) => req.id === this.user.id
+      )
 
       return notifId !== undefined
     }

src/components/follow_request_card/follow_request_card.vue

@@ -1,5 +1,8 @@
 <template>
-  <basic-user-card :user="user" v-if="show">
+  <basic-user-card
+    v-if="show"
+    :user="user"
+  >
     <div class="follow-request-card-content-container">
       <button
         class="btn button-default"

src/components/followed_tag_card/FollowedTagCard.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="followed-tag-card">
     <span>
-      <router-link :to="{ name: 'tag-timeline', params: {tag: tag.name}}">
+      <router-link :to="{ name: 'tag-timeline', params: { tag: tag.name } }">
         <span class="tag-link">#{{ tag.name }}</span>
       </router-link>
       <span class="unfollow-tag">
@@ -33,22 +33,22 @@ export default {
     tag: {
       type: Object,
       required: true
-    },
+    }
   },
   // this is a hack to update the state of the button
   // for some reason, List does not update on changes to the tag object
   data: () => ({
     isFollowing: true
   }),
-  mounted () {
+  mounted() {
     this.isFollowing = this.tag.following
   },
   methods: {
-    unfollowTag (tag) {
+    unfollowTag(tag) {
       this.$store.dispatch('unfollowTag', tag)
       this.isFollowing = false
     },
-    followTag (tag) {
+    followTag(tag) {
       this.$store.dispatch('followTag', tag)
       this.isFollowing = true
     }
@@ -57,21 +57,22 @@ export default {
 </script>
 
 <style scoped>
-  .followed-tag-card {
+.followed-tag-card {
   margin-left: 1rem;
   margin-top: 1rem;
   margin-bottom: 1rem;
-  }
+}
-  .unfollow-tag {
+.unfollow-tag {
   position: absolute;
   right: 1rem;
-  }
+}
 
-  .tag-link {
+.tag-link {
   font-size: large;
-  }
+}
 
-  .unfollow-tag-button, .follow-tag-button {
+.unfollow-tag-button,
+.follow-tag-button {
   font-size: medium;
-  }
+}
 </style>

src/components/post_status_form/post_status_form.vue

@@ -212,9 +212,7 @@
             :on-scope-change="changeVis"
           />
 
-          <div
+          <div class="language-selector">
-            class="language-selector"
-            >
             <Select
               id="post-language"
               v-model="newStatus.language"

src/modules/config.js

@@ -118,7 +118,7 @@ export const defaultState = {
   translationLanguage: undefined, // instance default,
   supportedTranslationLanguages: {}, // instance default
   userProfileDefaultTab: 'statuses',
-  useBlurhash: true,
+  useBlurhash: true
 }
 
 // caching the instance default properties