Эх сурвалжийг харах

HUE-8706 [frontend] Change the top nav logo in DW mode

Johan Ahlen 6 жил өмнө
parent
commit
804d0957ab

Файлын зөрүү хэтэрхий том тул дарагдсан байна
+ 0 - 0
desktop/core/src/desktop/static/desktop/art/cloudera-data-warehouse-2.svg


+ 59 - 0
desktop/core/src/desktop/static/desktop/art/cloudera-data-warehouse-3.svg

@@ -0,0 +1,59 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+     viewBox="0 0 937.7 164.37">
+    <defs>
+        <style>
+            .cls-1{fill:#47bae9;}.cls-2{fill:#4b90b2;}.cls-3{fill:#feca38;}.cls-4{fill:#df6f19;}.cls-14,.cls-5{fill:#fff;}.cls-6{fill:url(#linear-gradient);}.cls-7{fill:url(#linear-gradient-2);}.cls-8{fill:url(#linear-gradient-3);}.cls-9{fill:url(#linear-gradient-5);}.cls-10{fill:url(#linear-gradient-6);}.cls-11{fill:url(#linear-gradient-7);}.cls-12{fill:url(#linear-gradient-8);}.cls-13{fill:url(#linear-gradient-9);}.cls-14{font-size:72px;font-family:Roboto-Light, Roboto;font-weight:300;}.cls-15{letter-spacing:-0.02em;}.cls-16{letter-spacing:-0.01em;}
+        </style>
+        <linearGradient id="linear-gradient" x1="181.98" y1="46.54" x2="499" y2="46.54" gradientUnits="userSpaceOnUse">
+            <stop offset="0" stop-color="#47bae9"/>
+            <stop offset="1" stop-color="#5eab41"/>
+        </linearGradient>
+        <linearGradient id="linear-gradient-2" x1="181.98" y1="39.57" x2="499" y2="39.57"
+                        xlink:href="#linear-gradient"/>
+        <linearGradient id="linear-gradient-3" x1="181.98" y1="46.18" x2="499" y2="46.18"
+                        xlink:href="#linear-gradient"/>
+        <linearGradient id="linear-gradient-5" x1="181.98" y1="46.72" x2="499" y2="46.72"
+                        xlink:href="#linear-gradient"/>
+        <linearGradient id="linear-gradient-6" x1="181.98" y1="39.78" x2="499" y2="39.78"
+                        xlink:href="#linear-gradient"/>
+        <linearGradient id="linear-gradient-7" x1="181.98" y1="46.18" x2="499" y2="46.18"
+                        xlink:href="#linear-gradient"/>
+        <linearGradient id="linear-gradient-8" x1="181.98" y1="46.16" x2="499" y2="46.16"
+                        xlink:href="#linear-gradient"/>
+        <linearGradient id="linear-gradient-9" x1="181.98" y1="26.98" x2="499" y2="26.98"
+                        xlink:href="#linear-gradient"/>
+    </defs>
+    <title>cloudera-data-warehouse-3</title>
+    <polygon class="cls-1" points="0 38.99 0 116.98 67.54 155.98 135.08 116.98 135.08 38.99 67.54 0 0 38.99"/>
+    <polygon class="cls-2" points="67.54 0 67.54 155.98 0 116.98 0 38.99 67.54 0"/>
+    <polygon class="cls-3" points="117.29 79.33 135.08 79.33 135.08 97.77 117.29 102.9 117.29 79.33"/>
+    <polygon class="cls-3" points="95.78 79.33 95.78 50.65 135.08 61.06 135.08 79.33 95.78 79.33"/>
+    <polygon class="cls-4" points="67.54 0 67.54 41.28 41.99 49.75 41.99 14.75 67.54 0"/>
+    <polygon class="cls-3" points="67.54 0 135.08 38.99 135.08 61.06 67.54 41.28 67.54 0"/>
+    <polygon class="cls-5"
+             points="135.08 62.46 135.08 59.66 67.52 39.87 43.34 47.89 43.34 13.97 40.65 15.53 40.65 51.61 67.57 42.69 94.44 50.56 94.44 80.68 115.95 80.68 115.95 104.69 135.08 99.17 135.08 96.37 118.64 101.11 118.64 80.68 135.08 80.68 135.08 77.99 97.12 77.99 97.12 51.35 135.08 62.46"/>
+    <path class="cls-6"
+          d="M455.44,23a34.63,34.63,0,0,0-9.22,1.23,23.81,23.81,0,0,0-4,1.47,6,6,0,0,0-5.08-2.7h-6.33V70.11h12.3V45.63c0-4.76.82-6.62,2.47-8.26s4.16-2.46,7.56-2.46h5.3V23h-3"/>
+    <path class="cls-7"
+          d="M230.86,9h-6.33V64.31a5.47,5.47,0,0,0,1.76,4.13,5.88,5.88,0,0,0,4.22,1.67h6.33V14.82a5.49,5.49,0,0,0-1.76-4.13A5.92,5.92,0,0,0,230.86,9"/>
+    <path class="cls-8"
+          d="M263.07,60.54c7.32,0,9.63-7.67,9.63-14.17s-2.31-14.26-9.63-14.26-9.54,7.77-9.54,14.26S255.76,60.54,263.07,60.54Zm0-38.73c13.88,0,21.58,9.15,21.58,24.41S277,70.54,263.08,70.54c-14.15,0-21.49-9.12-21.49-24.32S248.93,21.81,263.08,21.81Z"/>
+    <path class="cls-8"
+          d="M199.47,60.54c-7.31,0-9.53-7.67-9.53-14.17s2.22-14.26,9.53-14.26c3.8,0,6.25,2.11,7.72,5H220c-2.56-9.73-9.63-15.33-20.48-15.33C185.34,21.81,178,31,178,46.22s7.34,24.32,21.49,24.32c10.85,0,17.9-5.59,20.47-15.29h-8.38a6.14,6.14,0,0,0-3.53,1.26C205.84,58.6,204,60.54,199.47,60.54Z"/>
+    <path class="cls-9"
+          d="M328.43,24.66a5.69,5.69,0,0,0-4.31-1.75H318V52.46q0,4.22-2.55,6.15a9.47,9.47,0,0,1-11.46,0q-2.55-1.94-2.55-6.15V28.88a5.94,5.94,0,0,0-1.67-4.22,5.69,5.69,0,0,0-4.31-1.75h-6.15V50.33c0,8.32,2.34,13.47,6.5,16.35s8.75,3.86,13.91,3.86,9.76-1,13.91-3.86,6.5-8,6.5-16.35V28.88A5.94,5.94,0,0,0,328.43,24.66Z"/>
+    <path class="cls-10"
+          d="M377,10.69A5.92,5.92,0,0,0,372.78,9h-6.17V26.51a17.18,17.18,0,0,0-11.79-4.7C342.26,21.81,335,31,335,46.22s7.46,24.32,21.84,24.32c14,0,21.85-9.05,21.91-24.13h0V14.82A5.49,5.49,0,0,0,377,10.69ZM356.82,60.54c-7.43,0-9.69-7.67-9.69-14.17s2.26-14.26,9.69-14.26,9.76,7.68,9.79,14.15v.15h0C366.6,52.9,364.24,60.54,356.82,60.54Z"/>
+    <path class="cls-11"
+          d="M426.3,43.48a6,6,0,0,1-.63,2.75,6.3,6.3,0,0,1-1,1.46,5.47,5.47,0,0,1-4.13,1.76h-25c.32,5.61,3.18,11.09,9.36,11.09,4.57,0,6.36-1.94,8.58-4A6.2,6.2,0,0,1,417,55.25h8.39c-2.57,9.7-9.63,15.29-20.48,15.29-14.15,0-21.49-9.12-21.49-24.32s7.34-24.4,21.49-24.4c10.85,0,17.92,5.59,20.49,15.32a33.29,33.29,0,0,1,.93,5.62ZM404.87,32.11A8.72,8.72,0,0,0,396,40.36h17.74A8.63,8.63,0,0,0,404.87,32.11Z"/>
+    <path class="cls-12"
+          d="M499.59,34.88a11.18,11.18,0,0,0-5.09-9.76q-4.92-3.3-14.77-3.31-8.79,0-13.53,4a13.85,13.85,0,0,0-5,9.09H473a4.71,4.71,0,0,1,2.89-2.82,13,13,0,0,1,4.39-.7,14.16,14.16,0,0,1,5,.79c1.78.62,2.72,1.65,2.72,3.39s-2.57,3.61-7.73,4.28c-6.2.81-11.09,1.47-15.55,4.75-2.86,2.1-4.66,5.95-4.66,10.83,0,5.22,1.62,8.91,4.74,11.23,2.78,2.07,7.3,3.84,14.62,3.84,6.56,0,11.48-1.43,14.76-3.63s5.31-5,5.42-9.89ZM486.38,57.81a10.63,10.63,0,0,1-7.73,2.73c-1,0-4.26-.23-5.6-1.52a4.5,4.5,0,0,1-1.58-3.61,4.8,4.8,0,0,1,1.23-3.27c1.73-1.83,3.63-2.09,7.73-3a33.34,33.34,0,0,0,7.75-2.55v3.55C488.18,53.34,488.25,56,486.38,57.81Z"/>
+    <path class="cls-13"
+          d="M507.22,22.12A4.68,4.68,0,0,1,512,27a4.71,4.71,0,0,1-4.74,4.87A4.64,4.64,0,0,1,502.53,27,4.65,4.65,0,0,1,507.22,22.12Zm0,8.94a4.09,4.09,0,0,0,0-8.17,3.93,3.93,0,0,0-3.9,4.09A4,4,0,0,0,507.22,31.06Zm.07-3.38h-1V29.8h-1V24.19h1.87c1.45,0,2.11.44,2.11,1.69,0,.87-.22,1.39-.9,1.67l1,2.25h-1.1Zm-1-.86h1.05c.62,0,.91-.21.91-.89s-.36-.89-1.11-.89h-.85Z"/>
+    <text class="cls-14" transform="translate(177.51 138)">Data
+        <tspan class="cls-15" x="164.92" y="0">W</tspan>
+        <tspan x="228.3" y="0">a</tspan>
+        <tspan class="cls-16" x="266.87" y="0">r</tspan>
+        <tspan x="290.43" y="0">ehousing</tspan>
+    </text>
+</svg>

+ 15 - 0
desktop/core/src/desktop/static/desktop/art/cloudera-data-warehouse-logo.svg

@@ -0,0 +1,15 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 135.08 155.98">
+    <defs>
+        <style>.cls-1{fill:#47bae9;}.cls-2{fill:#4b90b2;}.cls-3{fill:#feca38;}.cls-4{fill:#df6f19;}.cls-5{fill:#fff;}
+        </style>
+    </defs>
+    <title>cloudera-data-warehouse-logo</title>
+    <polygon class="cls-1" points="0 38.99 0 116.98 67.54 155.98 135.08 116.98 135.08 38.99 67.54 0 0 38.99"/>
+    <polygon class="cls-2" points="67.54 0 67.54 155.98 0 116.98 0 38.99 67.54 0"/>
+    <polygon class="cls-3" points="117.29 79.33 135.08 79.33 135.08 97.77 117.29 102.9 117.29 79.33"/>
+    <polygon class="cls-3" points="95.78 79.33 95.78 50.65 135.08 61.06 135.08 79.33 95.78 79.33"/>
+    <polygon class="cls-4" points="67.54 0 67.54 41.28 41.99 49.75 41.99 14.75 67.54 0"/>
+    <polygon class="cls-3" points="67.54 0 135.08 38.99 135.08 61.06 67.54 41.28 67.54 0"/>
+    <polygon class="cls-5"
+             points="135.08 62.46 135.08 59.66 67.52 39.87 43.34 47.89 43.34 13.97 40.65 15.53 40.65 51.61 67.57 42.69 94.44 50.56 94.44 80.68 115.95 80.68 115.95 104.69 135.08 99.17 135.08 96.37 118.64 101.11 118.64 80.68 135.08 80.68 135.08 77.99 97.12 77.99 97.12 51.35 135.08 62.46"/>
+</svg>

Файлын зөрүү хэтэрхий том тул дарагдсан байна
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue-embedded.css


Файлын зөрүү хэтэрхий том тул дарагдсан байна
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


Файлын зөрүү хэтэрхий том тул дарагдсан байна
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


+ 24 - 2
desktop/core/src/desktop/static/desktop/less/components/hue-dw-sidebar.less

@@ -21,6 +21,28 @@
 @sidebar-category-font-size: 16px;
 @sidebar-left-spacing: 10px;
 
+.hue-dw-brand {
+  width: 247px;
+  height: 50px;
+  position:fixed;
+  left:0;
+  top:0;
+  background-color: #333d52;
+  z-index:500000;
+  transition: width @sidebar-animation-duration;
+  overflow: hidden;
+
+  &.collapsed {
+    width: 46px;
+  }
+
+  img {
+    min-width: 191px;
+    max-width: 191px;
+    margin: 9px 9px;
+  }
+}
+
 .hue-dw-sidebar-container {
   position: relative;
   .flex(0 0);
@@ -153,7 +175,7 @@
 
 
   &.collapsed {
-    .flex-basis(50px);
+    .flex-basis(49px);
 
     .sidebar {
       .sidebar-category-item,
@@ -184,7 +206,7 @@
     flex-shrink: 0;
 
     &.collapsed {
-      width: @collapsed-sidebar-width;
+      width: 47px;
     }
   }
 }

+ 5 - 5
desktop/core/src/desktop/templates/hue.mako

@@ -181,20 +181,18 @@ ${ hueIcons.symbols() }
     <div class="navbar-inner top-nav">
       <div class="top-nav-left">
         % if not IS_EMBEDDED.get():
+        % if not (IS_MULTICLUSTER_ONLY.get() and has_multi_cluster()):
         <a class="hamburger hamburger-hue pull-left" data-bind="toggle: leftNavVisible, css: { 'is-active': leftNavVisible }">
           <span class="hamburger-box"><span class="hamburger-inner"></span></span>
         </a>
 
         <a class="brand" data-bind="hueLink: '/home/'" href="javascript: void(0);" title="${_('Documents')}">
-          % if IS_MULTICLUSTER_ONLY.get() and has_multi_cluster():
-            <img src="${ static('desktop/art/cloudera-data-warehouse.svg') }" style="height: 18px; display: none;" data-bind="visible:  pocClusterMode() === 'dw'">
-            <img src="${ static('desktop/art/cloudera-data-engineering.svg') }" style="height: 22px; margin-top:3px; display: none;" data-bind="visible:  pocClusterMode() !== 'dw'">
-          % else:
             <svg style="height: 24px; width: 120px;"><use xlink:href="#hi-logo"></use></svg>
-          % endif
         </a>
         % endif
 
+        % endif
+
         % if not IS_MULTICLUSTER_ONLY.get():
         <div class="btn-group" data-bind="visible: true" style="display:none; margin-top: 8px">
           <!-- ko if: mainQuickCreateAction -->
@@ -1485,6 +1483,8 @@ ${ smart_unicode(login_modal(request).content) | n,unicode }
           }
         });
 
