Skip to content

Instantly share code, notes, and snippets.

.row-split {
.clearfix();
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1,
.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5,
.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7,
.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
.space-left {
margin-left: @grid-gutter-width;
}
.space-left-half {
margin-left: @grid-gutter-width / 2;
}
.space-right {
margin-right: @grid-gutter-width;
}
.space-right-half {
@aviogreen
aviogreen / Form.html
Last active August 29, 2015 14:19
Search form with button search inside of text input
<form class="form-search top-left" action="" method="get">
<span class="sr-only">Search for: </span>
<input type="text" placeholder="Search..." id="s" name="s">
<button id="searchsubmit" type="submit"><i class="glyphicon glyphicon-search"></i></button>
</form>
@aviogreen
aviogreen / vertical-align.css
Last active August 29, 2015 14:20
vertical align middle just for single row
.vertical-align {
display: flex;
flex-direction: row;
}
.vertical-align > [class^="col-"],
.vertical-align > [class*=" col-"] {
display: flex;
align-items: center;
justify-content: center;
@aviogreen
aviogreen / social.less
Created April 29, 2015 10:08
simple list icon using <ul>
ul.social {
list-style: none;
margin: 0;
padding: 0;
li{
float: left;
margin: 5px;
a {
display: block;
border: 3px solid #aaa;
.placeholder(@color) {
&::-webkit-input-placeholder {
color: @color;
}
&:-moz-placeholder {
color: @color;
}
&::-moz-placeholder {
color: @color;
}
.grayscale{
@filterString: grayscale(100%);
-webkit-filter: @filterString;
-moz-filter: @filterString;
-o-filter: @filterString;
-ms-filter: @filterString;
filter: @filterString;
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
}
<iframe width="560" height="315" src="http://www.youtube.com/embed/GRonxog5mbw?autoplay=1&loop=1&playlist=GRonxog5mbw" frameborder="0" allowfullscreen></iframe>​
.overflow-elipsis {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
@aviogreen
aviogreen / animate-scroll.js
Last active August 29, 2015 14:21
Animatie Scroll
$('[data-animate-scroll]').click(function(event) {
var target = $( $(this).data('animate-scroll') );
var speed = $(this).data('animate-scroll-speed') ? $(this).data('animate-scroll-speed') : 800;
$('html, body').animate({
scrollTop: target.offset().top
}, speed);
});