added modalnavbar

src/app/app.css

@@ -1,46 +1,74 @@
 :host {
-  display: flex;
+    display: flex;
 }
 
 .app-layout {
-  height: 100vh;
+    height: 100vh;
 }
 
 .top-nav {
-  line-height: 64px;
+    line-height: 64px;
 }
 
 .logo {
-  float: left;
-  height: 64px;
-  padding-right: 24px;
-  line-height: 64px;
-  background: #001529;
+    float: left;
+    height: 64px;
+    padding-right: 24px;
+    line-height: 64px;
 }
 
 .logo img {
-  display: inline-block;
-  height: 32px;
-  width: 32px;
-  vertical-align: middle;
+    display: inline-block;
+    height: 32px;
+    width: 32px;
+    vertical-align: middle;
 }
 
 .logo h1 {
-  display: inline-block;
-  margin: 0 0 0 15px;
-  color: #fff;
-  font-weight: 600;
-  font-size: 20px;
-  font-family: Avenir,Helvetica Neue,Arial,Helvetica,sans-serif;
-  vertical-align: middle;
+    display: inline-block;
+    margin: 0 0 0 15px;
+    color: #fff;
+    font-weight: 600;
+    font-size: 20px;
+    font-family: Avenir,Helvetica Neue,Arial,Helvetica,sans-serif;
+    vertical-align: middle;
 }
 
 nz-content {
-  padding: 24px 50px;
+    padding: 24px 50px;
 }
 
 .inner-content {
-  padding: 24px;
-  background: #fff;
-  height: 100%;
+    padding: 24px;
+    background: #fff;
+    height: 100%;
 }
+
+.header-container {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.logo {
+    display: flex;
+    align-items: center;
+}
+
+.top-nav {
+    flex: 1;
+    margin-left: 40px;
+}
+
+.right-icons {
+    display: flex;
+    align-items: center;
+    gap: 20px;
+    color: #fff;
+    font-size: 18px;
+    cursor: pointer;
+}
+
+.right-icons nz-icon:hover {
+    color: #40a9ff;
+}