/** * This file contains generic mixins which we use throughout * the admin panels. * * Mixins should be stored here rather than individual files * so that we can keep. */ /** ---------------------------------------------------- * Hides the overflowing text from a container * * Note: you must define a width on the element with this * overflow. * ----------------------------------------------------- */ @mixin hide-text-overflow { overflow: hidden; white-space: nowrap; // could optionally use the compass mixin but that // would require a 3rd party plugin text-overflow: ellipsis; o-text-overflow: ellipsis; } /** ---------------------------------------------------- * Clear the properties of sub form fields. * * Often needed for nested form fields and * ----------------------------------------------------- */ @mixin clear-form-field-styles { .field { padding: 0; border: 0; } label { float: none; width: auto; } .middleColumn { margin-left: 0; } } /** ---------------------------------------------------- * Double tone borders * * http://daverupert.com/2011/06/two-tone-borders-with-css3/ * ----------------------------------------------------- */ @mixin doubleborder($side, $innerColor, $outerColor) { $shadow: "0 0 0"; border-#{$side}: 1px solid $innerColor; @if ($side == "top") { $shadow: 0 -1px 0; } @if ($side == "right") { $shadow: 1px 0 0; } @if ($side == "bottom") { $shadow: 0 1px 0; } @if ($side == "left") { $shadow: -1px 0 0; } -webkit-box-shadow: $shadow $outerColor; -moz-box-shadow: $shadow $outerColor; -o-box-shadow: $shadow $outerColor; box-shadow: $shadow $outerColor; }