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

Add calendar day abbreviations

Browse Source
This commit is contained in:
Peter Maquiran
2021-02-02 15:11:30 +01:00
parent b0b3702ec1
commit c8bba4570f
4 changed files with 77 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/agenda/agenda.page.html
+45 -6
View File
@@ -43,8 +43,21 @@
<ion-icon (click)="openAddEvent()" class="right-icons" src="assets/images/icons-add-new-event.svg" ></ion-icon>
</ion-row>
</ion-row>
<calendar
<table class="custom-calendar-header">
<thead>
<th>S</th>
<th>T</th>
<th>Q</th>
<th>Q</th>
<th>S</th>
<th>S</th>
<th>D</th>
</thead>
</table>
<calendar class="calendar-component"
[eventSource]="eventSource"
[calendarMode]="calendar.mode"
[currentDate]="calendar.currentDate"
@@ -62,7 +75,7 @@
[monthviewDisplayEventTemplate]="template"
>
</calendar>
<!-- Adding a customized ng-template -->
<ng-template #template let-view="view" let-row="row" let-col="col">
<div [className]="currentDayEventDisplayBorder(view.dates, row*7+col)" [class.with-event]="view.dates[row*7+col].events.length">
@@ -94,7 +107,20 @@
</ion-col>
</ion-row>
<calendar
<table class="custom-calendar-header">
<thead>
<th>S</th>
<th>T</th>
<th>Q</th>
<th>Q</th>
<th>S</th>
<th>S</th>
<th>D</th>
</thead>
</table>
<calendar class="calendar-component"
[eventSource]="eventSource"
[calendarMode]="calendar.mode"
[currentDate]="calendar.currentDate"
@@ -145,8 +171,21 @@
</ion-button>
</ion-col>
</ion-row>
<calendar
<table class="custom-calendar-header">
<thead>
<th>S</th>
<th>T</th>
<th>Q</th>
<th>Q</th>
<th>S</th>
<th>S</th>
<th>D</th>
</thead>
</table>
<calendar class="calendar-component"
[eventSource]="eventSource"
[calendarMode]="calendar.mode"
[currentDate]="calendar.currentDate"
src/app/pages/agenda/agenda.page.scss
+21 -3
View File
@@ -257,7 +257,9 @@ label{
right: 14px;
color: #e16817;
}
td.monthview-primary-with-event {
background-color: white !important;
}
.header-title{
width: 300px;
font-family: Roboto;
@@ -413,5 +415,21 @@ label{
.calendar-tool-tip{
padding: 17px 10px 0px 10px;
}
padding: 20px 10px 30px 10px;
}
.custom-calendar-header{
width: 100%;
margin-bottom: 10px;
thead{
th{
font-family: Roboto;
font-size: 15px;
color: rgba(52, 72, 94, 0.54);
font-weight: normal;
}
}
}
src/app/pages/agenda/agenda.page.ts
+1 -1
View File
@@ -180,7 +180,7 @@ export class AgendaPage implements OnInit {
const scrollContainer = shadowRoot.querySelector('main');
scrollContainer.scrollTop = timelineMarker['offsetTop'] - (scrollContainer.offsetHeight/2);
scrollContainer.scrollTop = timelineMarker['offsetTop'] - ((scrollContainer.offsetHeight/2) - 60);
}, timeout);
}
src/global.scss
+10 -1
View File
@@ -47,10 +47,10 @@ ion-slide{
}
}
td.monthview-primary-with-event {
background-color: white !important;
}
// current date
td.monthview-current{
border-bottom: 1px solid lightskyblue !important;
@@ -210,7 +210,16 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
.calendar-profile{
font-size: 36px
}
/* angular-cli file: src/styles.css */
@import "../node_modules/angular-calendar/css/angular-calendar.css";
@import "./style/main.scss";
// disable calendar build in header
.calendar-component{
thead{
display: none;
}
}