purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-10 04:25:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Scrumboard and Contacts app dialogs responsive fixes

Browse Source
This commit is contained in:
Sercan Yemen 2017-12-06 11:35:58 +03:00
parent 21fd488a8e
commit effd3cefcb
3 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/app/main/content/apps/contacts/contact-form/contact-form.component.scss
View File

@ -2,15 +2,18 @@
.contact-form-dialog { .contact-form-dialog {
@include media-breakpoint('xs') {
width: 100%;
}
@include media-breakpoint-up('xs') {
width: 400px;
}
.mat-dialog-container { .mat-dialog-container {
padding: 0; padding: 0;
width: 400px;
overflow: hidden; overflow: hidden;
@include media-breakpoint('xs') {
width: auto;
}
.mat-toolbar { .mat-toolbar {
min-height: initial; min-height: initial;
} }

4
src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.html
View File

@ -131,8 +131,8 @@
<div *ngIf="card" mat-dialog-content class="p-24 m-0" fusePerfectScrollbar> <div *ngIf="card" mat-dialog-content class="p-24 m-0" fusePerfectScrollbar>
<div fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center" <div fxLayout.gt-sm="row" fxLayoutAlign.gt-sm="space-between center"
fxLayout.xs="column" fxLayoutAlign="center center"> fxLayout="column" fxLayoutAlign="center center">
<!-- BREADCRUMB --> <!-- BREADCRUMB -->
<div class="card-breadcrumb mb-16 mb-sm-0" fxLayout="row" fxLayoutAlign="start center"> <div class="card-breadcrumb mb-16 mb-sm-0" fxLayout="row" fxLayoutAlign="start center">

18
src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.scss
View File

@ -2,9 +2,16 @@
.scrumboard-card-dialog { .scrumboard-card-dialog {
@include media-breakpoint('xs') {
width: 100%;
}
@include media-breakpoint-up('xs') {
width: 720px;
}
.mat-dialog-container { .mat-dialog-container {
padding: 0; padding: 0;
width: 720px;
.mat-toolbar { .mat-toolbar {
@ -162,9 +169,16 @@
background-size: contain; background-size: contain;
background-position: 50% 50%; background-position: 50% 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
margin-right: 24px;
font-weight: 500; font-weight: 500;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
@include media-breakpoint('xs') {
margin-bottom: 24px;
}
@include media-breakpoint-up('xs') {
margin-right: 24px;
}
} }
.attachment-content { .attachment-content {