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

Improve agenda timeline

Browse Source
This commit is contained in:
Peter Maquiran
2021-03-17 20:45:57 +01:00
parent 5ca0f71d65
commit 307335ef7b
4 changed files with 82 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/agenda/agenda.page.html
+41 -20
View File
@@ -6,7 +6,7 @@
<div class="d-flex bg-blue container-wrapper">
<div class="calendar-timeline bg-blue">
<div class="calendar-timeline d-flex flex-column height-100 bg-blue">
<div class="calendar-wrapper">
<div class="main-content">
@@ -230,10 +230,10 @@
<!-- Calendar currente date -->
<ion-row class="timeline-header ion-justify-content-between ion-align-items-center currente-date-timelien">
<ion-row class="timeline-header ion-justify-content-between ion-align-items-center currente-date-timelien pb-5">
<ion-row class="timeline-date align-center">
<ion-icon *ngIf="showCalendar" (click)="calendarHeight='75px';showCalendar=false" class="collaps" src="assets/images/icons-collaps-up.svg" ></ion-icon>
<ion-icon *ngIf="!showCalendar" (click)="calendarHeight='430.5px';showCalendar=true" class="collaps" src="assets/images/icons-collaps-down.svg" ></ion-icon>
<ion-icon *ngIf="!showCalendar" (click)="calendarHeight='333px';showCalendar=true" class="collaps" src="assets/images/icons-collaps-down.svg" ></ion-icon>
</ion-row>
<ion-row class="timeline-date align-center">
<span *ngIf="timelineIsCurrentDate()">Hoje, &nbsp;</span> {{ timelineDate }}
@@ -250,11 +250,23 @@
</ul>
</ion-row>
</ion-row>
<div class="d-flex pb-5 d-none d-md-flex">
<div class="flex-grow-1 text-grey d-flex justify-center align-center">
<div>Prória</div>
</div>
<div class="flex-grow-1 text-black">
<div class="flex-grow-1 text-grey d-flex justify-center align-center">
<div>Presidente da Republica</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="timeline-wrapper" [style.height]="sanitizer.bypassSecurityTrustStyle('calc(100% - ('+calendarHeight+' + 84.5px))')" >
<div class="timeline-wrapper flex-grow-1" [style.height]="sanitizer.bypassSecurityTrustStyle('calc(100% - ('+calendarHeight+' + 84.5px))')" >
<!-- Progress bar -->
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content>
@@ -262,24 +274,33 @@
</ion-refresher>
<!-- Timeline -->
<div class="timeline-container" *ngIf="showTimeline">
<mwl-demo-utils-calendar-header class="timeline"
[(view)]="view"
[(viewDate)]="viewDate"
[dayStartHour]="0"
[dayEndHour]="23">
</mwl-demo-utils-calendar-header>
<div [ngSwitch]="view">
<mwl-calendar-day-view
*ngSwitchCase="'day'"
[viewDate]="viewDate"
[events]="events"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
<div>
<div class="timeline-container d-flex" *ngIf="showTimeline">
<div [ngSwitch]="view" class="timeline-mobile flex-grow-1">
<mwl-calendar-day-view
*ngSwitchCase="'day'"
[viewDate]="viewDate"
[events]="events"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
</div>
<div [ngSwitch]="view" class="flex-grow-1 d-none d-md-block timeline-md">
<mwl-calendar-day-view
*ngSwitchCase="'day'"
[viewDate]="viewDate"
[events]="events"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
</div>
</div>
</div>
</div>
</div>