[ADF-1935] Content on widgets now wraps when viewing it on a small de… (#3117)

* [ADF-1935] Content on widgets now wraps when viewing it on a small device

* [ADF-1935] Width property replaced for flex property

* [ADF-1935] Query modified to work with variable

* [ADF-1935] Removed unnecessary styling classes
This commit is contained in:
davidcanonieto 2018-03-26 13:32:46 +01:00 committed by Eugenio Romano
parent 838842caac
commit 3033102ae4
4 changed files with 101 additions and 91 deletions

View File

@ -1,11 +1,11 @@
.adf-no-form-container {
@mixin adf-process-service-component-theme($theme){
.adf-no-form-container {
text-align: center;
font-weight: 600;
font-size: 18px;
}
}
.adf-grid {
.adf-grid {
.adf-grid-item {
margin: 4px;
@ -94,12 +94,9 @@
}
}
@media screen and (max-width: 1279px) {
@media screen and ($mat-small) {
container-widget .grid-list {
flex-direction: column;
.grid-list-item {
width: 100% !important;
}
}
}

View File

@ -1,6 +1,8 @@
@import './app/components/app-layout/app-layout.component.scss';
@import './app/components/files/files.component.scss';
@import './app/components/login/login.component.scss';
@import './app/components/process-service/process-service.component.scss';
@import 'content-services/styles/index';
@import 'process-services/styles/index';
@ -20,6 +22,8 @@ $theme: mat-light-theme($primary, $accent, $warn);
@include adf-app-layout-theme($theme);
@include adf-file-component-theme($theme);
@include adf-login-component-theme($theme);
@include adf-process-service-component-theme($theme);
@include adf-content-services-theme($theme);
@include adf-process-services-theme($theme);

View File

@ -1,6 +1,8 @@
@import './app/components/app-layout/app-layout.component.scss';
@import './app/components/files/files.component.scss';
@import './app/components/login/login.component.scss';
@import './app/components/process-service/process-service.component.scss';
@import '~@alfresco/adf-content-services/theming';
@import '~@alfresco/adf-process-services/theming';
@ -20,6 +22,8 @@ $theme: mat-light-theme($primary, $accent, $warn);
@include adf-app-layout-theme($theme);
@include adf-file-component-theme($theme);
@include adf-login-component-theme($theme);
@include adf-process-service-component-theme($theme);
@include adf-content-services-theme($theme);
@include adf-process-services-theme($theme);

View File

@ -51,6 +51,12 @@
padding-right: 1%;
}
@media screen and ($mat-small) {
.grid-list-item {
flex: 1 0 100%;
}
}
.mat-form-field {
width: 100%;
}
@ -91,4 +97,3 @@
}
}