-add header with no search funcionality

- change header in home and chat
This commit is contained in:
tiago.kayaya
2021-01-29 11:28:26 +01:00
parent 076b614488
commit ba5baf3fe8
12 changed files with 202 additions and 24 deletions
+2 -17
View File
@@ -1,24 +1,9 @@
<ion-header>
<app-header></app-header>
</ion-header>
<ion-header class="ion-no-border">
<ion-toolbar class="ion-no-border" class="bg-blue">
<div class="div-top-header">
<div class="div-search">
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
</div>
<div class="div-logo">
<img src='assets/images/logo-no-bg.png' alt='logo'>
</div>
<div class="div-profile">
<ion-icon src='assets/images/icons-profile.svg'></ion-icon>
</div>
</div>
</ion-toolbar>
</ion-header>
<ion-header>
<ion-toolbar class="bg-blue">
<div class="main-content">
<div class="main-header">
<ion-toolbar>
<ion-buttons slot="end">
<!-- customized TOGGLE button -->
@@ -30,7 +15,7 @@
</div>
</div>
</ion-buttons>
<ion-title class="header-title">Agenda</ion-title>
<ion-label class="header-title">Agenda</ion-label>
</ion-toolbar>
<ion-toolbar>
<ion-segment [(ngModel)]="segment">
+41 -2
View File
@@ -36,6 +36,45 @@
border-radius: 15px;
}
.main-header{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
background-color: #fff;
overflow:hidden;
padding: 15px 5px 0px 5px;
color:#000;
transform: translate3d(0, 1px, 0);
.title-content{
width: 360px;
margin: 0px auto;
overflow: auto;
padding: 0 !important;
background: #ecf8ff;
}
.div-title{
padding: 0!important;
float: left;
}
.title{
font-size: 25px;
}
.div-icon{
width: 40px;
float: right;
font-size: 35px;
overflow: auto;
padding: 1px;
}
.div-icon ion-icon{
float: right;
padding-left: 20px;
}
}
/* TOGGLE button */
@@ -182,9 +221,9 @@ input:checked[type="checkbox"]::before{
}
.toggle{
position: relative;
display: inline;
display: block;
font-family: 'Montserrat', sans-serif;
display: grid;
/* display: grid; */
text-align: center;
}
label{
+2 -1
View File
@@ -1,5 +1,6 @@
<ion-header>
<app-header></app-header>
<!-- <app-header></app-header> -->
<app-header-no-search></app-header-no-search>
</ion-header>
<ion-header class="ion-no-border">
<ion-toolbar class="bg-blue">
+1 -1
View File
@@ -1,5 +1,5 @@
<ion-header class="ion-no-border">
<app-header></app-header>
<app-header-no-search></app-header-no-search>
</ion-header>
<!-- Default Refresher -->