Skip to content

Instantly share code, notes, and snippets.

View borntorun's full-sized avatar

João Carvalho borntorun

  • Lisboa - Portugal
View GitHub Profile
<div class="demo" ng-controller="BasicsCtrl as vm">
<div class="selection">Selection:&nbsp;<span>{{vm.itemonSelected}}</span></div>
<angular-typeaheadjs angty-ttoptions="{{vm.ttoptions}}"
angty-ttdatasets="vm.datasets"
angty-options="{{vm.options}}"
angty-onselect>
<input class="typeahead" type="text" placeholder="Search for US States"/>
</angular-typeaheadjs>
</div>
<div ng-controller="RemotePrefetchCtrl as vm">
<div class="scrolling">Item scrolled:&nbsp;{{vm.itemonCursorChanged}}</div>
<div class="selection">Selection:&nbsp;<span ng-repeat="item in vm.itemonSelected">{{item}}</span></div>
<angular-typeaheadjs angty-ttoptions="{{vm.ttoptions}}"
angty-options="{{vm.options}}"
angty-onselect="vm.onSelected"
angty-onclose="vm.onClosed"
angty-oncursorchange>
<div ng-controller="RemotePrefetchCtrl as vm">
<angular-typeaheadjs prefetch="{{vm.prefetch}}"
remote="{{vm.remote}}"
onselected="vm.onSelected"
onclosed="vm.onClosed"
oncursorchanged="vm.onCursorChanged"
datasource="countries"
placeholder="Search for Countries"
minlensugestion="1"
limit="9"
@borntorun
borntorun / mixin-convert-px-to-em-percent-step-6
Last active August 29, 2015 14:11
less mixin to convert px to em/percent step-6
.convert-px(@unit; @tag; @px; @context: 16; @important:~'') {
.calc(@px; @multiply; @context) {
@ret-convert-px:(@px/@context)*@multiply;
}
.apply(@tag; @px; @context; @multiply; @sufix) {
.calc(@px, @multiply, @context);
@{tag}: @ret-convert-px + @sufix @important;
}
.unit(to-em; @tag; @px; @context) {
.apply(@tag, @px, @context, 1, 0em);
@borntorun
borntorun / mixin-convert-px-to-em-percent-step-5
Last active August 29, 2015 14:11
less mixin to convert px to em/percent step-5
#convert-px {
.calc(@px; @context; @multiply) {
@ret-convert-px:(@px/@context)*@multiply;
}
.em(@tag; @px; @context) {
.calc(@px, @context, 1);
.apply(@tag) {
@{tag}: @ret-convert-px + 0em;
}
.apply(@tag);
@borntorun
borntorun / mixin-convert-px-to-em-percent-step-4
Last active August 29, 2015 14:11
less mixin to convert px to em/percent step-4
#convert-px {
.calc(@px; @context; @multiply) {
@ret-convert-px:(@px/@context)*@multiply;
}
.em(@tag; @px; @context) {
.calc(@px, @context, 1);
.apply(font) { font-size: @ret-convert-px + 0em; }
.apply(padding) { padding: @ret-convert-px + 0em; }
.apply(@tag);
}
@borntorun
borntorun / mixin-convert-px-to-em-percent-step-3
Last active August 29, 2015 14:11
less mixin to convert px to em/percent step-3
#convert-px-font-size {
.calc(@px; @context; @multiply) {
@ret-convert-px:(@px/@context)*@multiply;
}
.em(@px; @context) {
.calc(@px, @context, 1);
font-size: @ret-convert-px + 0em;
}
.percent(@px; @context) {
.calc(@px, @context, 100);
@borntorun
borntorun / mixin-convert-px-to-em-percent-step-2
Last active August 29, 2015 14:11
less mixin to convert px to em/percent step-2
#convert-px-font-size {
.em(@px; @context) {
font-size: (@px/@context) + 0em;
}
.percent(@px; @context) {
font-size: (@px/@context) * 100 + 0%;
}
}
.myclass1 {
#convert-px-font-size > .em(32,16);
@borntorun
borntorun / mixin-convert-px-to-em-percent-step-1
Last active August 29, 2015 14:11
less mixin to convert px to em/percent step-1
.em-font-size(@px) {
font-size: (@px/16) + 0em;
}
.myclass {
.em-font-size(32);
}