enhance window controls

src/main.cljs

@@ -8,6 +8,7 @@
    #_["electron-updater" :as updater]
    ["electron-window-state" :as window-state-keeper]
    ["electron" :refer [app shell ipcMain BrowserWindow clipboard nativeTheme]]
+   ["os" :as os]
    ["path" :as path]
    [config]
    [file]))
@@ -92,6 +93,8 @@
                   :width (.-width win-state)
                   :height (.-height win-state)
                   :backgroundColor "#313131"
+                  :titleBarStyle (when (= (.platform os) "darwin") "hidden")
+                  :trafficLightPosition #js { :x 8 :y 10 }
                   :icon (.join path js/__dirname "/public/img/icon.png")
                   :frame false
                   :show false

src/platform.cljs

@@ -7,3 +7,12 @@
 
 (defonce electron?
   (str/includes? user-agent "Electron"))
+
+(defonce mac?
+  (= js/window.api.platform "darwin"))
+
+(defonce windows?
+  (= js/window.api.platform "win32"))
+
+(defonce linux?
+  (= js/window.api.platform "linux"))

src/preload.cljs

@@ -6,6 +6,7 @@
    ["font-scanner" :as fontManager]
    ["mdn-data" :as mdn] ;; deprecating in favor of w3c/webref
    ["opentype.js" :as opentype]
+   ["os" :as os]
    [config]))
 
 (defn text->path
@@ -23,6 +24,7 @@
               (.on ipcRenderer channel (fn [_ args] (f args))))
    :mdn mdn
    :webrefCss css
+   :platform (.platform os)
    ;; https://github.com/axosoft/font-scanner#getavailablefonts
    :systemFonts (.getAvailableFontsSync fontManager)
    :findFonts (fn [descriptor] (.findFontsSync fontManager descriptor))

src/renderer/window/views.cljs

@@ -1,6 +1,6 @@
 (ns renderer.window.views
   (:require
-   [platform :as platform]
+   [platform]
    [re-frame.core :as rf]
    [renderer.components :as comp]
    [renderer.menubar.views :as menubar]))
@@ -38,19 +38,20 @@
         title (or @(rf/subscribe [:document/path])
                   @(rf/subscribe [:document/title]))]
     [:div.flex.items-center.relative
-     (when-not fullscreen?
+     (when-not (or fullscreen? platform/mac?)
        [app-icon])
      [:div.flex.relative.bg-secondary
+      {:class (when (and platform/mac? (not fullscreen?)) "ml-16")}
       [menubar/root]]
      [:div.title-bar (when title (str title " - ")) "Repath Studio"]
      [:div.flex.h-full.flex-1.drag]
      [:div.bg-primary
-      {:class (when-not (or platform/electron? fullscreen?) "mr-1.5")}
+      {:class (when-not (or (and platform/electron? (not platform/mac?)) fullscreen?) "mr-1.5")}
       [comp/icon-button
        (name @(rf/subscribe [:theme/mode]))
        {:on-click #(rf/dispatch [:theme/cycle-mode])
         :class "rounded-none"}]]
-     (when (and platform/electron? (not fullscreen?))
+     (when (and platform/electron? (not fullscreen?) (not platform/mac?))
        [window-controls])
      (when fullscreen?
        [window-control-button