Calendar, Scrumboard Apps datepicker fixes.

This commit is contained in:
mustafahlvc 2017-10-13 17:50:59 +03:00
parent 470b851eae
commit 6656410696
4 changed files with 30 additions and 38 deletions

View File

@ -181,7 +181,7 @@ export class ScrumboardFakeDb
'time' : '45 mins. ago' 'time' : '45 mins. ago'
} }
], ],
'due' : 'Tue Aug 29 2017 13:16:34 GMT+0300 (Turkey Standard Time)' 'due' : '2017-08-29T10:16:34.000Z'
}, },
{ {
'id' : '5637273da9b93bb84743a0f9', 'id' : '5637273da9b93bb84743a0f9',
@ -274,7 +274,7 @@ export class ScrumboardFakeDb
} }
], ],
'activities' : [], 'activities' : [],
'due' : 'Fri Sep 07 2018 15:00:00 GMT+0300 (Turkey Standard Time)' 'due' : '2018-09-07T12:00:00.000Z'
}, },
{ {
'id' : 'f6b9d7a9247e5d794a081927', 'id' : 'f6b9d7a9247e5d794a081927',
@ -365,7 +365,7 @@ export class ScrumboardFakeDb
'checkItemsChecked': 0, 'checkItemsChecked': 0,
'comments' : [], 'comments' : [],
'activities' : [], 'activities' : [],
'due' : 'Wed Mar 08 2017 12:00:00 GMT+0300 (Turkey Standard Time)' 'due' : '2017-03-08T09:00:00.000Z'
}, },
{ {
'id' : '80ed.24ad3b18e2668.f28fbbceeeff9.5a834620a42f1.5909be19a2bf2.6c4a54947ce2d.da356b0c1', 'id' : '80ed.24ad3b18e2668.f28fbbceeeff9.5a834620a42f1.5909be19a2bf2.6c4a54947ce2d.da356b0c1',
@ -536,7 +536,7 @@ export class ScrumboardFakeDb
'checkItemsChecked': 3, 'checkItemsChecked': 3,
'comments' : [], 'comments' : [],
'activities' : [], 'activities' : [],
'due' : 'Fri Feb 02 2017 14:20:34 GMT+0300 (Turkey Standard Time)' 'due' : '2017-02-02T11:20:34.000Z'
} }
], ],
'members' : [ 'members' : [

View File

@ -60,7 +60,9 @@
<div fxFlex="1 0 auto" fxLayout="row"> <div fxFlex="1 0 auto" fxLayout="row">
<mat-form-field class="mr-24" fxFlex> <mat-form-field class="mr-24" fxFlex>
<input matInput [matDatepicker]="startDatePicker" placeholder="Start Date"> <input matInput [matDatepicker]="startDatePicker" placeholder="Start Date"
name="start"
formControlName="start">
<mat-datepicker-toggle matSuffix [for]="startDatePicker"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="startDatePicker"></mat-datepicker-toggle>
<mat-datepicker #startDatePicker></mat-datepicker> <mat-datepicker #startDatePicker></mat-datepicker>
</mat-form-field> </mat-form-field>
@ -74,7 +76,9 @@
<div fxFlex="1 0 auto" fxLayout="row"> <div fxFlex="1 0 auto" fxLayout="row">
<mat-form-field class="mr-24" fxFlex> <mat-form-field class="mr-24" fxFlex>
<input matInput [matDatepicker]="endDatePicker" placeholder="End Date"> <input matInput [matDatepicker]="endDatePicker" placeholder="End Date"
name="end"
formControlName="end">
<mat-datepicker-toggle matSuffix [for]="endDatePicker"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="endDatePicker"></mat-datepicker-toggle>
<mat-datepicker #endDatePicker></mat-datepicker> <mat-datepicker #endDatePicker></mat-datepicker>
</mat-form-field> </mat-form-field>

View File

@ -16,7 +16,12 @@
<button mat-menu-item (click)="removeDueDate()">Remove Due Date</button> <button mat-menu-item (click)="removeDueDate()">Remove Due Date</button>
</mat-menu> </mat-menu>
<!--<md2-datepicker *ngIf="!card.due" [(ngModel)]="card.due" openOnFocus="true" placeholder="Set Date/Time" type="datetime"></md2-datepicker>--> <mat-form-field *ngIf="!card.due">
<input matInput [matDatepicker]="menuPicker" [(ngModel)]="card.due">
<mat-datepicker-toggle matSuffix [for]="menuPicker"></mat-datepicker-toggle>
<mat-datepicker #menuPicker></mat-datepicker>
</mat-form-field>
</div> </div>
<!-- / DUE DATE --> <!-- / DUE DATE -->
@ -140,7 +145,11 @@
<!-- DUE DATE --> <!-- DUE DATE -->
<div *ngIf="card.due" class="due-date" fxLayout="row" fxLayoutAlign="start center"> <div *ngIf="card.due" class="due-date" fxLayout="row" fxLayoutAlign="start center">
<!--<md2-datepicker class="picker ml-8" [(ngModel)]="card.due" openOnFocus="true" type="datetime" format="dd/MM/y H:mm"></md2-datepicker>--> <mat-form-field floatPlaceholder="never">
<input matInput [matDatepicker]="picker" [(ngModel)]="card.due" placeholder="Choose a due date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<button mat-icon-button class="remove-due-date" (click)="removeDueDate()"> <button mat-icon-button class="remove-due-date" (click)="removeDueDate()">
<mat-icon class="s-16">close</mat-icon> <mat-icon class="s-16">close</mat-icon>

View File

@ -10,22 +10,19 @@
.due-date { .due-date {
md2-datepicker { .mat-form-field {
min-width: initial; width: auto;
margin: 0 8px;
.md2-datepicker-trigger { .mat-form-field-wrapper {
padding: 0; padding: 0;
.md2-datepicker-button { .mat-form-field-flex {
display: block; align-items: center;
position: relative;
top: 0;
left: 0;
line-height: normal;
}
.md2-datepicker-input { .mat-input-element {
display: none; display: none;
}
} }
} }
} }
@ -63,24 +60,6 @@
.due-date { .due-date {
md2-datepicker {
width: 180px;
min-width: 180px;
.md2-datepicker-trigger {
padding-top: 5px;
padding-bottom: 5px;
.md2-datepicker-button {
top: 0;
}
.md2-datepicker-input {
min-width: initial;
}
}
}
.remove-due-date { .remove-due-date {
} }
} }