Преглед изворни кода

HUE-6077 [frontend] Unify colors throughout

Johan Ahlen пре 8 година
родитељ
комит
5c876f8

+ 1 - 1
desktop/core/src/desktop/static/desktop/css/httperrors.css

@@ -14,4 +14,4 @@ distributed under the License is distributed on an "AS IS" BASIS,
 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
- */#httperror .error-code{margin:0;padding-bottom:30px;color:#CCC;text-align:center;font-weight:200;font-size:150px;line-height:150px}#httperror .error-box{padding:20px 35px 20px;margin-bottom:50px}
+ */#httperror .error-code{margin:0;padding-bottom:30px;color:#C8C8C8;text-align:center;font-weight:200;font-size:150px;line-height:150px}#httperror .error-box{padding:20px 35px 20px;margin-bottom:50px}

Разлика између датотеке није приказан због своје велике величине
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


Разлика између датотеке није приказан због своје велике величине
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


Разлика између датотеке није приказан због своје велике величине
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/login.css


+ 1 - 1
desktop/core/src/desktop/static/desktop/less/components/hue-clearable.less

@@ -18,7 +18,7 @@
 
 .clearable {
   background: url(/static/desktop/art/clearField.png) no-repeat right -10px center;
-  border: 1px solid #999;
+  border: 1px solid @cui-gray-600;
   padding: 3px 18px 3px 4px;
   border-radius: 3px;
 }

+ 3 - 3
desktop/core/src/desktop/static/desktop/less/components/hue-demi-modal.less

@@ -26,7 +26,7 @@
   padding: 0;
   background-color: @cui-white;
   min-height: 210px;
-  border: 1px solid #CCC;
+  border: 1px solid @cui-gray-400;
   -webkit-border-bottom-right-radius: 0px;
   -webkit-border-bottom-left-radius: 0px;
   -moz-border-radius-bottomright: 0px;
@@ -45,7 +45,7 @@
 
   & .modal-header {
     padding: 9px 15px;
-    border-bottom: 1px solid #eee;
+    border-bottom: 1px solid @cui-gray-100;
   }
 
   & .modal-header .close {
@@ -81,5 +81,5 @@
 }
 
 .demi-modal-chevron:hover {
-  background-color: #F6F6F6;
+  background-color: @cui-gray-050;
 }

+ 4 - 4
desktop/core/src/desktop/static/desktop/less/components/hue-filechooser.less

@@ -19,7 +19,7 @@
 .jHueFilechooserActions {
   margin-top: 14px;
   padding-top: 10px;
-  border-top: 1px dashed #EEEEEE;
+  border-top: 1px dashed @cui-gray-100;
 }
 
 .pathChooser, .pathChooserKo, .pathFolderChooserKo {
@@ -36,14 +36,14 @@
 }
 
 .filechooser-tree .editable-breadcrumbs:hover {
-  background-color: #F0F0F0;
+  background-color: @cui-gray-050;
 }
 
 .filechooser-tree .editable-breadcrumb-input {
   margin-left: 12px;
   margin-bottom: 0;
   border-radius: 2px;
-  border: 1px solid #EEE;
+  border: 1px solid @cui-gray-100;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   box-shadow: none;
@@ -56,5 +56,5 @@
 }
 
 .filechooser-tree .hueBreadcrumb > li:last-child > a {
-  color: #666;
+  color: @cui-gray-800;
 }

+ 2 - 2
desktop/core/src/desktop/static/desktop/less/components/hue-scroll-anchor.less

