remove layout

This commit is contained in:
Adam Bradley
2015-08-06 12:49:02 -05:00
parent 563dd8d521
commit 64e6fb3d5f
5 changed files with 0 additions and 134 deletions

View File

@@ -1,58 +0,0 @@
layout,
[layout] {
position: relative;
display: flex;
}
[flex] {
flex: 1;
}
.ele-qry {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0;
padding: 0;
margin: 0;
border: none;
visibility: hidden;
pointer-events: none;
z-index: -99;
}
@mixin element-query($mq) {
$mq: "'" + $mq + "'";
$attr: str-replace($mq, ':', '-');
$attr: str-replace($attr, ' ', '-');
$attr: str-replace($attr, '--', '-');
$attr: str-replace($attr, '(', '');
$attr: str-replace($attr, ')', '');
&.#{$attr} {
@content;
}
.ele-qry {
font-family: $mq;
}
}
/*
div {
@include element-query( (min-width: 300px) ) {
background: blue;
};
@include element-query( (min-width: 400px) And (max-width: 800px) ) {
background: green;
};
}
*/

View File

@@ -1,53 +0,0 @@
import {Component, View, ElementRef} from 'angular2/angular2'
@Component({
selector: 'layout,[layout]'
})
@View({
template: `
<ng-content></ng-content>
<object class="ele-qry" data="about:blank"></object>
`
})
export class Layout {
constructor(
@ElementRef() elementRef:ElementRef
) {
this.ele = ngElement.nativeElement
this.eqEle = this.ele.lastElementChild
window.requestAnimationFrame(() => {
this.initLayout()
})
}
initLayout() {
this.mqs = {}
for (let x = 0; x < this.ele.attributes.length; x++) {
let attr = this.ele.attributes[x]
let val = attr.nodeValue
let mqClassname = attr.nodeName
if (val.indexOf('(') > -1 && val.indexOf(')') > -1) {
let mql = this.eqEle.contentDocument.defaultView.matchMedia(val)
if (mql.media !== 'not all') {
this.mqs[mql.media] = (mql) => {
console.log(mql.media, mql.matches, mqClassname)
window.requestAnimationFrame(() => {
this.ele.classList[mql.matches ? 'add' : 'remove'](mqClassname)
})
}
this.mqs[mql.media](mql)
mql.addListener(this.mqs[mql.media])
}
}
}
}
}

View File

@@ -1,7 +0,0 @@
import {App} from 'ionic/ionic';
@App({
templateUrl: 'main.html'
})
class IonicApp {}

View File

@@ -1,15 +0,0 @@
<layout style="width:80%;"
abc="(min-width: 400px)"
def="(min-width: 500px)"
ghi="(min-width: 600px)">
<div flex>A</div>
<div flex>B</div>
<div flex>C</div>
<div flex>D</div>
</layout>

View File

@@ -30,7 +30,6 @@
"components/form/form",
"components/form/label",
"components/form/input",
"components/layout/layout",
"components/list/list",
"components/modal/modal",
"components/nav-bar/nav-bar",