Merge pull request 'make status form selectors justified properly' (#398) from rat/akkoma-fe:status-form-selector into develop

Reviewed-on: #398

src/components/post_status_form/post_status_form.vue

@@ -190,6 +190,7 @@
         <div
           v-if="!disableScopeSelector"
           class="visibility-tray"
+          :class="{ 'visibility-tray-edit': isEdit }"
         >
           <scope-selector
             v-if="!disableVisibilitySelector"
@@ -200,7 +201,9 @@
           />
 
           <div
-            class="language-selector"
+            class="format-selector-container">
+            <div
+              class="format-selector"
               >
               <Select
                 id="post-language"
@@ -218,7 +221,7 @@
             </div>
             <div
               v-if="postFormats.length > 1"
-            class="text-format"
+              class="text-format format-selector"
             >
               <Select
                 id="post-content-type"
@@ -236,7 +239,7 @@
             </div>
             <div
               v-if="postFormats.length === 1 && postFormats[0] !== 'text/plain'"
-            class="text-format"
+              class="text-format format-selector"
             >
               <span class="only-format">
                 {{ $t(`post_status.content_type["${postFormats[0]}"]`) }}
@@ -244,6 +247,7 @@
             </div>
           </div>
         </div>
+      </div>
       <poll-form
         v-if="pollsAvailable"
         ref="pollForm"
@@ -460,6 +464,10 @@
     align-items: baseline;
   }
 
+  .visibility-tray-edit {
+    justify-content: right;
+  }
+
   .visibility-notice.edit-warning {
     > :first-child {
       margin-top: 0;
@@ -470,6 +478,12 @@
     }
   }
 
+  .format-selector-container {
+    .format-selector {
+      display: inline-block;
+    }
+  }
+
   .media-upload-icon, .poll-icon, .emoji-icon, .spoiler-icon {
     font-size: 1.85em;
     line-height: 1.1;