perf(UI): increased application border-radius

src/main/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-import { app, BrowserWindow, nativeImage } from 'electron';
+import { app, BrowserWindow, /* session, */ nativeImage } from 'electron';
 import * as path from 'path';
 import Store from 'electron-store';
 
@@ -38,13 +38,15 @@ async function createMainWindow () {
    });
 
    try {
-      if (isDevelopment) {
+      if (isDevelopment) { //
          await window.loadURL(`http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT}`);
 
-         const { default: installExtension, VUEJS_DEVTOOLS } = require('electron-devtools-installer');
+         // const { default: installExtension, VUEJS3_DEVTOOLS } = require('electron-devtools-installer');
 
-         const toolName = await installExtension(VUEJS_DEVTOOLS);
+         // const oldDevToolsID = session.defaultSession.getAllExtensions().find(ext => ext.name === 'Vue.js devtools').id;
-         console.log(toolName, 'installed');
+         // session.defaultSession.removeExtension(oldDevToolsID);
+         // const toolName = await installExtension(VUEJS3_DEVTOOLS);
+         // console.log(toolName, 'installed');
       }
       else
          await window.loadURL(new URL(`file:///${path.join(__dirname, 'index.html')}`).href);

src/renderer/components/BaseUploadInput.vue

@@ -63,7 +63,7 @@ export default {
 
 <style lang="scss" scoped>
 .file-uploader {
-  border-radius: 0.1rem;
+  border-radius: $border-radius;
   height: 1.8rem;
   line-height: 1.2rem;
   display: flex;

src/renderer/components/TheSettingBar.vue

@@ -174,6 +174,7 @@ export default {
         align-content: center;
         justify-content: center;
         flex-direction: column;
+        border-radius: 0;
 
         &:hover {
           opacity: 1;
@@ -211,7 +212,7 @@ export default {
       padding: 0.2rem 0.4rem;
       font-size: 0.7rem;
       background: rgba(48, 55, 66, 0.95);
-      border-radius: 0.1rem;
+      border-radius: $border-radius;
       color: #fff;
       max-width: 320px;
       pointer-events: none;

src/renderer/components/Workspace.vue

@@ -362,7 +362,7 @@ export default {
             min-width: 100%;
 
             .menu-item a {
-              border-radius: 0.1rem;
+              border-radius: $border-radius;
               color: inherit;
               display: block;
               margin: 0 -0.4rem;

src/renderer/components/WorkspaceExploreBarSchema.vue

@@ -311,7 +311,7 @@ export default {
   .database-name,
   .misc-name {
     &:hover {
-      border-radius: 2px;
+      border-radius: $border-radius;
     }
   }
 
@@ -320,7 +320,7 @@ export default {
     position: relative;
 
     &:hover {
-      border-radius: 2px;
+      border-radius: $border-radius;
     }
   }
 

src/renderer/components/WorkspacePropsForeignModal.vue

@@ -362,7 +362,7 @@ export default {
 
 <style lang="scss" scoped>
 .tile {
-  border-radius: 2px;
+  border-radius: $border-radius;
   opacity: 0.5;
   transition: background 0.2s;
   transition: opacity 0.2s;

src/renderer/components/WorkspacePropsFunctionParamsModal.vue

@@ -274,7 +274,7 @@ export default {
 
 <style lang="scss" scoped>
 .tile {
-  border-radius: 2px;
+  border-radius: $border-radius;
   opacity: 0.5;
   transition: background 0.2s;
   transition: opacity 0.2s;

src/renderer/components/WorkspacePropsIndexesModal.vue

@@ -247,7 +247,7 @@ export default {
 
 <style lang="scss" scoped>
 .tile {
-  border-radius: 2px;
+  border-radius: $border-radius;
   opacity: 0.5;
   transition: background 0.2s;
   transition: opacity 0.2s;

src/renderer/components/WorkspacePropsRoutineParamsModal.vue

@@ -274,7 +274,7 @@ export default {
 
 <style lang="scss" scoped>
 .tile {
-  border-radius: 2px;
+  border-radius: $border-radius;
   opacity: 0.5;
   transition: background 0.2s;
   transition: opacity 0.2s;

src/renderer/components/WorkspaceTableTab.vue

@@ -42,8 +42,8 @@
                      <i class="mdi mdi-24px mdi-skip-previous" />
                   </button>
                   <div class="dropdown" :class="{'active': isPageMenu}">
-                     <div class="btn-group" @click="openPageMenu">
+                     <div @click="openPageMenu">
-                        <div class="btn btn-dark btn-sm mr-0 dropdown-toggle text-bold px-3">
+                        <div class="btn btn-dark btn-sm mr-0 no-radius dropdown-toggle text-bold px-3">
                            {{ page }}
                         </div>
                         <div class="menu px-3">

src/renderer/scss/_variables.scss

@@ -22,6 +22,7 @@ $enum-color: goldenrod;
 $unknown-color: gray;
 
 /* Sizes */
+$border-radius: 0.3rem;
 $titlebar-height: 1.5rem;
 $settingbar-width: 3rem;
 $explorebar-width: 14rem;

src/renderer/scss/main.scss

@@ -34,6 +34,10 @@ body {
   outline: none !important;
 }
 
+.no-radius {
+  border-radius: 0 !important;
+}
+
 .no-border {
   outline: none !important;
   border: none !important;
@@ -109,7 +113,7 @@ body {
   .modal-container,
   .modal-sm .modal-container {
     padding: 0;
-    border-radius: 3px;
+    border-radius: $border-radius;
 
     .modal-header {
       padding: 0.4rem 0.8rem;
@@ -117,7 +121,7 @@ body {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      border-radius: 3px 3px 0 0;
+      border-radius: $border-radius $border-radius 0 0;
 
       .modal-title {
         overflow: hidden;