+        huePubSub.subscribe('hue.toggle.left.nav', self.leftNavVisible);
+
         // TODO: Drop. Just for PoC
         self.pocClusterMode = ko.observable();
         ApiHelper.getInstance().withTotalStorage('topNav', 'multiCluster', self.pocClusterMode, 'dw')

+ 14 - 0
desktop/core/src/desktop/templates/ko_components/ko_dw_sidebar.mako

@@ -24,6 +24,15 @@
 
 <%def name="dwSidebar()">
   <script type="text/html" id="hue-dw-sidebar-template">
+    <div class="hue-dw-brand" data-bind="css: { 'collapsed': collapsed }, toggle: leftNavVisible">
+##       <!-- ko if: collapsed -->
+##       <img src="${ static('desktop/art/cloudera-data-warehouse-logo.svg') }">
+##       <!-- /ko -->
+##       <!-- ko ifnot: collapsed -->
+      <img src="${ static('desktop/art/cloudera-data-warehouse-3.svg') }">
+##       <!-- /ko -->
+    </div>
+
     <div class="sidebar">
       <div class="sidebar-content" data-bind="foreach: items">
         <!-- ko if: $index() !== 0 -->
@@ -64,6 +73,11 @@
         self.pocClusterMode = params.pocClusterMode;
         // self.items =  params.items; // TODO: Once we have the proper apps in cluster config.
 
+        self.leftNavVisible = ko.observable(false);
+        self.leftNavVisible.subscribe(function (val) {
+          huePubSub.publish('hue.toggle.left.nav', val);
+        });
+
         self.items = ko.pureComputed(function () {
           var appCategory = {
             displayName: 'Apps',

Энэ ялгаанд хэт олон файл өөрчлөгдсөн тул зарим файлыг харуулаагүй болно