Skip to content

Instantly share code, notes, and snippets.

@yannvr
yannvr / compassFlexMixins
Created June 11, 2014 19:54
Cross browser Flex mixins
// ==================================================================
// Flexbox
//
// Implementation based on Chris Coyier's article:
// Using Flexbox: Mixing Old and New for the Best Browser Support || http://css-tricks.com/using-flexbox/
// ==================================================================
// Flexbox Context (applied to container element of flex items)
@mixin flex-display {
@include experimental-value(display, box, -moz, -webkit, -ms, not -khtml, official);
@netzwahnHH
netzwahnHH / column-classes
Last active August 29, 2015 14:04
Sass adaption of "Bootstrap v3.2 optional responsive CSS classes"
// Generate optional visibility layout classes for the different viewports of Bootstrap
// Sass adaption of Bootstrap v3.2 optional responsive CSS classes https://gist.github.com/webtobesocial/2f3d9254e696336a083b#file-column-classes-css
@mixin optional-viewport-only-column($visibilty-class) {
@for $i from 1 through 12 {
.col-#{$visibilty-class}-#{$i}-only {
width: (($i/12)*100) * 1%;
}
}
}
@WebPlatformDocs
WebPlatformDocs / ElasticSearch_backup.md
Last active August 29, 2015 14:07
ElasticSearch: Creating snapshot

Based on documentation from ElasticSearch about snapshots

To create backup with ElasticSearch

  1. Create on elasticsearch node a backup folder
    mkdir /srv/webplatform/elastic_backup
    chown -R elasticsearch:elasticsearch /srv/webplatform/elastic_backup
@tncbbthositg
tncbbthositg / flexbox_mixins.scss
Last active August 29, 2015 14:07
Various Flexbox SASS Mixins
@mixin flex($flex-type: flex) {
$flex-type: unquote($flex-type);
@include experimental-value(display, $flex-type, not -moz, -webkit, not -o, -ms, not -khtml, official);
}
@mixin align-items($alignment) {
$alignment: unquote($alignment);
@include experimental(align-items, $alignment, not -moz, -webkit, not -o, -ms, not -khtml, official);
}
a:link {
}
a:visited {
}
a:focus {
@mixin border-radius($radius, $prefixes: -moz -webkit -o) {
@each $prefix in $prefixes {
#{$prefix}-border-radius:$radius;
}
border-radius:$radius;
}
#id {
@include border-radius(5px, -moz -webkit);
@mirisuzanne
mirisuzanne / _transform-v2.scss
Created November 5, 2010 21:15
compass transforms version 2
@import "shared";
// Transform -----------------------------------------------------------------
// Apply a transform sent as a complete string.
@mixin apply-transform(
$transform,
$threeD: false
) {
@if $threeD {
@include experimental(transform, $transform,
@thomasyip
thomasyip / apple_theme_boxflex.css
Created November 29, 2010 06:50
Boxflex for iPhone app pane
/**
* Extracted from: https://github.com/beedesk/jQTouch/commit/b5d2fc63fe15acba15c4e8eaafc0e128997f8484
*/
/* ============= from themes/apple/theme.css ============= */
#jqt > * {
-webkit-transform: translate3d(0,0,0);
-webkit-backface-visibility: hidden;
background: rgb(197,204,211) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAABCAIAAACdaSOZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABdJREFUeNpiPHrmCgMC/GNjYwNSAAEGADdNA3dnzPlQAAAAAElFTkSuQmCC);
-webkit-user-select: ignore;
/* Stupid compass box-shadow mixin doesn't support multiple shadows... */
@mixin box-shadow-2($first, $second) {
$full: $first, $second;
@include experimental(box-shadow, $full, -moz, -webkit, -o, not -ms, not -khtml, official);
}
@mixin curl-effect-shadow($corner) {
z-index: -1;
position: absolute;
@antsa
antsa / hyphens.scss
Created August 23, 2011 07:33
Hyphens @mixin for Compass
// Provides a mixin to define hyphenation
//
// Requires Compass
//
// (http://blog.fontdeck.com/post/9037028497/hyphens)
// (http://www.w3.org/TR/css3-text/#hyphenation)
//
// $value - The hyphenation property value. One of "none", "manual", "auto" or "all"
//
// Example .scss: