Browse Source

HUE-6077 [frontend] Unify colors throughout

Johan Ahlen 8 năm trước cách đây
mục cha
commit
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}

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 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;

Một số tệp đã không được hiển thị bởi vì quá nhiều tập tin thay đổi trong này khác