diff --git a/webui/src/web-components/sketch-diff-range-picker.ts b/webui/src/web-components/sketch-diff-range-picker.ts
index 37508eb..c62078c 100644
--- a/webui/src/web-components/sketch-diff-range-picker.ts
+++ b/webui/src/web-components/sketch-diff-range-picker.ts
@@ -54,10 +54,6 @@
       display: flex;
       flex-direction: column;
       gap: 12px;
-      padding: 12px;
-      background-color: var(--background-light, #f8f8f8);
-      border-radius: 4px;
-      border: 1px solid var(--border-color, #e0e0e0);
       width: 100%;
       box-sizing: border-box;
     }
@@ -65,7 +61,6 @@
     .commits-header {
       display: flex;
       align-items: center;
-      justify-content: space-between;
       width: 100%;
     }
 
@@ -88,14 +83,6 @@
       background-color: var(--background-hover, #e8e8e8);
     }
 
-    .commits-summary {
-      font-size: 14px;
-      color: var(--text-secondary-color, #666);
-      font-family: monospace;
-    }
-
-
-
     .commit-selectors {
       display: flex;
       flex-direction: row;
@@ -207,9 +194,6 @@
         >
           ${this.commitsExpanded ? '▼' : '▶'} Commits
         </button>
-        <div class="commits-summary">
-          ${this.getCommitSummary()}
-        </div>
       </div>
       
       ${this.commitsExpanded
diff --git a/webui/src/web-components/sketch-diff2-view.ts b/webui/src/web-components/sketch-diff2-view.ts
index 72be0aa..f20dd57 100644
--- a/webui/src/web-components/sketch-diff2-view.ts
+++ b/webui/src/web-components/sketch-diff2-view.ts
@@ -212,6 +212,16 @@
       box-shadow: 0 0 0 2px var(--accent-color-light, rgba(0, 122, 204, 0.2));
     }
 
+    .file-selector:disabled {
+      background-color: var(--background-disabled, #f5f5f5);
+      color: var(--text-disabled, #999);
+      cursor: not-allowed;
+    }
+
+    .spacer {
+      flex: 1;
+    }
+
     sketch-diff-range-picker {
       flex: 1;
       min-width: 400px; /* Ensure minimum width for range picker */
@@ -550,11 +560,12 @@
       <div class="controls">
         <div class="controls-container">
           <div class="range-row">
+            ${this.renderFileSelector()}
+            <div class="spacer"></div>
             <sketch-diff-range-picker
               .gitService="${this.gitService}"
               @range-change="${this.handleRangeChange}"
             ></sketch-diff-range-picker>
-            ${this.renderFileSelector()}
           </div>
         </div>
       </div>
@@ -566,17 +577,16 @@
   }
 
   renderFileSelector() {
-    if (this.files.length === 0) {
-      return html``;
-    }
-
+    const fileCount = this.files.length;
+    
     return html`
       <select
         class="file-selector"
         .value="${this.selectedFile}"
         @change="${this.handleFileSelection}"
+        ?disabled="${fileCount === 0}"
       >
-        <option value="">All files (${this.files.length})</option>
+        <option value="">All files (${fileCount})</option>
         ${this.files.map(
           (file) => html`
             <option value="${file.path}">