javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 16:16:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(components): update to use shadow DOM and work with css variables

Browse Source 
- updates components to use shadow DOM or scoped if they require css variables
- moves global styles to an external stylesheet that needs to be imported
- adds support for additional colors and removes the Sass loops to generate colors for each component
- several property renames, bug fixes, and test updates

Co-authored-by: Manu Mtz.-Almeida <manu.mtza@gmail.com>
Co-authored-by: Adam Bradley <adambradley25@gmail.com>
Co-authored-by: Cam Wiegert <cam@camwiegert.com>
This commit is contained in:
Brandy Carney
2018-07-09 12:57:21 -04:00
parent a4659f03b4
commit a7f1f4daa7
710 changed files with 20999 additions and 20853 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
core/src/components/item-group/item-group.ios.scss
View File

@ -5,11 +5,7 @@
// iOS Item Group
// --------------------------------------------------
.item-group-ios ion-item:first-child .item-inner {
border-top-width: 0;
}
.item-group-ios ion-item:last-child .item-inner,
.item-group-ios ion-item-sliding:last-child .item .item-inner {
border: 0;
.item-group-ios ion-item:last-child,
.item-group-ios ion-item-sliding:last-child .item {
--border-width: 0;
}

10
core/src/components/item-group/item-group.md.scss
View File

@ -5,11 +5,7 @@
// Material Design Item Group
// --------------------------------------------------
.item-group-md ion-item:first-child .item-inner {
border-top-width: 0;
}
.item-group-md ion-item:last-child .item-inner,
.item-group-md ion-item-sliding:last-child .item .item-inner {
border: 0;
.item-group-md ion-item:last-child,
.item-group-md ion-item-sliding:last-child ion-item {
--border-width: 0;
}

16
core/src/components/item-group/item-group.tsx
View File

@ -1,4 +1,6 @@
import { Component } from '@stencil/core';
import { Mode } from '../../interface';
import { createThemedClasses } from '../../utils/theme';
@Component({
@ -6,9 +8,15 @@ import { Component } from '@stencil/core';
styleUrls: {
ios: 'item-group.ios.scss',
md: 'item-group.md.scss'
},
host: {
theme: 'item-group'
}
})
export class ItemGroup {}
export class ItemGroup {
mode!: Mode;
hostData() {
return {
class: createThemedClasses(this.mode, 'item-group')
};
}
}