silverstripe-framework/admin/scss/_mixins.scss

64 lines
1.7 KiB
SCSS

/**
* 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 {
display: inline;
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;
}