improve header

src/app/shared/header-pr/header-pr.page.scss

@@ -1,28 +1,47 @@
-.div-top-header{
-    width: 400px;
-    margin: 0 auto;
-    background-color: #0782c9;
-    overflow: auto;
-    padding-top: 15px;
-    border: 0!important;
+@import '~src/function.scss';
 
-    .div-search{
-      font-size: 45px;
-      float: left;
-      margin: 0 0 0 10px
-    }
-    .div-logo{
-      background: transparent;
-      width: 140px;
-      margin: 5px 0 0px 71px;
-      float: left;
-    }
-    .div-logo img{
-      width: 100%;
-    }
-    .div-profile{
-      font-size: 45px;
-      float: right;
-      margin-right: 10px;
-    }
-  }
+.div-top-header{
+  margin: 0 em(20px);
+  background-color: #0782c9;
+  padding-top: em(15px);
+  border: 0!important;
+}
+
+.div-logo{
+  background: transparent;
+  width: em(140px);
+  justify-content: center;
+  display: flex;
+}
+.div-logo img{
+  width: 100%;
+  margin: 0px auto;
+}
+.div-profile{
+  font-size: 45px;
+  justify-content: flex-end;
+  display: flex;
+}
+
+.desktop{
+  display: none;
+}
+
+@media only screen and (min-width: 1366px) {
+
+  .mobile{
+    display: none !important;
+  }
+  .desktop{
+    display: block;
+  }
+
+}
+
+.tab{
+  height: 65px;
+}
+
+.active{
+  border-top: 7px solid white;
+}

src/app/shared/header-pr/header-pr.page.ts

@@ -12,4 +12,8 @@ export class HeaderPrPage implements OnInit {
   ngOnInit() {
   }
 
+  locationPathname(): string {
+    return window.location.pathname
+  }
+  
 }