Make submit buttons green and add forms (#1302)

Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: Anbraten <anton@ju60.de>

web/src/components/layout/popups/ManualPipelinePopup.vue

@@ -1,6 +1,7 @@
 <template>
   <Popup :open="open" @close="$emit('close')">
     <Panel v-if="!loading">
+      <form @submit.prevent="triggerManualPipeline">
         <span class="text-xl text-color">{{ $t('repo.manual_pipeline.title') }}</span>
         <InputField :label="$t('repo.manual_pipeline.select_branch')">
           <SelectField
@@ -17,7 +18,7 @@
               <TextField :model-value="name" disabled />
               <TextField :model-value="value" disabled />
               <div class="w-34 flex-shrink-0">
-              <Button type="submit" class="ml-auto" @click="deleteVar(name)">
+                <Button color="red" class="ml-auto" @click="deleteVar(name)">
                   <i-la-times />
                 </Button>
               </div>
@@ -42,7 +43,8 @@
             </form>
           </div>
         </InputField>
-      <Button type="submit" :text="$t('repo.manual_pipeline.trigger')" @click="triggerManualPipeline" />
+        <Button type="submit" :text="$t('repo.manual_pipeline.trigger')" />
+      </form>
     </Panel>
   </Popup>
 </template>
@@ -51,6 +53,7 @@
 import { onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 
+import Button from '~/components/atomic/Button.vue';
 import InputField from '~/components/form/InputField.vue';
 import SelectField from '~/components/form/SelectField.vue';
 import TextField from '~/components/form/TextField.vue';

web/src/components/repo/settings/CronTab.vue

@@ -80,6 +80,7 @@
 
         <Button
           type="submit"
+          color="green"
           :is-loading="isSaving"
           :text="isEditingCron ? $t('repo.settings.crons.save') : $t('repo.settings.crons.add')"
         />

web/src/components/repo/settings/GeneralTab.vue

@@ -4,7 +4,7 @@
       <h1 class="text-xl ml-2 text-color">{{ $t('repo.settings.general.general') }}</h1>
     </div>
 
-    <div v-if="repoSettings" class="flex flex-col">
+    <form v-if="repoSettings" class="flex flex-col" @submit.prevent="saveRepoSettings">
       <InputField
         docs-url="docs/usage/project-settings#pipeline-path"
         :label="$t('repo.settings.general.pipeline_path.path')"
@@ -72,13 +72,13 @@
       </InputField>
 
       <Button
+        type="submit"
         class="mr-auto"
         color="green"
         :is-loading="isSaving"
         :text="$t('repo.settings.general.save')"
-        @click="saveRepoSettings"
       />
-    </div>
+    </form>
   </Panel>
 </template>
 

web/src/components/repo/settings/RegistriesTab.vue

@@ -67,6 +67,7 @@
 
         <Button
           type="submit"
+          color="green"
           :is-loading="isSaving"
           :text="isEditingRegistry ? $t('repo.settings.registries.save') : $t('repo.settings.registries.add')"
         />

web/src/components/secrets/SecretEdit.vue

@@ -23,8 +23,9 @@
       </InputField>
 
       <Button
-        :is-loading="isSaving"
         type="submit"
+        color="green"
+        :is-loading="isSaving"
         :text="isEditingSecret ? $t(i18nPrefix + 'save') : $t(i18nPrefix + 'add')"
       />
     </form>

web/src/views/repo/RepoWrapper.vue

@@ -37,7 +37,6 @@
 
       <Button
         v-if="repoPermissions.push"
-        type="submit"
         :text="$t('repo.manual_pipeline.trigger')"
         class="ml-auto"
         @click="showManualPipelinePopup = true"