more fixes, add fullwidth

src/components/scope_selector/scope_selector.vue

@@ -3,9 +3,9 @@
     v-if="!showNothing"
     class="ScopeSelector"
   >
-    <span
+    <button
       v-if="showDirect"
-      class="scope"
+      class="button-unstyled scope"
       :class="css.direct"
       :title="$t('post_status.scope.direct')"
       @click="changeVis('direct')"
@@ -14,10 +14,10 @@
         icon="envelope"
         class="fa-scale-110 fa-old-padding"
       />
-    </span>
-    <span
+    </button>
+    <button
       v-if="showPrivate"
-      class="scope"
+      class="button-unstyled scope"
       :class="css.private"
       :title="$t('post_status.scope.private')"
       @click="changeVis('private')"
@@ -26,10 +26,10 @@
         icon="lock"
         class="fa-scale-110 fa-old-padding"
       />
-    </span>
-    <span
+    </button>
+    <button
       v-if="showUnlisted"
-      class="scope"
+      class="button-unstyled scope"
       :class="css.unlisted"
       :title="$t('post_status.scope.unlisted')"
       @click="changeVis('unlisted')"
@@ -38,10 +38,10 @@
         icon="lock-open"
         class="fa-scale-110 fa-old-padding"
       />
-    </span>
-    <span
+    </button>
+    <button
       v-if="showPublic"
-      class="scope"
+      class="button-unstyled scope"
       :class="css.public"
       :title="$t('post_status.scope.public')"
       @click="changeVis('public')"
@@ -50,7 +50,7 @@
         icon="globe"
         class="fa-scale-110 fa-old-padding"
       />
-    </span>
+    </button>
   </div>
 </template>