@@ -17,7 +17,7 @@
 */
 
 .hueAnchor {
-  color: #FFFFFF;
+  color: @cui-white;
   opacity: 0.65;
   filter: alpha(opacity=65);
   position: fixed;
@@ -25,7 +25,7 @@
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
-  background-color: #333333;
+  background-color: @cui-gray-800;
   padding: 10px;
   padding-left: 14px;
   padding-right: 14px;

+ 6 - 6
desktop/core/src/desktop/static/desktop/less/components/hue-selector.less

@@ -17,14 +17,14 @@
 */
 
 .jHueSelector {
-  border: 1px solid #F1F1F1;
+  border: 1px solid @cui-gray-050;
   padding: 0;
   margin: 0;
   width: 300px;
 }
 
 .jHueSelectorHeader {
-  background-color: #F1F1F1;
+  background-color: @cui-gray-050;
   padding: 4px;
 }
 
@@ -45,11 +45,11 @@
   width: 100px;
   height: 20px;
   min-height: 20px;
-  border: 1px solid #CCCCCC;
+  border: 1px solid @cui-gray-400;
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
-  color: #555555;
+  color: @cui-gray-800;
   font-size: 10px;
   padding-left: 4px;
 }
@@ -70,7 +70,7 @@
 }
 
 .jHueSelector li.selectorDivider {
-  border-bottom: 1px solid #E5E5E5;
+  border-bottom: 1px solid @cui-gray-100;
   padding: 4px;
-  color: #338BB8;
+  color: @hue-primary-color-dark;
 }

+ 3 - 3
desktop/core/src/desktop/static/desktop/less/components/hue-tables.less

