settings

package.json

@@ -41,7 +41,6 @@
     "dayjs": "^1.10.4",
     "electron-log": "^4.3.2",
     "electron-store": "^7.0.2",
-    "hiq": "^4.1.4",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "spectre.css": "^0.5.9",

src/back/settings.ts

@@ -63,7 +63,7 @@ export default class Settings {
     if (this.win) return
     this.win = new BrowserWindow({
       width: 400,
-      height: 485,
+      height: 575,
       center: true,
       resizable: false,
       webPreferences: {
@@ -75,7 +75,7 @@ export default class Settings {
     const entry = join(__dirname, '../front/settings/index.html')
     Settings.win.loadFile(entry)
 
-    if (DEV) {
+    if (DEV && false) {
       Settings.win.setSize(800, 485)
       Settings.win.setResizable(true)
       Settings.win.webContents.openDevTools()

src/front/settings/About.tsx

@@ -1,21 +1,6 @@
 import React, { useCallback } from 'react'
-import { shell } from 'electron'
 
-const Link: React.FC<{ text: string; link: string }> = ({ text, link }) => {
+import Link from './ExternalLink'
-  const fn = useCallback(
-    (e: any) => {
-      e.preventDefault()
-      shell.openExternal(link)
-    },
-    [link]
-  )
-  return (
-    <a onClick={fn} href={link}>
-      {' '}
-      {text}{' '}
-    </a>
-  )
-}
 
 const About: React.FC = () => {
   return (

src/front/settings/ExternalLink.tsx

@@ -0,0 +1,20 @@
+import React, { useCallback } from 'react'
+import { shell } from 'electron'
+
+const ExternalLink: React.FC<{ text: string; link: string }> = ({ text, link }) => {
+  const fn = useCallback(
+    (e: any) => {
+      e.preventDefault()
+      shell.openExternal(link)
+    },
+    [link]
+  )
+  return (
+    <a onClick={fn} href={link}>
+      {' '}
+      {text}{' '}
+    </a>
+  )
+}
+
+export default ExternalLink

src/front/settings/Footer.tsx

@@ -1,10 +1,19 @@
 import React from 'react'
 import { version } from '../../../package.json'
 
+import Link from './ExternalLink'
+
 const Footer: React.FC = () => {
   return (
-    <div className="tc mt4 f6 o-40">
+    <div className="tc mt4 f6">
-      <span className="code">version: {version}</span>
+      <div className="flex justify-center items-center">
+        <Link link="https://github.com/cupcakearmy" text="Github" />
+        <div className="ph1"> - </div>
+        <Link link="https://nicco.io/support" text="Support" />
+      </div>
+      <div className="code o-20 mt1">
+        <small>version: {version}</small>
+      </div>
     </div>
   )
 }

src/front/settings/Settings.tsx

@@ -8,7 +8,7 @@ import Field from './Field'
 const Settings = () => {
   return (
     <div>
-      <h3 className="ma0 mb2">Settings</h3>
+      <h3 className="ma0 mv3">Settings</h3>
       <form>
         <fieldset className="ma0 pa0">
           <Field setting="every" />