tweaks to logo

main.js

@@ -24,6 +24,7 @@ function createMainWindow() {
     alwaysOnTop: true,
     resizable: false,
     skipTaskbar: false,
+    icon: path.join(__dirname, 'assets/icon.ico'),
     webPreferences: {
       nodeIntegration: false,
       contextIsolation: true,

src/renderer/index.html

@@ -16,7 +16,10 @@
         <div class="widget-container" id="widgetContainer">
             <!-- Title Bar -->
             <div class="title-bar" id="titleBar">
-                <div class="title">Claude Usage</div>
+                <div class="title">
+                    <img src="../../assets/logo.png" alt="Logo" class="app-logo">
+                    <span>Claude Usage</span>
+                </div>
                 <div class="controls">
                     <button class="control-btn settings-btn" id="settingsBtn" title="Settings">⚙️</button>
                     <button class="control-btn refresh-btn" id="refreshBtn" title="Refresh">

src/renderer/styles.css

@@ -36,6 +36,7 @@ body {
     -webkit-app-region: drag;
     background: rgba(0, 0, 0, 0.3);
     padding: 8px 12px;
+    padding-left: 6px;
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -49,6 +50,16 @@ body {
     font-size: 14px;
     font-weight: 400;
     letter-spacing: 0.5px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+.app-logo {
+    width: 19px;
+    height: 19px;
+    border-radius: 6px;
+    opacity: 0.8;
 }
 
 .controls {
@@ -477,4 +488,4 @@ body {
 
 .timer-progress.danger {
     stroke: #ef4444;
-}
+}