refactor(UI): changed buttons icon position

src/renderer/components/WorkspaceAddConnectionPanel.vue

@@ -315,28 +315,22 @@
          </div>
          <div class="panel-footer">
             <button
-               class="btn btn-gray mr-2"
+               class="btn btn-gray mr-2 d-flex"
                :class="{'loading': isTesting}"
                :disabled="isBusy"
                @click="startTest"
             >
+               <i class="mdi mdi-24px mdi-lightning-bolt mr-1" />
                {{ $t('message.testConnection') }}
             </button>
             <button
-               class="btn btn-primary mr-2"
+               class="btn btn-primary mr-2 d-flex"
                :disabled="isBusy"
                @click="saveConnection"
             >
+               <i class="mdi mdi-24px mdi-content-save mr-1" />
                {{ $t('word.save') }}
             </button>
-            <!-- <button
-               class="btn btn-success"
-               :class="{'loading': isConnecting}"
-               :disabled="isBusy"
-               @click="startConnection"
-            >
-               {{ $t('word.connect') }}
-            </button> -->
          </div>
       </div>
       <ModalAskCredentials

src/renderer/components/WorkspaceEditConnectionPanel.vue

@@ -309,26 +309,29 @@
          </div>
          <div class="panel-footer">
             <button
-               class="btn btn-gray mr-2"
+               class="btn btn-gray mr-2 d-flex"
                :class="{'loading': isTesting}"
                :disabled="isBusy"
                @click="startTest"
             >
+               <i class="mdi mdi-24px mdi-lightning-bolt mr-1" />
                {{ $t('message.testConnection') }}
             </button>
             <button
-               class="btn btn-primary mr-2"
+               class="btn btn-primary mr-2 d-flex"
                :disabled="isBusy || !hasChanges"
                @click="saveConnection"
             >
+               <i class="mdi mdi-24px mdi-content-save mr-1" />
                {{ $t('word.save') }}
             </button>
             <button
-               class="btn btn-success"
+               class="btn btn-success d-flex"
                :class="{'loading': isConnecting}"
                :disabled="isBusy"
                @click="startConnection"
             >
+               <i class="mdi mdi-24px mdi-connection mr-1" />
                {{ $t('word.connect') }}
             </button>
          </div>

src/renderer/components/WorkspacePropsForeignModal.vue

@@ -19,8 +19,8 @@
                   <div class="panel-header pt-0 pl-0">
                      <div class="d-flex">
                         <button class="btn btn-dark btn-sm d-flex" @click="addForeign">
+                           <i class="mdi mdi-24px mdi-link-plus mr-1" />
                            <span>{{ $t('word.add') }}</span>
-                           <i class="mdi mdi-24px mdi-link-plus ml-1" />
                         </button>
                         <button
                            class="btn btn-dark btn-sm d-flex ml-2 mr-0"
@@ -28,8 +28,8 @@
                            :disabled="!isChanged"
                            @click.prevent="clearChanges"
                         >
+                           <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                            <span>{{ $t('word.clear') }}</span>
-                           <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                         </button>
                      </div>
                   </div>

src/renderer/components/WorkspacePropsFunctionParamsModal.vue

@@ -19,8 +19,8 @@
                   <div class="panel-header pt-0 pl-0">
                      <div class="d-flex">
                         <button class="btn btn-dark btn-sm d-flex" @click="addParameter">
+                           <i class="mdi mdi-24px mdi-plus mr-1" />
                            <span>{{ $t('word.add') }}</span>
-                           <i class="mdi mdi-24px mdi-plus ml-1" />
                         </button>
                         <button
                            class="btn btn-dark btn-sm d-flex ml-2 mr-0"
@@ -28,8 +28,8 @@
                            :disabled="!isChanged"
                            @click.prevent="clearChanges"
                         >
+                           <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                            <span>{{ $t('word.clear') }}</span>
-                           <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                         </button>
                      </div>
                   </div>

src/renderer/components/WorkspacePropsIndexesModal.vue

@@ -19,8 +19,8 @@
                   <div class="panel-header pt-0 pl-0">
                      <div class="d-flex">
                         <button class="btn btn-dark btn-sm d-flex" @click="addIndex">
+                           <i class="mdi mdi-24px mdi-key-plus mr-1" />
                            <span>{{ $t('word.add') }}</span>
-                           <i class="mdi mdi-24px mdi-key-plus ml-1" />
                         </button>
                         <button
                            class="btn btn-dark btn-sm d-flex ml-2 mr-0"
@@ -28,8 +28,8 @@
                            :disabled="!isChanged"
                            @click.prevent="clearChanges"
                         >
