mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
Card tweaks
This commit is contained in:
@ -12,13 +12,12 @@ $card-box-shadow: 0 1px 3px rgba(0, 0, 0, .3) !default;
|
|||||||
|
|
||||||
.card {
|
.card {
|
||||||
|
|
||||||
|
.card-header, .card-footer, .card-content {
|
||||||
.card-content {
|
padding: 15px;
|
||||||
padding: 20px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
img {
|
img {
|
||||||
max-width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -7,6 +7,19 @@
|
|||||||
List Header
|
List Header
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
New Post
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
Keep close to Nature's heart... and break clear away, once in awhile, and climb a mountain or spend a week in the woods. Wash your spirit clean.
|
||||||
|
</div>
|
||||||
|
<img src="http://ionic-io-assets.s3.amazonaws.com/images/p4.png">
|
||||||
|
<div class="card-footer">
|
||||||
|
Posted 5 days ago
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="card">
|
<div class="card">
|
||||||
|
|
||||||
<div class="item card-header">
|
<div class="item card-header">
|
||||||
|
@ -9,7 +9,7 @@ import {DragGesture} from 'ionic/gestures/drag-gesture';
|
|||||||
import * as util from 'ionic/util';
|
import * as util from 'ionic/util';
|
||||||
|
|
||||||
import {dom} from 'ionic/util'
|
import {dom} from 'ionic/util'
|
||||||
import {IonicComponent} from 'ionic/config/component'
|
import {IonicComponent, IonicDirective} from 'ionic/config/component'
|
||||||
|
|
||||||
import {Hammer} from 'ionic/gestures/hammer';
|
import {Hammer} from 'ionic/gestures/hammer';
|
||||||
|
|
||||||
@ -51,8 +51,6 @@ export class Slides {
|
|||||||
// Grab the main container, and the slides-view wrapper
|
// Grab the main container, and the slides-view wrapper
|
||||||
this.domElement = elementRef.domElement;
|
this.domElement = elementRef.domElement;
|
||||||
|
|
||||||
this.config = Slides.config.invoke(this);
|
|
||||||
|
|
||||||
this.slides = [];
|
this.slides = [];
|
||||||
this.currentIndex = 0;
|
this.currentIndex = 0;
|
||||||
|
|
||||||
@ -463,20 +461,24 @@ export class Slides {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@Directive({
|
@IonicDirective(Slide)
|
||||||
selector: 'ion-slide',
|
|
||||||
})
|
|
||||||
export class Slide {
|
export class Slide {
|
||||||
constructor(
|
constructor(
|
||||||
@Ancestor() slides: Slides,
|
@Ancestor() slides: Slides,
|
||||||
elementRef: ElementRef
|
elementRef: ElementRef
|
||||||
) {
|
) {
|
||||||
this.domElement = elementRef.domElement;
|
this.domElement = elementRef.domElement;
|
||||||
this.config = Slide.config.invoke(this);
|
|
||||||
|
|
||||||
slides.add(this);
|
slides.add(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
static get config() {
|
||||||
|
return {
|
||||||
|
selector: 'ion-slide',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
translate(x, duration) {
|
translate(x, duration) {
|
||||||
this._translateX = x;
|
this._translateX = x;
|
||||||
|
|
||||||
@ -523,13 +525,18 @@ export class SlidePager {
|
|||||||
elementRef: ElementRef
|
elementRef: ElementRef
|
||||||
) {
|
) {
|
||||||
this.domElement = elementRef.domElement;
|
this.domElement = elementRef.domElement;
|
||||||
this.config = SlidePager.config.invoke(this);
|
|
||||||
|
|
||||||
this.slides = slides;
|
this.slides = slides;
|
||||||
|
|
||||||
this.slides.setPager(this);
|
this.slides.setPager(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
static get config() {
|
||||||
|
return {
|
||||||
|
selector: 'ion-pager',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
getSlides() {
|
getSlides() {
|
||||||
return this.slides.slides;
|
return this.slides.slides;
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user