Make Submit button sticky

src/store/modules/normalizers.js

@@ -138,10 +138,7 @@ const parseProxyUrl = value => {
 }
 
 const partialUpdate = (group, key) => {
-  if (group === ':auto_linker' && key === ':opts') {
-    return false
-  }
-  return true
+  return group === ':auto_linker' && key === ':opts'
 }
 
 export const processNested = (valueForState, valueForUpdatedSettings, group, parentKey, parents, settings, updatedSettings) => {

src/views/settings/components/ActivityPub.vue

@@ -1,15 +1,15 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="activitypubData" :model="activitypubData" :label-width="labelWidth">
       <setting :setting-group="activitypub" :data="activitypubData"/>
     </el-form>
     <div class="line"/>
     <el-form ref="userData" :model="userData" :label-width="labelWidth">
       <setting :setting-group="user" :data="userData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Authentication.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="pleromaAuthenticatorData" :model="pleromaAuthenticatorData" :label-width="labelWidth">
       <setting :setting-group="pleromaAuthenticator" :data="pleromaAuthenticatorData"/>
     </el-form>
@@ -14,10 +14,10 @@
     <div class="line"/>
     <el-form ref="oauth2" :model="oauth2Data" :label-width="labelWidth">
       <setting :setting-group="oauth2" :data="oauth2Data"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/AutoLinker.vue

@@ -1,10 +1,12 @@
 <template>
-  <el-form v-if="!loading" ref="autoLinker" :model="autoLinkerData" :label-width="labelWidth">
-    <setting :setting-group="autoLinker" :data="autoLinkerData"/>
-    <el-form-item>
-      <el-button type="primary" @click="onSubmit">Submit</el-button>
-    </el-form-item>
-  </el-form>
+  <div v-if="!loading" class="form-container">
+    <el-form ref="autoLinker" :model="autoLinkerData" :label-width="labelWidth">
+      <setting :setting-group="autoLinker" :data="autoLinkerData"/>
+    </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
+  </div>
 </template>
 
 <script>

src/views/settings/components/Captcha.vue

@@ -1,15 +1,15 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="captchaData" :model="captchaData" :label-width="labelWidth">
       <setting :setting-group="captcha" :data="captchaData"/>
     </el-form>
     <div class="line"/>
     <el-form ref="kocaptchaData" :model="kocaptchaData" :label-width="labelWidth">
       <setting :setting-group="kocaptcha" :data="kocaptchaData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Esshd.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="esshdData" :model="esshdData" :label-width="labelWidth">
       <setting :setting-group="esshd" :data="esshdData"/>
       <el-form-item>
@@ -9,10 +9,10 @@
           After restarting, you should be able to connect to your Pleroma instance with <span class="code">ssh username@server -p $PORT</span>
         </p>
       </el-form-item>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Frontend.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="frontendData" :model="frontendData" :label-width="labelWidth">
       <setting :setting-group="frontend" :data="frontendData"/>
     </el-form>
@@ -20,10 +20,10 @@
     <el-form ref="markupData" :model="markupData" :label-width="labelWidth">
       <el-form-item label="Markup settings:"/>
       <setting :setting-group="markup" :data="markupData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Gopher.vue

@@ -1,10 +1,12 @@
 <template>
-  <el-form v-if="!loading" ref="gopher" :model="gopherData" :label-width="labelWidth">
-    <setting :setting-group="gopher" :data="gopherData"/>
-    <el-form-item>
-      <el-button type="primary" @click="onSubmit">Submit</el-button>
-    </el-form-item>
-  </el-form>
+  <div v-if="!loading" class="form-container">
+    <el-form v-if="!loading" ref="gopher" :model="gopherData" :label-width="labelWidth">
+      <setting :setting-group="gopher" :data="gopherData"/>
+    </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
+  </div>
 </template>
 
 <script>

src/views/settings/components/Http.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="httpData" :model="httpData" :label-width="labelWidth">
       <setting :setting-group="http" :data="httpData"/>
     </el-form>
@@ -18,10 +18,10 @@
     <div class="line"/>
     <el-form ref="webCacheTtl" :model="webCacheTtlData" :label-width="labelWidth">
       <setting :setting-group="webCacheTtl" :data="webCacheTtlData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Instance.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="instanceData" :model="instanceData" :label-width="labelWidth">
       <setting :setting-group="instance" :data="instanceData"/>
     </el-form>
@@ -31,10 +31,10 @@
     <div class="line"/>
     <el-form ref="pleromaUser" :model="pleromaUserData" :label-width="labelWidth">
       <setting :setting-group="pleromaUser" :data="pleromaUserData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/JobQueue.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="obanQueuesData" :model="obanQueuesData" :label-width="labelWidth">
       <setting :setting-group="obanQueues" :data="obanQueuesData"/>
     </el-form>
@@ -8,10 +8,10 @@
     </el-form>
     <el-form ref="activityExpiration" :model="activityExpirationData" :label-width="labelWidth">
       <setting :setting-group="activityExpiration" :data="activityExpirationData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Logger.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="loggerData" :model="loggerData" :label-width="labelWidth">
       <setting :setting-group="logger" :data="loggerData"/>
     </el-form>
@@ -15,10 +15,10 @@
     <el-form ref="quackData" :model="quackData" :label-width="labelWidth">
       <el-form-item label="Quack logger:"/>
       <setting :setting-group="quack" :data="quackData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/MRF.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="mrfSimple" :model="mrfSimpleData" :label-width="labelWidth">
       <setting :setting-group="mrfSimple" :data="mrfSimpleData"/>
     </el-form>
@@ -28,10 +28,10 @@
     <div class="line"/>
     <el-form ref="mrfVocabulary" :model="mrfVocabularyData" :label-width="labelWidth">
       <setting :setting-group="mrfVocabulary" :data="mrfVocabularyData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Mailer.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="mailer" :model="mailerData" :label-width="labelWidth">
       <setting :setting-group="mailer" :data="mailerData"/>
     </el-form>
@@ -9,10 +9,10 @@
     </el-form>
     <el-form ref="userEmail" :model="userEmail" :label-width="labelWidth">
       <setting :setting-group="userEmail" :data="userEmailData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/MediaProxy.vue

@@ -1,10 +1,12 @@
 <template>
-  <el-form v-if="!loading" ref="mediaProxy" :model="mediaProxyData" :label-width="labelWidth">
-    <setting :setting-group="mediaProxy" :data="mediaProxyData"/>
-    <el-form-item>
-      <el-button type="primary" @click="onSubmit">Submit</el-button>
-    </el-form-item>
-  </el-form>
+  <div v-if="!loading" class="form-container">
+    <el-form v-if="!loading" ref="mediaProxy" :model="mediaProxyData" :label-width="labelWidth">
+      <setting :setting-group="mediaProxy" :data="mediaProxyData"/>
+    </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
+  </div>
 </template>
 
 <script>

src/views/settings/components/Metadata.vue

@@ -1,15 +1,15 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="metadata" :model="metadataData" :label-width="labelWidth">
       <setting :setting-group="metadata" :data="metadataData"/>
     </el-form>
     <div class="line"/>
     <el-form ref="richMedia" :model="richMediaData" :label-width="labelWidth">
       <setting :setting-group="richMedia" :data="richMediaData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/Other.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="teslaAdapter" :model="teslaAdapterData" :label-width="labelWidth">
       <setting :setting-group="teslaAdapter" :data="teslaAdapterData"/>
     </el-form>
@@ -9,10 +9,10 @@
     </el-form>
     <el-form ref="remoteIp" :model="remoteIpData" :label-width="labelWidth">
       <setting :setting-group="remoteIp" :data="remoteIpData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/RateLimiters.vue

@@ -1,10 +1,12 @@
 <template>
-  <el-form v-if="!loading" ref="rateLimiters" :model="rateLimitersData" :label-width="labelWidth">
-    <setting :setting-group="rateLimiters" :data="rateLimitersData"/>
-    <el-form-item>
-      <el-button type="primary" @click="onSubmit">Submit</el-button>
-    </el-form-item>
-  </el-form>
+  <div v-if="!loading" class="form-container">
+    <el-form v-if="!loading" ref="rateLimiters" :model="rateLimitersData" :label-width="labelWidth">
+      <setting :setting-group="rateLimiters" :data="rateLimitersData"/>
+    </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
+  </div>
 </template>
 
 <script>

src/views/settings/components/Upload.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!loading">
+  <div v-if="!loading" class="form-container">
     <el-form ref="uploadData" :model="uploadData" :label-width="labelWidth">
       <setting :setting-group="upload" :data="uploadData"/>
     </el-form>
@@ -17,10 +17,10 @@
     <div class="line"/>
     <el-form ref="uploadAnonymizeFilename" :model="uploadAnonymizeFilenameData" :label-width="labelWidth">
       <setting :setting-group="uploadAnonymizeFilename" :data="uploadAnonymizeFilenameData"/>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Submit</el-button>
-      </el-form-item>
     </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
   </div>
 </template>
 

src/views/settings/components/WebPush.vue

@@ -1,10 +1,12 @@
 <template>
-  <el-form v-if="!loading" ref="vapidDetailsData" :model="vapidDetailsData" :label-width="labelWidth">
-    <setting :setting-group="vapidDetails" :data="vapidDetailsData"/>
-    <el-form-item>
-      <el-button type="primary" @click="onSubmit">Submit</el-button>
-    </el-form-item>
-  </el-form>
+  <div v-if="!loading" class="form-container">
+    <el-form v-if="!loading" ref="vapidDetailsData" :model="vapidDetailsData" :label-width="labelWidth">
+      <setting :setting-group="vapidDetails" :data="vapidDetailsData"/>
+    </el-form>
+    <div class="submit-button-container">
+      <el-button class="submit-button" type="primary" @click="onSubmit">Submit</el-button>
+    </div>
+  </div>
 </template>
 
 <script>

src/views/settings/styles/main.scss

@@ -2,6 +2,9 @@
   a {
     text-decoration: underline;
   }
+  .center-label label {
+    text-align: center;
+  }
   .code {
     background-color: #adbed67a;
     border-radius: 3px;
@@ -26,9 +29,6 @@
   .el-form-item .rate-limit {
     margin-right: 0;
   }
-  .center-label label {
-    text-align: center;
-  }
   .el-input-group__prepend {
     padding-left: 10px;
     padding-right: 10px;
@@ -46,6 +46,9 @@
     margin: 5px 0 0 0;
     overflow-wrap: break-word;
   }
+  .form-container {
+    margin-bottom: 80px;
+  }
   .highlight {
   background-color: #e6e6e6;
   }
@@ -152,6 +155,17 @@
   .ssl-tls-opts {
     margin: 36px 0 0 0;
   }
+  .submit-button {
+    float: right;
+    margin: 0 30px 22px 0;
+  }
+  .submit-button-container {
+    width: 100%;
+    position: fixed;
+    bottom: 0px;
+    right: 0;
+    z-index: 10000;
+  }
   .text {
     line-height: 20px;
     margin-right: 15px