+                           <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                            <span>{{ $t('word.clear') }}</span>
-                           <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                         </button>
                      </div>
                   </div>

src/renderer/components/WorkspacePropsRoutineParamsModal.vue

@@ -19,8 +19,8 @@
                   <div class="panel-header pt-0 pl-0">
                      <div class="d-flex">
                         <button class="btn btn-dark btn-sm d-flex" @click="addParameter">
+                           <i class="mdi mdi-24px mdi-plus mr-1" />
                            <span>{{ $t('word.add') }}</span>
-                           <i class="mdi mdi-24px mdi-plus ml-1" />
                         </button>
                         <button
                            class="btn btn-dark btn-sm d-flex ml-2 mr-0"
@@ -28,8 +28,8 @@
                            :disabled="!isChanged"
                            @click.prevent="clearChanges"
                         >
+                           <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                            <span>{{ $t('word.clear') }}</span>
-                           <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                         </button>
                      </div>
                   </div>

src/renderer/components/WorkspacePropsTab.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,8 +19,8 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
 
                <div class="divider-vert py-3" />
@@ -30,24 +30,24 @@
                   :title="$t('message.addNewField')"
                   @click="addField"
                >
+                  <i class="mdi mdi-24px mdi-playlist-plus mr-1" />
                   <span>{{ $t('word.add') }}</span>
-                  <i class="mdi mdi-24px mdi-playlist-plus ml-1" />
                </button>
                <button
                   class="btn btn-dark btn-sm"
                   :title="$t('message.manageIndexes')"
                   @click="showIntdexesModal"
                >
+                  <i class="mdi mdi-24px mdi-key mdi-rotate-45 mr-1" />
                   <span>{{ $t('word.indexes') }}</span>
-                  <i class="mdi mdi-24px mdi-key mdi-rotate-45 ml-1" />
                </button>
                <button class="btn btn-dark btn-sm" @click="showForeignModal">
+                  <i class="mdi mdi-24px mdi-key-link mr-1" />
                   <span>{{ $t('word.foreignKeys') }}</span>
-                  <i class="mdi mdi-24px mdi-key-link ml-1" />
                </button>
                <button class="btn btn-dark btn-sm" @click="showOptionsModal">
+                  <i class="mdi mdi-24px mdi-cogs mr-1" />
                   <span>{{ $t('word.options') }}</span>
-                  <i class="mdi mdi-24px mdi-cogs ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspacePropsTabFunction.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,8 +19,8 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
 
                <div class="divider-vert py-3" />
@@ -30,16 +30,16 @@
                   :disabled="isChanged"
                   @click="runFunctionCheck"
                >
+                  <i class="mdi mdi-24px mdi-play mr-1" />
                   <span>{{ $t('word.run') }}</span>
-                  <i class="mdi mdi-24px mdi-play ml-1" />
                </button>
                <button class="btn btn-dark btn-sm" @click="showParamsModal">
+                  <i class="mdi mdi-24px mdi-dots-horizontal mr-1" />
                   <span>{{ $t('word.parameters') }}</span>
-                  <i class="mdi mdi-24px mdi-dots-horizontal ml-1" />
                </button>
                <button class="btn btn-dark btn-sm" @click="showOptionsModal">
+                  <i class="mdi mdi-24px mdi-cogs mr-1" />
                   <span>{{ $t('word.options') }}</span>
-                  <i class="mdi mdi-24px mdi-cogs ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspacePropsTabRoutine.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,8 +19,8 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
 
                <div class="divider-vert py-3" />
@@ -30,16 +30,16 @@
                   :disabled="isChanged"
                   @click="runRoutineCheck"
                >
+                  <i class="mdi mdi-24px mdi-play mr-1" />
                   <span>{{ $t('word.run') }}</span>
-                  <i class="mdi mdi-24px mdi-play ml-1" />
                </button>
                <button class="btn btn-dark btn-sm" @click="showParamsModal">
+                  <i class="mdi mdi-24px mdi-dots-horizontal mr-1" />
                   <span>{{ $t('word.parameters') }}</span>
-                  <i class="mdi mdi-24px mdi-dots-horizontal ml-1" />
                </button>
                <button class="btn btn-dark btn-sm" @click="showOptionsModal">
+                  <i class="mdi mdi-24px mdi-cogs mr-1" />
                   <span>{{ $t('word.options') }}</span>
-                  <i class="mdi mdi-24px mdi-cogs ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspacePropsTabScheduler.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,14 +19,14 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
 
                <div class="divider-vert py-3" />
                <button class="btn btn-dark btn-sm" @click="showTimingModal">
