fix: optimized for small screen users #48 #224

src/main/ui/WindowManager.js

@@ -1,6 +1,6 @@
 import { join } from 'path'
 import { EventEmitter } from 'events'
-import { app, shell, BrowserWindow } from 'electron'
+import { app, shell, screen, BrowserWindow } from 'electron'
 import is from 'electron-is'
 import pageConfig from '../configs/page'
 import logger from '../core/Logger'
@@ -38,6 +38,13 @@ export default class WindowManager extends EventEmitter {
       result.attrs.frame = false
     }
 
+    // Optimized for small screen users
+    const { width, height } = screen.getPrimaryDisplay().workAreaSize
+    const widthScale = width >= 1280 ? 1 : 0.875
+    const heightScale = height >= 800 ? 1 : 0.875
+    result.attrs.width *= widthScale
+    result.attrs.height *= heightScale
+
     // fix AppImage Dock Icon Missing
     // https://github.com/AppImage/AppImageKit/wiki/Bundling-Electron-apps
     if (is.linux()) {

src/renderer/components/Preference/Index.vue

@@ -50,11 +50,11 @@
     }
   }
   .form-actions {
-    position: absolute;
+    position: fixed;
     bottom: 0;
-    left: 0;
-    width: 100%;
+    left: auto;
+    z-index: 10;
     box-sizing: border-box;
-    padding: 24px 36px;
+    padding: 24px 36px 24px 0;
   }
 </style>

src/renderer/components/Theme/Default.scss

@@ -191,7 +191,7 @@ img {
   }
   .panel-content {
     position: relative;
-    padding: 16px 36px 24px;
+    padding: 16px 36px 52px;
     height: 100%;
   }
 }