[shenyu-dashboard] branch master updated: GlobalHeader Update (#229)

[dengliming]

This is an automated email from the ASF dual-hosted git repository.

dengliming pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/shenyu-dashboard.git


The following commit(s) were added to refs/heads/master by this push:
     new ec9118d1 GlobalHeader Update (#229)
ec9118d1 is described below

commit ec9118d14c2756f3989745815febeb4c7c8dc953
Author: WeiS <78211515+qinziw...@users.noreply.github.com>
AuthorDate: Wed Aug 17 19:28:01 2022 +0800

    GlobalHeader Update (#229)
    
    * LoginPage Update
    
    delete background.svg
    
    LoginPage Update
    
    Create test.yml
    
    add license
    
    delete test.yml
    
    create tsconfig
    
    * GlobalHeader Update
---
 src/components/GlobalHeader/index.js   | 30 +++++++++++++++---------------
 src/components/GlobalHeader/index.less | 30 ++++++++++++++++++++++++++----
 2 files changed, 41 insertions(+), 19 deletions(-)

diff --git a/src/components/GlobalHeader/index.js 
b/src/components/GlobalHeader/index.js
index 5288c2bf..7cd1d84c 100644
--- a/src/components/GlobalHeader/index.js
+++ b/src/components/GlobalHeader/index.js
@@ -16,7 +16,7 @@
  */
 
 import React, { PureComponent } from "react";
-import { Dropdown, Form, Icon, Input, Menu, Modal } from "antd";
+import { Dropdown, Form, Icon, Input, Menu, Modal, Button } from "antd";
 import { connect } from "dva";
 import styles from "./index.less";
 import { getIntlContent, getCurrentLocale } from "../../utils/IntlUtils";
@@ -116,21 +116,21 @@ class GlobalHeader extends PureComponent {
     );
     return (
       <div className={styles.header}>
-        <Dropdown
-          placement="bottomCenter"
-          overlay={this.state.menu}
-          trigger={["click"]}
-        >
-          <TranslationOutlined />
-        </Dropdown>
-        <div className={styles.right}>
-          <Dropdown overlay={menu}>
-            <span>
-              <Icon type="user" />
-              {userName}
-              <Icon type="down" />
-            </span>
+        <span className={styles.text}>Apache ShenYu Gateway Management 
System</span>
+        <div>
+          <Dropdown
+            placement="bottomCenter"
+            overlay={this.state.menu}
+          >
+            <Button><TranslationOutlined /></Button>
           </Dropdown>
+          <div className={styles.right}>
+            <Dropdown.Button overlay={menu} icon={<Icon type="user" />}>
+              <span>
+                {userName}
+              </span>
+            </Dropdown.Button>
+          </div>
         </div>
         <Modal
           title={getIntlContent("SHENYU.GLOBALHEADER.CHANGE.PASSWORD")}
diff --git a/src/components/GlobalHeader/index.less 
b/src/components/GlobalHeader/index.less
index f91f4867..a6f460a0 100644
--- a/src/components/GlobalHeader/index.less
+++ b/src/components/GlobalHeader/index.less
@@ -16,17 +16,24 @@
  */
 
 @import '~antd/lib/style/themes/default.less';
+
 .header {
   display: flex;
-  justify-content: flex-end;
+  justify-content: space-between;
   align-items: center;
   height: 64px;
-  padding: 0 12px 0 0;
+  padding: 0 24px 0 0;
   background: #fff;
-  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+  box-shadow: 0 4px 4px rgba(0, 21, 41, 0.08);
   position: relative;
 }
 
+.text {
+  font-size: 20px;
+  font-weight: 600;
+  margin-left: 24px;
+}
+
 :global {
   .ant-layout {
     min-height: 100vh;
@@ -42,6 +49,7 @@
   padding: 0 0 0 24px;
   cursor: pointer;
   font-size: 20px;
+
   img {
     display: inline-block;
     vertical-align: middle;
@@ -52,6 +60,7 @@
   :global(.anticon) {
     margin-right: 8px;
   }
+
   :global(.ant-dropdown-menu-item) {
     width: 160px;
   }
@@ -63,6 +72,7 @@ i.trigger {
   cursor: pointer;
   transition: all 0.3s, padding 0s;
   padding: 0 24px;
+
   &:hover {
     background: @primary-1;
   }
@@ -73,32 +83,39 @@ i.trigger {
   float: right;
   height: 100%;
   cursor: pointer;
+
   &:hover {
     color: @primary-color;
   }
+
   .action {
     cursor: pointer;
     padding: 0 12px;
     display: inline-block;
     transition: all 0.3s;
     height: 100%;
+
     >i {
       font-size: 16px;
       vertical-align: middle;
       color: @text-color;
     }
+
     &:hover,
     &:global(.ant-popover-open) {
       background: @primary-1;
     }
   }
+
   .search {
     padding: 0;
     margin: 0 12px;
+
     &:hover {
       background: transparent;
     }
   }
+
   .account {
     .avatar {
       margin: 20px 8px 20px 0;
@@ -114,21 +131,26 @@ i.trigger {
     :global(.ant-divider-vertical) {
       vertical-align: unset;
     }
+
     .name {
       display: none;
     }
+
     i.trigger {
       padding: 0 12px;
     }
+
     .logo {
       padding-right: 12px;
       position: relative;
     }
+
     .right {
       position: absolute;
       right: 12px;
       top: 0;
       background: #fff;
+
       .account {
         .avatar {
           margin-right: 0;
@@ -136,4 +158,4 @@ i.trigger {
       }
     }
   }
-}
+}
\ No newline at end of file