refactor(ui): minor ui improvements

components/environments/Add.vue

@@ -47,8 +47,8 @@ export default Vue.extend({
   methods: {
     addNewEnvironment() {
       if (!this.name) {
-        this.$toast.info(this.$t("environment.invalid_name").toString(), {
-          icon: "info",
+        this.$toast.error(this.$t("environment.invalid_name").toString(), {
+          icon: "error_outline",
         })
         return
       }

components/environments/Edit.vue

@@ -159,7 +159,7 @@ export default defineComponent({
     clearContent() {
       this.vars = []
       this.clearIcon = "done"
-      this.$toast.info(this.$t("state.cleared").toString(), {
+      this.$toast.success(this.$t("state.cleared").toString(), {
         icon: "clear_all",
       })
       setTimeout(() => (this.clearIcon = "clear_all"), 1000)
@@ -175,8 +175,8 @@ export default defineComponent({
     },
     saveEnvironment() {
       if (!this.name) {
-        this.$toast.info(this.$t("environment.invalid_name").toString(), {
-          icon: "info",
+        this.$toast.error(this.$t("environment.invalid_name").toString(), {
+          icon: "error_outline",
         })
         return
       }

components/environments/Environment.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex items-center group">
     <span
-      class="cursor-pointer flex w-10 justify-center items-center truncate"
+      class="cursor-pointer flex px-4 justify-center items-center"
       @click="$emit('edit-environment')"
     >
       <i class="material-icons">layers</i>
@@ -82,7 +82,7 @@ export default Vue.extend({
     removeEnvironment() {
       if (this.environmentIndex !== "Global")
         deleteEnvironment(this.environmentIndex)
-      this.$toast.error(this.$t("state.deleted").toString(), {
+      this.$toast.success(this.$t("state.deleted").toString(), {
         icon: "delete",
       })
     },

components/environments/ImportExport.vue

@@ -23,7 +23,7 @@
               $refs.options.tippy().hide()
             "
           />
-          <SmartItem
+          <span
             v-tippy="{ theme: 'tooltip' }"
             :title="
               !currentUser
@@ -32,20 +32,23 @@
                 ? $t('export.require_github')
                 : null
             "
-            :disabled="
-              !currentUser
-                ? true
-                : currentUser.provider !== 'github.com'
-                ? true
-                : false
-            "
-            icon="assignment_turned_in"
-            :label="$t('export.create_secret_gist')"
-            @click.native="
-              createEnvironmentGist
-              $refs.options.tippy().hide()
-            "
-          />
+          >
+            <SmartItem
+              :disabled="
+                !currentUser
+                  ? true
+                  : currentUser.provider !== 'github.com'
+                  ? true
+                  : false
+              "
+              icon="assignment_turned_in"
+              :label="$t('export.create_secret_gist')"
+              @click.native="
+                createEnvironmentGist
+                $refs.options.tippy().hide()
+              "
+            />
+          </span>
         </tippy>
       </span>
     </template>
@@ -143,7 +146,7 @@ export default defineComponent({
         })
         .catch((e) => {
           this.$toast.error(this.$t("error.something_went_wrong"), {
-            icon: "error",
+            icon: "error_outline",
           })
           console.error(e)
         })
@@ -227,7 +230,7 @@ export default defineComponent({
       document.body.appendChild(a)
       a.click()
       this.$toast.success(this.$t("state.download_started"), {
-        icon: "done",
+        icon: "downloading",
       })
       setTimeout(() => {
         document.body.removeChild(a)
@@ -235,7 +238,7 @@ export default defineComponent({
       }, 1000)
     },
     fileImported() {
-      this.$toast.info(this.$t("state.file_imported"), {
+      this.$toast.success(this.$t("state.file_imported"), {
         icon: "folder_shared",
       })
     },