@@ -249,7 +249,7 @@ td.details {
 }
 
 .paging_full_numbers span.paginate_button {
-  background-color: #ddd;
+  background-color: @cui-gray-300;
 }
 
 .paging_full_numbers span.paginate_button:hover {
@@ -431,7 +431,7 @@ table.display tr.gradeX {
 }
 
 table.display tr.gradeU {
-  background-color: #ddd;
+  background-color: @cui-gray-300;
 }
 
 div.box {
@@ -470,6 +470,6 @@ div.box {
 }
 
 .table tr.locked td.unlockable:hover .fa-unlock, .table tr td.lockable:hover .fa-lock {
-  color: #666;
+  color: @cui-gray-800;
   display: block;
 }

+ 4 - 1
desktop/core/src/desktop/static/desktop/less/httperrors.less

@@ -16,11 +16,14 @@
  limitations under the License.
 */
 
+@import (reference) "cui/colors.less";
+@import (reference) "hue-mixins.less";
+
 #httperror {
   .error-code {
     margin: 0;
     padding-bottom: 30px;
-    color: #CCC;
+    color: @cui-gray-400;
     text-align: center;
     font-weight: 200;
     font-size: 150px;

+ 5 - 5
desktop/core/src/desktop/static/desktop/less/hue-assist.less

@@ -786,11 +786,11 @@
   height: 100%;
 
   th {
-    border-right: 1px solid #e5e5e5;
+    border-right: 1px solid @cui-gray-200;
   }
 
   td {
-    border-right: 1px solid #e5e5e5;
+    border-right: 1px solid @cui-gray-200;
     white-space: nowrap;
   }
 
@@ -800,16 +800,16 @@
   }
 
   .fixed-header-row {
-    border-bottom: 1px solid #e5e5e5;
+    border-bottom: 1px solid @cui-gray-200;
   }
 
   .fixed-first-cell {
-    border-right: 1px solid #e5e5e5;
+    border-right: 1px solid @cui-gray-200;
     margin-left: -1px;
 
     thead th {
       height: 23px;
-      border-bottom: 1px solid #e5e5e5 !important;
+      border-bottom: 1px solid @cui-gray-200 !important;
     }
   }
 }

+ 7 - 7
desktop/core/src/desktop/static/desktop/less/hue-autocomplete.less

@@ -35,7 +35,7 @@
   max-height: 250px;
   overflow: hidden;
 
-  border: 1px solid #DDD;
+  border: 1px solid @cui-gray-300;
   border-radius: 2px;
   background-color: @cui-white;
   .hue-box-shadow-bottom();
@@ -53,7 +53,7 @@
 .autocompleter-header {
   .flex(0 0 20px);
   padding: 5px;
-  background-color: #F9F9F9;
+  background-color: @cui-gray-050;
   line-height: 20px;
   font-size: 14px;
   overflow: hidden;
@@ -127,7 +127,7 @@
   right: 0;
   top: 3px;
   padding-right: 3px;
-  color: #737373;
+  color: @cui-gray-700;
   white-space: nowrap;
 }
 
@@ -152,7 +152,7 @@
 
 .autocompleter-details-contents .details-attribute,
 .autocompleter-details-contents .details-popularity {
-  color: #737373;
+  color: @cui-gray-700;
   display: inline-block;
 }
 
@@ -169,13 +169,13 @@
 
 .autocompleter-details-contents .details-comment {
   margin-top: 5px;
-  color: #737373;
+  color: @cui-gray-700;
   font-style: italic;
 }
 
 .autocompleter-details-contents .details-code {
-  background-color: #F9F9F9;
+  background-color: @cui-gray-050;
   padding:3px;
-  color: #737373;
+  color: @cui-gray-700;
   font: 12px/normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;direction: ltr;
 }

+ 7 - 7
desktop/core/src/desktop/static/desktop/less/hue-cross-version.less

@@ -97,7 +97,7 @@
 .hueCheckbox {
   width: 15px;
   height: 15px;
-  border: 1px solid #CCCCCC;
+  border: 1px solid @cui-gray-400;
   margin-top: 2px !important;
   padding: 0 !important;
   display: block !important;
@@ -105,17 +105,17 @@
 }
 
 .hueCheckbox.disabled {
-  border: 1px solid #DDDDDD;
-  background-color: #FEFEFE;
+  border: 1px solid @cui-gray-300;
+  background-color: @cui-gray-050;
   cursor: not-allowed;
 }
 
 .hueCheckbox:hover {
-  border-color: #999999;
+  border-color: @cui-gray-600;
 }
 
 .hueCheckbox.disabled:hover {
-  border-color: #DDDDDD;
+  border-color: @cui-gray-300;
 }
 
 .hueCheckboxText {
@@ -171,8 +171,8 @@
 
 .hue-ace-location {
   position: absolute;
-  background-color: #DBE8F1;
-  border: 1px solid #DBE8F1;
+  background-color: @hue-primary-color-light;
+  border: 1px solid @hue-primary-color-light;
   border-radius: 1px;
   margin-left: -1px;
   margin-top: -1px;

+ 2 - 2
desktop/core/src/desktop/static/desktop/less/hue-helpers.less

@@ -28,13 +28,13 @@
 
 pre, .like-pre {
   border: none;
-  border-left: 5px solid #DDD;
+  border-left: 5px solid @cui-gray-300;
   border-radius: 0;
   padding: 9.5px;
   margin: 0 0 10px;
   font-size: 12px;
   line-height: 20px;
-  background-color: #f5f5f5;
+  background-color: @cui-gray-050;
   color: #444;
   font-family: Monaco,Menlo,Consolas,"Courier New",monospace;
 }

+ 2 - 10
desktop/core/src/desktop/static/desktop/less/hue.less

@@ -444,11 +444,7 @@ a:visited {
   padding: 18px 24px 0 0;
   display: inline-block;
   cursor: pointer;
-  transition-property: opacity, -webkit-filter;
-  transition-property: opacity, filter;
-  transition-property: opacity, filter, -webkit-filter;
-  transition-duration: 0.15s;
-  transition-timing-function: linear;
+  .hue-ease-transition(~"opacity, filter, -webkit-filter");
   font: inherit;
   color: inherit;
   text-transform: none;
@@ -487,11 +483,7 @@ a:visited {
   background-color: @hue-primary-color-dark;
   border-radius: 4px;
   position: absolute;
-  transition-property: -webkit-transform;
-  transition-property: transform;
-  transition-property: transform, -webkit-transform;
-  transition-duration: 0.15s;
-  transition-timing-function: ease;
+  .hue-ease-transition(~"transform, -webkit-transform");
 }
 
 .hamburger-inner::before, .hamburger-inner::after {

+ 11 - 11
desktop/core/src/desktop/static/desktop/less/hue3-extra.less

@@ -32,10 +32,10 @@
 }
 
 .subnav {
-  background-color: #EEEEEE;
-  background-image: -moz-linear-gradient(center top, #F5F5F5 0%, #EEEEEE 100%);
+  background-color: @cui-gray-100;
+  background-image: -moz-linear-gradient(center top, @cui-gray-050 0%, @cui-gray-100 100%);
   background-repeat: repeat-x;
-  border: 1px solid #E5E5E5;
+  border: 1px solid @cui-gray-200;
   border-radius: 4px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
@@ -48,32 +48,32 @@
 }
 
 .subnav .nav > li > a {
-  border-left: 1px solid #F5F5F5;
+  border-left: 1px solid @cui-gray-050;
   border-radius: 0;
   -webkit-border-radius: 0;
   -moz-border-radius: 0;
-  border-right: 1px solid #E5E5E5;
+  border-right: 1px solid @cui-gray-200;
   margin: 0;
   padding-bottom: 11px;
   padding-top: 11px;
 }
 
 .subnav .nav > li > a:hover {
-  border-right: 1px solid #E5E5E5;
-  border-left: 1px solid #F5F5F5;
+  border-right: 1px solid @cui-gray-200;
+  border-left: 1px solid @cui-gray-050;
 }
 
 .subnav .nav > .active > a, .subnav .nav > .active > a:hover {
-  background-color: #E9E9E9;
+  background-color: @cui-gray-100;
   border-left: 0 none;
-  border-right-color: #DDDDDD;
+  border-right-color: @cui-gray-300;
   box-shadow: 0 3px 5px rgba(0, 0, 0, 0.05) inset;
-  color: #777777;
+  color: @cui-gray-700;
   padding-left: 13px;
 }
 
 .subnav .nav > .active > a .caret, .subnav .nav > .active > a:hover .caret {
-  border-top-color: #777777;
+  border-top-color: @cui-gray-700;
 }
 
 .subnav .nav > li:first-child > a, .subnav .nav > li:first-child > a:hover {

+ 7 - 7
desktop/core/src/desktop/static/desktop/less/login.less

@@ -31,14 +31,14 @@
   display: block;
   margin: auto;
   margin-bottom: 50px;
-  background: #FFFFFF;
+  background: @cui-white;
   border: 1px solid #E0E2E3;
   border-radius: 4px;
   a {
     white-space: normal;
   }
   .logo {
-    background-color: #FFF;
+    background-color: @cui-white;
     width: 70px;
     height: 70px;
     text-align: center;
@@ -51,7 +51,7 @@
     margin-bottom: 35px;
   }
   .empty-logo {
-    background-color: #FFF;
+    background-color: @cui-white;
     width: 70px;
     height: 70px;
   }
@@ -86,7 +86,7 @@
       padding: 0;
       border: none;
       box-shadow: none;
-      background: #FFFFFF;
+      background: @cui-white;
       height: 45px;
       font-size: 16px;
       color: #9e9e9e;
@@ -116,7 +116,7 @@
 }
 
 :-webkit-autofill, :-webkit-autofill:focus {
-  -webkit-box-shadow: 0 0 0px 1000px white inset !important;
+  -webkit-box-shadow: 0 0 0 1000px white inset !important;
   -webkit-text-fill-color: #9e9e9e !important;
 }
 
@@ -146,7 +146,7 @@
   margin-left: auto;
   margin-right: auto;
   width: 100%;
-  background-color: #FAFAFA;
+  background-color: @cui-gray-050;
 }
 
 @media screen and (max-width: 800px) {
@@ -175,7 +175,7 @@
 }
 
 #login-modal {
-  padding: 0px !important;
+  padding: 0 !important;
   box-shadow: none;
   background: transparent;
   border: none;

Неке датотеке нису приказане због велике количине промена