peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-19 04:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add search page

Browse Source
This commit is contained in:
Peter Maquiran
2021-01-07 09:38:46 +01:00
parent 40543826b7
commit 3ba9c6aac5
6 changed files with 405 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/search/search.page.html
+134 -68
View File
@@ -1,81 +1,147 @@
<ion-header>
<ion-toolbar>
<ion-title>Pesquisa</ion-title>
</ion-toolbar>
<!-- HEADER-->
<ion-header class="ion-no-border header-main d-flex ion-justify-content-between">
<ion-form>
<div class="d-flex search-input-container">
<div class="icon">
<ion-icon class="icon-z" slot="end" name="search"></ion-icon>
</div>
<div class="input-text d-flex ion-align-items-center">
<ion-input class="search-input" type="search" placeholder="Pesquisar"></ion-input>
</div>
<div class="icon">
<ion-icon name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
</div>
</div>
</ion-form>
<div class="icon-z icon-most-searched-word-open">
<ion-icon src="assets/images/icons-most-searched-words-open.svg" class="icon" slot="end"></ion-icon>
</div>
<div class="profile">
<ion-icon class="icon" src="assets/images/icons-profile.svg"></ion-icon>
</div>
</ion-header>
<ion-content class="content">
<ion-form>
<ion-grid class="search-input-container">
<ion-row class="ion-justify-content-around">
<ion-col class="icon-search-container">
<div class="icon-search-container">
<ion-icon class="icon-search" slot="end" name="search"></ion-icon>
</div>
</ion-col>
<ion-col>
<div>
<ion-input class="search-input" type="search" placeholder="FMI"></ion-input>
</div>
</ion-col>
<ion-col class="icon-search-container">
<div>
<ion-icon class="icon-search" slot="end" name="search"></ion-icon>
</div>
</ion-col>
</ion-row>
</ion-grid>
<ion-grid class="search-result">
<ion-row class="ion-justify-content-between ion-text-center">
<ion-col >
<div class="button">
<p>Protocolos</p>
<ion-label class="label">10</ion-label>
</div>
</ion-col>
<ion-col>
<div class="button">
<p>Faturas</p>
<ion-label class="label">10</ion-label>
</div>
</ion-col>
<ion-col >
<!-- search result type-->
<div class="options">
<div class="container ion-justify-content-between ion-align-items-center">
<div class="d-flex ion-justify-content-center ion-text-center">
<div class="button">
<p>Relatório</p>
<ion-label class="label">10</ion-label>
</div>
</ion-col>
</ion-row>
<ion-row class="ion-justify-content-between ion-text-center">
<ion-col >
<div class="button">
<p>Protocolos</p>
<ion-label class="label">10</ion-label>
</div>
</ion-col>
<ion-col>
<div class="button">
<p>Faturas</p>
<ion-label class="label">10</ion-label>
</div>
</ion-col>
<ion-col >
<div class="button">
<p>Relatório</p>
<ion-label class="label">10</ion-label>
</div>
</ion-col>
</ion-row>
</ion-grid>
</ion-form>
<div class="button">
<p>Relatório</p>
<ion-label class="label">10</ion-label>
</div>
<div class="button">
<p>Relatório</p>
<ion-label class="label">10</ion-label>
</div>
<div class="button">
<p>Relatório</p>
<ion-label class="label">10</ion-label>
</div>
<div class="button">
<p>Relatório</p>
<ion-label class="label">10</ion-label>
</div>
</div>
<div class="icon-z icon-most-searched-word-open">
<ion-icon src="assets/images/icons-most-searched-words-open.svg" class="icon" slot="end"></ion-icon>
</div>
</div>
</div>
<div class="d-flex">
<!-- most searched word-->
<div class="most-searched-words">
<p>Palavas mais pesquisdas</p>
</div>
<!-- search result-->
<div class="search-result">
<div class="header">
<div class="d-flex ion-justify-content-between ion-align-items-center">
<div class="d-flex sort-by ion-justify-content-center">
<p><span class="order">Order por:</span><span class="order-labal">Mais Recente</span></p>
</div>
<div>
<ion-icon src="assets/images/icons-arrow-arrow-down-25.svg"></ion-icon>
</div>
</div>
</div>
<ul>
<li class="d-flex">
<div class="icon">
<ion-icon src="assets/images/icons-search-document.svg"></ion-icon>
</div>
<div class="content ion-align-items-center">
<p class="result-name">title</p>
<div class="d-flex ion-justify-content-between ">
<span>MINEC, MINFIN</span>
<span>13/04/2020</span>
</div>
</div>
</li>
<li class="d-flex">
<div class="icon">
<ion-icon src="assets/images/icons-search-document.svg"></ion-icon>
</div>
<div class="content">
<p class="result-name">title</p>
<div class="d-flex ion-justify-content-between">
<span>MINEC, MINFIN</span>
<span>13/04/2020</span>
</div>
</div>
</li>
<li class="d-flex">
<div class="icon">
<ion-icon src="assets/images/icons-search-document.svg"></ion-icon>
</div>
<div class="content">
<p class="result-name">title</p>
<div class="d-flex ion-justify-content-between">
<span>MINEC, MINFIN</span>
<span>13/04/2020</span>
</div>
</div>
</li>
<li class="d-flex">
<div class="icon">
<ion-icon src="assets/images/icons-search-document.svg"></ion-icon>
</div>
<div class="content">
<p class="result-name">title</p>
<div class="d-flex ion-justify-content-between">
<span>MINEC, MINFIN</span>
<span>13/04/2020</span>
</div>
</div>
</li>
<li class="d-flex">
<div class="icon">
<ion-icon src="assets/images/icons-search-document.svg"></ion-icon>
</div>
<div class="content">
<p class="result-name">title</p>
<div class="d-flex ion-justify-content-between">
<span>MINEC, MINFIN</span>
<span>13/04/2020</span>
</div>
</div>
</li>
</ul>
</div>
</div>
</ion-content>