🎨 Improving structure / format of the code

components/modal.vue

@@ -25,7 +25,7 @@
   left: 0;
   width: 100%;
   height: 100%;
-  background-color: rgba(0, 0, 0, 0.87);
+  background-color: rgba(0, 0, 0, 0.32);
   display: flex;
   align-items: center;
   justify-content: center;

pages/index.vue

@@ -458,7 +458,8 @@
                 :disabled="!isValidURL"
                 v-tooltip.bottom="$t('copy_request_link')"
               >
-                <i class="material-icons">file_copy</i>
+                <i v-if="navigatorShare" class="material-icons">share</i>
+                <i v-else class="material-icons">file_copy</i>
               </button>
               <button
                 class="icon"
@@ -1509,7 +1510,8 @@ export default {
       fb,
       customMethod: false,
       files: [],
-      filenames: ""
+      filenames: "",
+      navigatorShare: navigator.share
     };
   },
   watch: {

pages/settings.vue

@@ -270,7 +270,7 @@ export default {
           aceEditor: "vibrant_ink"
         },
         {
-          color: "var(--bg-color)",
+          color: "var(--ac-color)",
           name: this.$t("auto_system"),
           vibrant: window.matchMedia("(prefers-color-scheme: light)").matches,
           class: "auto",