+                  <i class="mdi mdi-24px mdi-timer mr-1" />
                   <span>{{ $t('word.timing') }}</span>
-                  <i class="mdi mdi-24px mdi-timer ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspacePropsTabTrigger.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,8 +19,8 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspacePropsTabTriggerFunction.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,15 +19,15 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
 
                <div class="divider-vert py-3" />
 
                <button class="btn btn-dark btn-sm" @click="showOptionsModal">
+                  <i class="mdi mdi-24px mdi-cogs mr-1" />
                   <span>{{ $t('word.options') }}</span>
-                  <i class="mdi mdi-24px mdi-cogs ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspacePropsTabView.vue

@@ -10,8 +10,8 @@
                   title="CTRL+S"
                   @click="saveChanges"
                >
+                  <i class="mdi mdi-24px mdi-content-save mr-1" />
                   <span>{{ $t('word.save') }}</span>
-                  <i class="mdi mdi-24px mdi-content-save ml-1" />
                </button>
                <button
                   :disabled="!isChanged"
@@ -19,8 +19,8 @@
                   :title="$t('message.clearChanges')"
                   @click="clearChanges"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep mr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
                </button>
             </div>
          </div>

src/renderer/components/WorkspaceQueryTab.vue

@@ -28,8 +28,8 @@
                   title="F5"
                   @click="runQuery(query)"
                >
+                  <i class="mdi mdi-24px mdi-play pr-1" />
                   <span>{{ $t('word.run') }}</span>
-                  <i class="mdi mdi-24px mdi-play" />
                </button>
                <button
                   class="btn btn-dark btn-sm"
@@ -37,8 +37,8 @@
                   title="CTRL+F8"
                   @click="beautify()"
                >
+                  <i class="mdi mdi-24px mdi-brush pr-1" />
                   <span>{{ $t('word.format') }}</span>
-                  <i class="mdi mdi-24px mdi-brush pl-1" />
                </button>
                <button
                   class="btn btn-link btn-sm"
@@ -46,8 +46,8 @@
                   title="CTRL+W"
                   @click="clear()"
                >
+                  <i class="mdi mdi-24px mdi-delete-sweep pr-1" />
                   <span>{{ $t('word.clear') }}</span>
-                  <i class="mdi mdi-24px mdi-delete-sweep pl-1" />
                </button>
 
                <div class="divider-vert py-3" />
@@ -58,8 +58,8 @@
                      class="btn btn-dark btn-sm dropdown-toggle mr-0 pr-0"
                      tabindex="0"
                   >
+                     <i class="mdi mdi-24px mdi-file-export mr-1" />
                      <span>{{ $t('word.export') }}</span>
-                     <i class="mdi mdi-24px mdi-file-export ml-1" />
                      <i class="mdi mdi-24px mdi-menu-down" />
                   </button>
                   <ul class="menu text-left">

src/renderer/components/WorkspaceTableTab.vue

@@ -11,9 +11,9 @@
                         title="F5"
                         @click="reloadTable"
                      >
+                        <i v-if="!+autorefreshTimer" class="mdi mdi-24px mdi-refresh mr-1" />
+                        <i v-else class="mdi mdi-24px mdi-history mdi-flip-h mr-1" />
                         <span>{{ $t('word.refresh') }}</span>
-                        <i v-if="!+autorefreshTimer" class="mdi mdi-24px mdi-refresh ml-1" />
-                        <i v-else class="mdi mdi-24px mdi-history mdi-flip-h ml-1" />
                      </button>
                      <div class="btn btn-dark btn-sm dropdown-toggle pl-0 pr-0" tabindex="0">
                         <i class="mdi mdi-24px mdi-menu-down" />
@@ -77,8 +77,8 @@
                   :disabled="isQuering"
                   @click="showFakerModal"
                >
+                  <i class="mdi mdi-24px mdi-playlist-plus mr-1" />
                   <span>{{ $t('message.tableFiller') }}</span>
-                  <i class="mdi mdi-24px mdi-playlist-plus ml-1" />
                </button>
 
                <div class="dropdown table-dropdown pr-2">
@@ -87,8 +87,8 @@
                      class="btn btn-dark btn-sm dropdown-toggle mr-0 pr-0"
                      tabindex="0"
                   >
+                     <i class="mdi mdi-24px mdi-file-export mr-1" />
                      <span>{{ $t('word.export') }}</span>
-                     <i class="mdi mdi-24px mdi-file-export ml-1" />
                      <i class="mdi mdi-24px mdi-menu-down" />
                   </button>
                   <ul class="menu text-left">