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

refactor(thumbnail): make it mode less

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-08-26 01:35:42 +02:00
parent 7917ba96ef
commit 771857b1df
7 changed files with 4 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
core/src/components/thumbnail/thumbnail.ios.scss
View File

@ -1,10 +0,0 @@
@import "./thumbnail";
@import "./thumbnail.ios.vars";
// iOS Thumbnail
// --------------------------------------------------
:host {
--size: #{$thumbnail-ios-width};
--border-radius: #{$thumbnail-ios-border-radius};
}

13
core/src/components/thumbnail/thumbnail.ios.vars.scss
View File

@ -1,13 +0,0 @@
@import "../../themes/ionic.globals.ios";
// iOS Thumbnail
// --------------------------------------------------
/// @prop - Width of the thumbnail
$thumbnail-ios-width: 48px !default;
/// @prop - Height of the thumbnail
$thumbnail-ios-height: $thumbnail-ios-width !default;
/// @prop - Border radius of the thumbnail
$thumbnail-ios-border-radius: 0 !default;

10
core/src/components/thumbnail/thumbnail.md.scss
View File

@ -1,10 +0,0 @@
@import "./thumbnail";
@import "./thumbnail.md.vars";
// Material Design Thumbnail
// --------------------------------------------------
:host {
--size: #{$thumbnail-md-width};
--border-radius: #{$thumbnail-md-border-radius};
}

13
core/src/components/thumbnail/thumbnail.md.vars.scss
View File

@ -1,13 +0,0 @@
@import "../../themes/ionic.globals.md";
// Material Design Thumbnail
// --------------------------------------------------
/// @prop - Width of the thumbnail
$thumbnail-md-width: 48px !default;
/// @prop - Height of the thumbnail
$thumbnail-md-height: $thumbnail-md-width !default;
/// @prop - Border radius of the thumbnail
$thumbnail-md-border-radius: 0 !default;

2
core/src/components/thumbnail/thumbnail.scss
View File

@ -9,6 +9,8 @@
* @prop --border-radius: Border radius of the thumbnail
* @prop --size: Size of the thumbnail
*/
--size: 48px;
--border-radius: 0;
@include border-radius(var(--border-radius));

16
core/src/components/thumbnail/thumbnail.tsx
View File

@ -1,25 +1,11 @@
import { Component } from '@stencil/core';
import { Mode } from '../../interface';
import { createThemedClasses } from '../../utils/theme';
@Component({
tag: 'ion-thumbnail',
styleUrls: {
ios: 'thumbnail.ios.scss',
md: 'thumbnail.md.scss'
},
styleUrl: 'thumbnail.scss',
shadow: true
})
export class Thumbnail {
mode!: Mode;
hostData() {
return {
class: createThemedClasses(this.mode, 'thumbnail')
};
}
render() {
return <slot></slot>;
}