layout

.gitignore

@@ -23,3 +23,5 @@ dist-ssr
 *.sln
 *.sw?
 .idea/
+
+.env

src/components/GunForm.vue

@@ -75,10 +75,10 @@
           </div>
         </div>
         <div class="w-full mt-5">
-          <Button :loading="loading" @click="$emit('save')" class="p-button-success" icon="fa-sharp fa-light fa-floppy-disk" label="Save"/>
           <router-link to="/guns">
-            <Button class="p-button-warning ml-3" icon="fa-sharp fa-light fa-times" label="Cancel"/>
+            <Button severity="secondary" class="mr-3" icon="fa-sharp fa-light fa-arrow-left" label="Back"/>
           </router-link>
+          <Button :loading="loading" @click="$emit('save')" severity="success" icon="fa-sharp fa-light fa-floppy-disk" label="Save"/>
           <ConfirmPopup />
           <Button @click="confirmDelete" v-if="gun.id" class="p-button-danger ml-3" icon="fa-sharp fa-light fa-trash" label="Delete"/>
         </div>

src/pages/Edit.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full flex flex-row flex-wrap justify-around">
-    <div class="w-1/2 lg:w-1/2 m-5">
+    <div class="w-full lg:w-1/2 m-5">
       <GunForm :loading="loading" @upload="getGun" v-if="gun" @save="save" :gun="gun"/>
     </div>
     <div class="mt-10 w-full lg:w-1/2 m-5">
@@ -23,8 +23,8 @@
             </div>
             <div>
               <ConfirmPopup />
-              <Button @click="deletePhoto(photo.id)">
-                <i style="color: red;" class="fa-regular fa-2x fa-trash mr-5"></i> Delete Photo
+              <Button size="small" @click="deletePhoto(photo.id)">
+                <i style="color: red;" class="fa-regular fa-1x fa-trash mr-1"></i> Delete Photo
               </Button>
             </div>
           </div>