fix(components): include mode classes on components for use in shadow (#17838)

- removes mode-less component classes from the internal CSS, use element instead
- adds mode specific classes `md` or `ios` for styling inside of shadow components
- adds e2e test that verifies mode classes exist on all ionic components, plus checks for specific classes that the components need for internal styling

fixes #17608
This commit is contained in:
Brandy Carney
2019-04-16 17:28:21 -04:00
committed by GitHub
parent 38ae3620a2
commit e5c8c10029
93 changed files with 685 additions and 119 deletions

View File

@ -1,11 +1,14 @@
import { Component, ComponentInterface, Prop } from '@stencil/core';
import { Mode } from '../../interface';
@Component({
tag: 'ion-grid',
styleUrl: 'grid.scss',
shadow: true
})
export class Grid implements ComponentInterface {
mode!: Mode;
/**
* If `true`, the grid will have a fixed width based on the screen size.
@ -15,6 +18,7 @@ export class Grid implements ComponentInterface {
hostData() {
return {
class: {
[`${this.mode}`]: true,
'grid-fixed': this.fixed
}
};