Update index.html

DevEchoX2 · web-flow · commit e13a62cf708c · 2026-01-05T12:54:18.000-05:00
diff --git a/index.html b/index.html
@@ -67,7 +67,7 @@
             z-index: 5;
         }
 
-        /* Inverted Radius using mask-image */
+        /* Mask-Image swoop for inverted corners */
         .tab.active::before,
         .tab.active::after {
             content: "";
@@ -81,14 +81,14 @@
 
         .tab.active::before {
             left: -16px;
-            mask-image: radial-gradient(circle at 0 0, transparent 16px, black 16px);
             -webkit-mask-image: radial-gradient(circle at 0 0, transparent 16px, black 16px);
+            mask-image: radial-gradient(circle at 0 0, transparent 16px, black 16px);
         }
 
         .tab.active::after {
             right: -16px;
-            mask-image: radial-gradient(circle at 100% 0, transparent 16px, black 16px);
             -webkit-mask-image: radial-gradient(circle at 100% 0, transparent 16px, black 16px);
+            mask-image: radial-gradient(circle at 100% 0, transparent 16px, black 16px);
         }
 
         .tab-favicon {
@@ -121,7 +121,7 @@
         .tab:hover .tab-close, .tab.active .tab-close { opacity: 0.5; }
         .tab-close:hover { opacity: 1 !important; background: rgba(255,255,255,0.1); }
 
-        /* --- Nav Bar --- */
+        /* --- Navigation Bar --- */
         .nav-bar {
             background: var(--nav-bg);
             height: 44px;
@@ -154,7 +154,7 @@
 
         .address-box {
             position: relative;
-            width: 800px; /* Made the URL address bar longer */
+            width: 950px; /* LONGER URL BAR */
             margin: 0 auto;
         }
 
@@ -186,7 +186,6 @@
             color: #333;
         }
 
-        /* --- Viewport --- */
         .viewport {
             flex: 1;
             position: relative;
@@ -221,7 +220,6 @@
     </style>
 </head>
 <body>
-
     <div class="tab-strip">
         <div class="tabs-container" id="tabs-container"></div>
         <button id="add-tab">
@@ -326,7 +324,6 @@
                 setActiveTab(t.id);
                 return;
             }
-
             const idx = tabs.findIndex(t => t.id === id);
             tabs = tabs.filter(t => t.id !== id);
             document.getElementById(`iframe-${id}`).remove();
@@ -392,15 +389,12 @@
                     t.title = e.data.title || t.title;
                     if (e.data.url) t.url = e.data.url;
                     renderTabs();
-                    if (activeTabId === t.id) addressInput.value = getDisplayUrl(t.url);
                 }
             }
         });
 
-        // Init first tab
         addTab();
 
-        // Control handlers
         document.getElementById('back').onclick = () => document.getElementById(`iframe-${activeTabId}`).contentWindow.history.back();
         document.getElementById('forward').onclick = () => document.getElementById(`iframe-${activeTabId}`).contentWindow.history.forward();
         document.getElementById('reload').onclick = () => {
