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

IE11 and Edge fixes on page layouts and theme layouts

Browse Source
This commit is contained in:
Sercan Yemen 2018-06-15 16:28:02 +03:00
parent 5459579d04
commit e43ae86a58
4 changed files with 28 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/@fuse/scss/partials/_page-layouts.scss
View File

@ -48,7 +48,7 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
z-index: 2; z-index: 2;
padding: 0 32px; padding: 0 32px;
width: 100%; width: 100%;
min-width: 100%; min-width: 0;
max-width: 100%; max-width: 100%;
max-height: 100%; max-height: 100%;
@ -244,6 +244,7 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
z-index: 3; z-index: 3;
margin-left: 32px; margin-left: 32px;
margin-right: 32px; margin-right: 32px;
min-width: 0;
> .header { > .header {
display: flex; display: flex;
@ -415,6 +416,7 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
> .content { > .content {
flex: 1 1 auto; flex: 1 1 auto;
min-width: 0;
} }
} }
@ -476,6 +478,7 @@ $carded-header-height-without-toolbar-sm: $carded-header-height-sm - $carded-too
flex-direction: column; flex-direction: column;
flex: 1 1 auto; flex: 1 1 auto;
z-index: 3; z-index: 3;
min-width: 0;
@include mat-elevation(7); @include mat-elevation(7);
> .header { > .header {

26
src/app/layout/components/content/content.component.ts
View File

@ -8,29 +8,29 @@ import { fuseAnimations } from '@fuse/animations';
import { FuseConfigService } from '@fuse/services/config.service'; import { FuseConfigService } from '@fuse/services/config.service';
@Component({ @Component({
selector : 'content', selector: 'content',
templateUrl : './content.component.html', templateUrl: './content.component.html',
styleUrls : ['./content.component.scss'], styleUrls: ['./content.component.scss'],
encapsulation: ViewEncapsulation.None, encapsulation: ViewEncapsulation.None,
animations : fuseAnimations animations: fuseAnimations
}) })
export class ContentComponent implements OnInit, OnDestroy export class ContentComponent implements OnInit, OnDestroy
{ {
fuseConfig: any; fuseConfig: any;
@HostBinding('@routerTransitionUp') // @HostBinding('@routerTransitionUp')
routeAnimationUp: boolean; routeAnimationUp: boolean;
@HostBinding('@routerTransitionDown') // @HostBinding('@routerTransitionDown')
routeAnimationDown: boolean; routeAnimationDown: boolean;
@HostBinding('@routerTransitionRight') // @HostBinding('@routerTransitionRight')
routeAnimationRight: boolean; routeAnimationRight: boolean;
@HostBinding('@routerTransitionLeft') // @HostBinding('@routerTransitionLeft')
routeAnimationLeft: boolean; routeAnimationLeft: boolean;
@HostBinding('@routerTransitionFade') // @HostBinding('@routerTransitionFade')
routeAnimationFade: boolean; routeAnimationFade: boolean;
// Private // Private
@ -75,8 +75,9 @@ export class ContentComponent implements OnInit, OnDestroy
filter((event) => event instanceof NavigationEnd), filter((event) => event instanceof NavigationEnd),
map(() => this._activatedRoute) map(() => this._activatedRoute)
) )
.subscribe(() => { .subscribe(() =>
switch ( this.fuseConfig.routerAnimation ) {
switch (this.fuseConfig.routerAnimation)
{ {
case 'fadeIn': case 'fadeIn':
this.routeAnimationFade = !this.routeAnimationFade; this.routeAnimationFade = !this.routeAnimationFade;
@ -100,7 +101,8 @@ export class ContentComponent implements OnInit, OnDestroy
this._fuseConfigService.config this._fuseConfigService.config
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))
.subscribe( .subscribe(
(config) => { (config) =>
{
this.fuseConfig = config; this.fuseConfig = config;
} }
); );

10
src/app/layout/horizontal/layout-1/layout-1.component.scss
View File

@ -26,7 +26,7 @@ horizontal-layout-1 {
> .container { > .container {
position: relative; position: relative;
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 0%;
width: 100%; width: 100%;
min-height: 0; min-height: 0;
min-width: 0; min-width: 0;
@ -35,7 +35,7 @@ horizontal-layout-1 {
> .container { > .container {
position: relative; position: relative;
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 0%;
flex-direction: column; flex-direction: column;
min-width: 0; min-width: 0;
@ -43,7 +43,7 @@ horizontal-layout-1 {
> .container { > .container {
position: relative; position: relative;
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 0%;
flex-direction: column; flex-direction: column;
transform: translateZ(0); transform: translateZ(0);
overflow-x: hidden; overflow-x: hidden;
@ -53,11 +53,11 @@ horizontal-layout-1 {
content { content {
&.inner-scroll { &.inner-scroll {
flex: 1 1 auto; flex: 1 1 0%;
min-height: 0; min-height: 0;
> *:not(router-outlet) { > *:not(router-outlet) {
flex: 1 1 auto; flex: 1 1 0%;
} }
} }
} }

10
src/app/layout/vertical/layout-1/layout-1.component.scss
View File

@ -26,7 +26,7 @@ vertical-layout-1 {
> .container { > .container {
position: relative; position: relative;
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 0%;
width: 100%; width: 100%;
min-height: 0; min-height: 0;
min-width: 0; min-width: 0;
@ -35,7 +35,7 @@ vertical-layout-1 {
> .container { > .container {
position: relative; position: relative;
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 0%;
flex-direction: column; flex-direction: column;
min-width: 0; min-width: 0;
@ -43,7 +43,7 @@ vertical-layout-1 {
> .container { > .container {
position: relative; position: relative;
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 0%;
flex-direction: column; flex-direction: column;
transform: translateZ(0); transform: translateZ(0);
overflow-x: hidden; overflow-x: hidden;
@ -53,11 +53,11 @@ vertical-layout-1 {
content { content {
&.inner-scroll { &.inner-scroll {
flex: 1 1 auto; flex: 1 1 0%;
min-height: 0; min-height: 0;
> *:not(router-outlet) { > *:not(router-outlet) {
flex: 1 1 auto; flex: 1 1 0%;
} }
} }
} }