Skip to content

Instantly share code, notes, and snippets.

Miriam Suzanne mirisuzanne

Block or report user

Report or block mirisuzanne

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View flex-box.sass
=display-box
display: -webkit-box
display: -moz-box
display: box
// Value: horizontal | vertical | inline-axis | block-axis | inherit
// Initial: inline-axis
// Default: horizontal
=box-orient(!orient = "horizontal")
-webkit-box-orient= !orient
View _vertical_rhythm.sass
//** Vertical Rhythm **//
// By Chris Eppstein and Eric Meyer, living here on a temporary basis
// set the default border style for rhythm borders
!default_rhythm_border_style = "solid"
// The IE font ratio is a fact of life. Deal with it.
!ie_font_ratio = 16px / 100%
View _bubbles.sass
// CSS Speech Bubbles
// Based on the work of David DeSandro: http://desandro.com/resources/css-speech-bubble-icon/
// Compass Extension by Eric Meyer: http://www.oddbird.net/
// the color of the bubble
!default_bubble_color ||= #00f
// the color of any text in a text-bubble
!default_bubble_text_color ||= #fff
// the padding around any text in a text-bubble
View box-shadow.sass
$default-box-shadow-color : #333 !default
$default-box-shadow-h-offset : 1px !default
$default-box-shadow-v-offset : 1px !default
$default-box-shadow-blur : 5px !default
$default-box-shadow-spread : 0 !default
$default-box-shadow-inset : false !default
=box-shadow($color: $default-box-shadow-color, $hoff: $default-box-shadow-h-offset, $voff: $default-box-shadow-v-offset, $blur: $default-box-shadow-blur, $spread: $default-box-shadow-spread, $inset: $default-box-shadow-inset)
$full: $color $hoff $voff $blur $spread
@if $inset
View grid.sass
=x-omega($n, $context: false)
+float($omega-float)
width: columns($n, $context)
@if $context
margin-right: 0
@else
margin-right: side-gutter()
@if $hacks
+ie-omega($omega-float, true)
@mirisuzanne
mirisuzanne / _transform-v2.scss
Created Nov 5, 2010
compass transforms version 2
View _transform-v2.scss
@import "shared";
// Transform -----------------------------------------------------------------
// Apply a transform sent as a complete string.
@mixin apply-transform(
$transform,
$threeD: false
) {
@if $threeD {
@include experimental(transform, $transform,
View generategrid.scss
@import compass
@import base
=susygrid
$gutter-color: rgba(0,0,0,0)
$column-color: rgba(0,0,0,.25)
$start: side-gutter()
$grid: compact()
$grid: append($grid, $gutter-color $start, comma)
View generategrid.css
body {
background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(5%, rgba(0, 0, 0, 0.5)), color-stop(5%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0)));
background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0) 100%);
background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0) 100%);
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0) 100%);
-moz-background-size: 100% 1.5em;
-webkit-background-size: 100% 1.5em;
-o-background-size: 100% 1.5em;
background-size: 100% 1.5em;
background-position: left top;
View input-placeholder.sass
// Mixins ---------------------------------------------------------------
=placeholder-style
color: #777
// add your defaults here.
// if you need more than one style-group you can either create several mixins,
// or just name the style-groups and take a single style-group-name argument.
=apply-placeholders
&::-webkit-input-placeholder
View animation.scss
@mixin animate($animation, $time, $property, $value) {
@-moz-keyframes #{$animation} { #{$time} { #{$property}: $value; }};
}
You can’t perform that action at this time.