javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(actionsheet): iOS hover

Browse Source 
Closes #143
This commit is contained in:
Adam Bradley
2015-09-21 22:34:57 -05:00
parent dd47e93b0b
commit 41e8def79e
2 changed files with 19 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ionic/components/action-sheet/modes/ios.scss
View File

@@ -15,7 +15,7 @@ $action-sheet-ios-title-font-size: 1.2rem !default;
$action-sheet-ios-button-text-color: #007aff !default;
$action-sheet-ios-button-font-size: 2rem !default;
$action-sheet-ios-background-active-color: #ebebeb !default;
$action-sheet-ios-background-active-color: #e9e9e9 !default;
$action-sheet-ios-icon-font-size: 1.4em !default;

32
ionic/components/tap-click/ripple.ts
View File

@@ -11,7 +11,7 @@ export class RippleActivator extends Activator {
downAction(targetEle, pointerX, pointerY) {
super.downAction(targetEle, pointerX, pointerY, (targetEle) => {
if (!targetEle || !targetEle.parentNode) return;
if (!targetEle || !targetEle.parentNode || NO_RIPPLE_TAGNAMES.test(targetEle.tagName)) return;
// clean out any existing ripple elements
removeAll(targetEle);
@@ -29,7 +29,6 @@ export class RippleActivator extends Activator {
rippleEle.style.top = (pointerY - r.top) + 'px';
targetEle.appendChild(rippleEle);
targetEle.clientWidth; // force render
transitionEnd(rippleEle).then(ev => {
// the ripple animation has ended
@@ -38,7 +37,9 @@ export class RippleActivator extends Activator {
});
// kick off animaiton
rippleEle.classList.add('ripple-expand');
raf(() => {
rippleEle.classList.add('ripple-expand');
});
});
}
@@ -50,19 +51,20 @@ export class RippleActivator extends Activator {
// this stops the background from changing colors, not stop the ripple
this.queue = {};
let targetEle = ev.target;
raf(() => {
if (targetEle && targetEle.parentNode) {
targetEle.classList.remove(this.activatedClass);
if (ev && ev.target) {
raf(() => {
let targetEle = ev.target;
if (targetEle && targetEle.parentNode) {
targetEle.classList.remove(this.activatedClass);
let rippleElements = getRippleElements(targetEle);
for (let i = 0, l = rippleElements.length; i < l; i++) {
rippleElements[i].dataset.pointerUp = true;
fadeOutRipple(rippleElements[i]);
let rippleElements = getRippleElements(targetEle);
for (let i = 0, l = rippleElements.length; i < l; i++) {
rippleElements[i].dataset.pointerUp = true;
fadeOutRipple(rippleElements[i]);
}
}
}
});
});
}
}
clearState(ev) {
@@ -102,3 +104,5 @@ function removeAll(targetEle) {
function getRippleElements(containerEle) {
return containerEle && containerEle.querySelectorAll('md-ripple');
}
const NO_RIPPLE_TAGNAMES = /BACKDROP/;