Merge pull request #9560 from adobe/larz/v1-ui-audit

redmunds · redmunds · commit 01ca26c839d3 · 2014-10-17T15:58:55.000-07:00
Brackets V1 UI Polish
diff --git a/src/extensions/default/RecentProjects/styles/styles.less b/src/extensions/default/RecentProjects/styles/styles.less
@@ -47,7 +47,7 @@
 #project-dropdown-toggle {
     display: inline-block;
     /* adjust margins to keep position #project-title position stable after extension is loaded */
-    margin: -3px 0px -2px -6px;
+    margin: -3px 5px -2px -6px;
     overflow: hidden;
     padding: 0 5px;
     white-space: nowrap;
diff --git a/src/styles/brackets.less b/src/styles/brackets.less
@@ -323,19 +323,9 @@ a, img {
     position: relative;
 
     /* Placeholder shown when there is no editor open */
-    .not-editor {
-        height: 100%;
-        .vbox;
-        .box-pack(center);
-        .box-align(center);
-        background: @bc-menu-bg url('images/no_content_bg.svg') no-repeat center 45%;
-
-        .dark & {
-            background: @dark-bc-menu-bg url('images/no_content_bg_dark.svg') no-repeat center 45%;
-        }
-    }
 
     .view-pane {
+        opacity: 0.7; // quieten inactive pane
         display: block;
         margin: 0;
         overflow: hidden;
@@ -491,19 +481,19 @@ a, img {
         box-sizing: border-box;
         border-bottom:  1px solid rgba(0, 0, 0, 0.05);
         padding: 5px 10px;
-        color: @bc-text-thin-quiet;
         background-color: @background;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
         
         .dark & {
-            color: @dark-bc-text-quiet;
             background-color: #1d1f21; // not using a variable on purpose.
             border-bottom-color: rgba(255, 255, 255, 0.05);
         }
     }
     .active-pane {
+        opacity: 1;
+        
         .pane-header {
             color: @bc-menu-text;
 
@@ -514,6 +504,19 @@ a, img {
     }
 }
 
+// moved this out of #editor-holder because we need to lower the specificity so theme authors can override the background color
+.not-editor {
+    height: 100%;
+    .vbox;
+    .box-pack(center);
+    .box-align(center);
+    background: #f8f8f8 url('images/no_content_bg.svg') no-repeat center 45%;
+
+    .dark & {
+        background: #1d1f21 url('images/no_content_bg_dark.svg') no-repeat center 45%;
+    }
+}
+
 // Split View Separator Styles
 .split-vertical #second-pane {
     border-left: 1px solid rgba(0, 0, 0, 0.17);
@@ -716,6 +719,12 @@ a, img {
     text-shadow: none;
     overflow: hidden;
     
+    > span {
+        background: @bc-sidebar-bg;
+        position: relative;
+        z-index: 9;
+    }
+    
     > div {
         background-color: @dark-bc-sidebar-bg;
         opacity: 1;
@@ -791,6 +800,14 @@ a, img {
     font-size: 13px;
     color: @project-panel-text-2;
     overflow: hidden;
+    
+    .btn-alt-quiet {
+        background-color: #47484b;
+        
+        // relative positioning plus z-index make sure that the splitview button flows under the left aligned buttons in the project pane when there are no working set files
+        position: relative;
+        z-index: 9; 
+    }
 }
 
 .open-files-container {
diff --git a/src/styles/brackets_patterns_override.less b/src/styles/brackets_patterns_override.less
@@ -43,7 +43,12 @@ a {
 }
 
 a:hover {
+    color: @bc-text-link;
     text-decoration: underline;
+    
+    .dark & {
+        color: @dark-bc-text-link;
+    }
 }
 
 a:focus {
@@ -281,6 +286,10 @@ a:focus {
     -webkit-transform-origin: 0 0;
     border: none;
     border-radius: @bc-border-radius;
+
+    .dark & {
+        border: 1px solid rgba(255, 255, 255, 0.09) !important;
+    }
 }
 
 @-webkit-keyframes dropdown {
diff --git a/src/styles/images/no_content_bg.svg b/src/styles/images/no_content_bg.svg
@@ -1,4 +1,3 @@
 <svg version="1.1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" width="116" height="55" viewBox="0 0 116 55">
-    <path fill="#FFF" d="M28.7,21.2h5.9v13.5h-5.9v5.9h11.8V15.3H28.7V21.2zM13.5,40.7h11.8v-5.9h-5.9V21.2h5.9v-5.9H13.5V40.7zM45,1H9c-5,0-9,4-9,9v36c0,5,4,9,9,9h36c4.9,0,9-4,9-9V10C54,5,49.9,1,45,1zM47.2,43.8c0,2.5-2,4.5-4.5,4.5H11.2c-2.5,0-4.5-2-4.5-4.5V12.2c0-2.5,2-4.5,4.5-4.5h31.5c2.5,0,4.5,2,4.5,4.5V43.8zM83.2,18.1c3.8,0,6.5-2.7,6.5-7.2c0-4.5-2.7-7.1-6.5-7.1s-6.5,2.6-6.5,7.1C76.7,15.4,79.4,18.1,83.2,18.1zM83.2,6.8c1.6,0,2.8,1.6,2.8,4c0,2.5-1.1,4.1-2.8,4.1c-1.6,0-2.8-1.6-2.8-4.1S81.6,6.8,83.2,6.8zM68.2,35.8h3.6V25h3.7v-3H64.5v3h3.7V35.8zM71.9,18.1c1.5,0,3-0.5,4.1-1.6L74.4,14c-0.6,0.5-1.3,1-2.2,1c-2.4,0-3.5-1.4-3.5-4.1c0-2.5,1.3-4,3.2-4c0.9,0,1.7,0.3,2.4,0.8l1.5-2.5c-1.1-0.9-2.4-1.4-3.9-1.4C68,3.7,65,6.4,65,10.9C65,15.7,67.9,18.1,71.9,18.1zM102.9,46.5L102.9,46.5c1.4-0.6,2.1-1.8,2.1-3c0-2.7-2.3-3.6-5.2-3.6h-5v13.9h5.5c2.9,0,5.4-1.2,5.4-4C105.6,48.1,104.7,47,102.9,46.5zM98.4,42.8h1.2c1.3,0,1.9,0.5,1.9,1.3c0,0.8-0.5,1.4-1.9,1.4v0h-1.2V42.8zM100,51.1L100,51.1l-1.6,0V48h1.6c1.4,0,2.1,0.5,2.1,1.5S101.4,51.1,100,51.1zM76.8,46.2l-0.5,4.3h-0.1l-0.8-4.3L74.2,40h-3l-1.3,6.2l-0.8,4.3h-0.1l-0.5-4.3L67.9,40h-3.7l2.4,13.9h4.5l1.1-5.6l0.4-3h0.1l0.4,3l1.1,5.6h4.6L81,40h-3.4L76.8,46.2zM101.5,32.8H96v-2.6h4.6v-3H96V25h5.4v-3h-9v13.9h9.2V32.8zM109.7,14.8v-2.6h4.6v-3h-4.6V7h5.4V4h-9v13.9h9.2v-3H109.7zM103.5,10.9c0-4.8-2.9-6.9-7-6.9h-4.2v13.9h4.5C100.7,17.8,103.5,15.7,103.5,10.9zM95.9,14.9V6.9h0.4c2,0,3.5,0.8,3.5,4c0,3.2-1.6,4.1-3.5,4.1H95.9zM86.5,48.3h4.6v-3h-4.6V43h5.4v-3h-9v13.9h9.2v-3h-5.6V48.3zM85.5,35.8h3.6V22h-3.6v5.2h-4.4V22h-3.6v13.9h3.6v-5.5h4.4V35.8z"/>
     <path fill="#D9D9D9" d="M28.7,20.2h5.9v13.5h-5.9v5.9h11.8V14.3H28.7V20.2zM45,0H9C4,0,0,4,0,9v36c0,5,4,9,9,9h36c4.9,0,9-4,9-9V9C54,4,49.9,0,45,0zM47.2,42.8c0,2.5-2,4.5-4.5,4.5H11.2c-2.5,0-4.5-2-4.5-4.5V11.2c0-2.5,2-4.5,4.5-4.5h31.5c2.5,0,4.5,2,4.5,4.5V42.8zM13.5,39.7h11.8v-5.9h-5.9V20.2h5.9v-5.9H13.5V39.7zM71.9,17.1c1.5,0,3-0.5,4.1-1.6L74.4,13c-0.6,0.5-1.3,1-2.2,1c-2.4,0-3.5-1.4-3.5-4.1c0-2.5,1.3-4,3.2-4c0.9,0,1.7,0.3,2.4,0.8l1.5-2.5c-1.1-0.9-2.4-1.4-3.9-1.4C68,2.7,65,5.4,65,9.9C65,14.7,67.9,17.1,71.9,17.1zM83.2,17.1c3.8,0,6.5-2.7,6.5-7.2c0-4.5-2.7-7.1-6.5-7.1s-6.5,2.6-6.5,7.1C76.7,14.4,79.4,17.1,83.2,17.1zM83.2,5.8c1.6,0,2.8,1.6,2.8,4c0,2.5-1.1,4.1-2.8,4.1c-1.6,0-2.8-1.6-2.8-4.1S81.6,5.8,83.2,5.8zM68.2,34.8h3.6V24h3.7v-3H64.5v3h3.7V34.8zM101.5,31.8H96v-2.6h4.6v-3H96V24h5.4v-3h-9v13.9h9.2V31.8zM102.9,45.5L102.9,45.5c1.4-0.6,2.1-1.8,2.1-3c0-2.7-2.3-3.6-5.2-3.6h-5v13.9h5.5c2.9,0,5.4-1.2,5.4-4C105.6,47.1,104.7,46,102.9,45.5zM98.4,41.8h1.2c1.3,0,1.9,0.5,1.9,1.3c0,0.8-0.5,1.4-1.9,1.4v0h-1.2V41.8zM100,50.1L100,50.1l-1.6,0V47h1.6c1.4,0,2.1,0.5,2.1,1.5S101.4,50.1,100,50.1zM109.7,13.8v-2.6h4.6v-3h-4.6V6h5.4V3h-9v13.9h9.2v-3H109.7zM76.8,45.2l-0.5,4.3h-0.1l-0.8-4.3L74.2,39h-3l-1.3,6.2l-0.8,4.3h-0.1l-0.5-4.3L67.9,39h-3.7l2.4,13.9h4.5l1.1-5.6l0.4-3h0.1l0.4,3l1.1,5.6h4.6L81,39h-3.4L76.8,45.2zM85.5,34.8h3.6V21h-3.6v5.2h-4.4V21h-3.6v13.9h3.6v-5.5h4.4V34.8zM86.5,47.3h4.6v-3h-4.6V42h5.4v-3h-9v13.9h9.2v-3h-5.6V47.3zM103.5,9.9c0-4.8-2.9-6.9-7-6.9h-4.2v13.9h4.5C100.7,16.8,103.5,14.7,103.5,9.9zM95.9,13.9V5.9h0.4c2,0,3.5,0.8,3.5,4c0,3.2-1.6,4.1-3.5,4.1H95.9z"/>
 </svg>
diff --git a/src/styles/images/no_content_bg_dark.svg b/src/styles/images/no_content_bg_dark.svg
@@ -1,4 +1,3 @@
 <svg version="1.1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" width="116" height="55" viewBox="0 0 116 55">
-    <path fill="#000" d="M28.7,21.2h5.9v13.5h-5.9v5.9h11.8V15.3H28.7V21.2zM13.5,40.7h11.8v-5.9h-5.9V21.2h5.9v-5.9H13.5V40.7zM45,1H9c-5,0-9,4-9,9v36c0,5,4,9,9,9h36c4.9,0,9-4,9-9V10C54,5,49.9,1,45,1zM47.2,43.8c0,2.5-2,4.5-4.5,4.5H11.2c-2.5,0-4.5-2-4.5-4.5V12.2c0-2.5,2-4.5,4.5-4.5h31.5c2.5,0,4.5,2,4.5,4.5V43.8zM83.2,18.1c3.8,0,6.5-2.7,6.5-7.2c0-4.5-2.7-7.1-6.5-7.1s-6.5,2.6-6.5,7.1C76.7,15.4,79.4,18.1,83.2,18.1zM83.2,6.8c1.6,0,2.8,1.6,2.8,4c0,2.5-1.1,4.1-2.8,4.1c-1.6,0-2.8-1.6-2.8-4.1S81.6,6.8,83.2,6.8zM68.2,35.8h3.6V25h3.7v-3H64.5v3h3.7V35.8zM71.9,18.1c1.5,0,3-0.5,4.1-1.6L74.4,14c-0.6,0.5-1.3,1-2.2,1c-2.4,0-3.5-1.4-3.5-4.1c0-2.5,1.3-4,3.2-4c0.9,0,1.7,0.3,2.4,0.8l1.5-2.5c-1.1-0.9-2.4-1.4-3.9-1.4C68,3.7,65,6.4,65,10.9C65,15.7,67.9,18.1,71.9,18.1zM102.9,46.5L102.9,46.5c1.4-0.6,2.1-1.8,2.1-3c0-2.7-2.3-3.6-5.2-3.6h-5v13.9h5.5c2.9,0,5.4-1.2,5.4-4C105.6,48.1,104.7,47,102.9,46.5zM98.4,42.8h1.2c1.3,0,1.9,0.5,1.9,1.3c0,0.8-0.5,1.4-1.9,1.4v0h-1.2V42.8zM100,51.1L100,51.1l-1.6,0V48h1.6c1.4,0,2.1,0.5,2.1,1.5S101.4,51.1,100,51.1zM76.8,46.2l-0.5,4.3h-0.1l-0.8-4.3L74.2,40h-3l-1.3,6.2l-0.8,4.3h-0.1l-0.5-4.3L67.9,40h-3.7l2.4,13.9h4.5l1.1-5.6l0.4-3h0.1l0.4,3l1.1,5.6h4.6L81,40h-3.4L76.8,46.2zM101.5,32.8H96v-2.6h4.6v-3H96V25h5.4v-3h-9v13.9h9.2V32.8zM109.7,14.8v-2.6h4.6v-3h-4.6V7h5.4V4h-9v13.9h9.2v-3H109.7zM103.5,10.9c0-4.8-2.9-6.9-7-6.9h-4.2v13.9h4.5C100.7,17.8,103.5,15.7,103.5,10.9zM95.9,14.9V6.9h0.4c2,0,3.5,0.8,3.5,4c0,3.2-1.6,4.1-3.5,4.1H95.9zM86.5,48.3h4.6v-3h-4.6V43h5.4v-3h-9v13.9h9.2v-3h-5.6V48.3zM85.5,35.8h3.6V22h-3.6v5.2h-4.4V22h-3.6v13.9h3.6v-5.5h4.4V35.8z"/>
     <path fill="#2b2b2b" d="M28.7,20.2h5.9v13.5h-5.9v5.9h11.8V14.3H28.7V20.2zM45,0H9C4,0,0,4,0,9v36c0,5,4,9,9,9h36c4.9,0,9-4,9-9V9C54,4,49.9,0,45,0zM47.2,42.8c0,2.5-2,4.5-4.5,4.5H11.2c-2.5,0-4.5-2-4.5-4.5V11.2c0-2.5,2-4.5,4.5-4.5h31.5c2.5,0,4.5,2,4.5,4.5V42.8zM13.5,39.7h11.8v-5.9h-5.9V20.2h5.9v-5.9H13.5V39.7zM71.9,17.1c1.5,0,3-0.5,4.1-1.6L74.4,13c-0.6,0.5-1.3,1-2.2,1c-2.4,0-3.5-1.4-3.5-4.1c0-2.5,1.3-4,3.2-4c0.9,0,1.7,0.3,2.4,0.8l1.5-2.5c-1.1-0.9-2.4-1.4-3.9-1.4C68,2.7,65,5.4,65,9.9C65,14.7,67.9,17.1,71.9,17.1zM83.2,17.1c3.8,0,6.5-2.7,6.5-7.2c0-4.5-2.7-7.1-6.5-7.1s-6.5,2.6-6.5,7.1C76.7,14.4,79.4,17.1,83.2,17.1zM83.2,5.8c1.6,0,2.8,1.6,2.8,4c0,2.5-1.1,4.1-2.8,4.1c-1.6,0-2.8-1.6-2.8-4.1S81.6,5.8,83.2,5.8zM68.2,34.8h3.6V24h3.7v-3H64.5v3h3.7V34.8zM101.5,31.8H96v-2.6h4.6v-3H96V24h5.4v-3h-9v13.9h9.2V31.8zM102.9,45.5L102.9,45.5c1.4-0.6,2.1-1.8,2.1-3c0-2.7-2.3-3.6-5.2-3.6h-5v13.9h5.5c2.9,0,5.4-1.2,5.4-4C105.6,47.1,104.7,46,102.9,45.5zM98.4,41.8h1.2c1.3,0,1.9,0.5,1.9,1.3c0,0.8-0.5,1.4-1.9,1.4v0h-1.2V41.8zM100,50.1L100,50.1l-1.6,0V47h1.6c1.4,0,2.1,0.5,2.1,1.5S101.4,50.1,100,50.1zM109.7,13.8v-2.6h4.6v-3h-4.6V6h5.4V3h-9v13.9h9.2v-3H109.7zM76.8,45.2l-0.5,4.3h-0.1l-0.8-4.3L74.2,39h-3l-1.3,6.2l-0.8,4.3h-0.1l-0.5-4.3L67.9,39h-3.7l2.4,13.9h4.5l1.1-5.6l0.4-3h0.1l0.4,3l1.1,5.6h4.6L81,39h-3.4L76.8,45.2zM85.5,34.8h3.6V21h-3.6v5.2h-4.4V21h-3.6v13.9h3.6v-5.5h4.4V34.8zM86.5,47.3h4.6v-3h-4.6V42h5.4v-3h-9v13.9h9.2v-3h-5.6V47.3zM103.5,9.9c0-4.8-2.9-6.9-7-6.9h-4.2v13.9h4.5C100.7,16.8,103.5,14.7,103.5,9.9zM95.9,13.9V5.9h0.4c2,0,3.5,0.8,3.5,4c0,3.2-1.6,4.1-3.5,4.1H95.9z"/>
 </svg>
diff --git a/src/styles/jsTreeTheme.less b/src/styles/jsTreeTheme.less
@@ -73,7 +73,8 @@ li.jstree-closed > ul { display:none; }
 
 .jstree-brackets li {
     vertical-align: baseline;
-    a {
+    a,
+    a:hover {
         color: @project-panel-text-1;
         font-size: 13px;
         cursor: default;
