summaryrefslogtreecommitdiff
path: root/app/assets/stylesheets/vendor/survival-kit/_images.scss
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/stylesheets/vendor/survival-kit/_images.scss')
-rw-r--r--app/assets/stylesheets/vendor/survival-kit/_images.scss121
1 files changed, 0 insertions, 121 deletions
diff --git a/app/assets/stylesheets/vendor/survival-kit/_images.scss b/app/assets/stylesheets/vendor/survival-kit/_images.scss
deleted file mode 100644
index 36e67cd..0000000
--- a/app/assets/stylesheets/vendor/survival-kit/_images.scss
+++ /dev/null
@@ -1,121 +0,0 @@
-// Survival ✚ Kit
-
-@import "compass/typography/text/replacement";
-
-// Replace an A tag with an a background-image.
-// @var $image string path to the image
-// @var $inline boolean embed via data.
-@mixin image-link($image, $inline:false) {
- @include image-background($image, $inline);
- cursor:pointer;
- @extend .ext-hide-text;
-}
-
-// Replace an A tag with an a background-image sprite. You need to provide it with
-// the dimentions of the image and the x-pos/y-pos
-//
-// @var $image string path to the image, inherit is useful.
-// @var $height width
-// @var $height pixels
-// @var $x-pos pixels
-// @var $y-pos pixels
-// @var $inline boolean embed via data.
-@mixin image-sprite-link($image, $width, $height, $x-pos, $y-pos, $inline: false) {
- @include sk-background(transparent, $image, $x-pos, $y-pos, no-repeat, $inline);
- width:$width;
- height:$height;
- @extend .ext-hide-text;
-}
-
-// Replace a Header>a tag with a background image. Made specifically for logos.
-// @var $image string path to the image
-// @var $inline boolean embed via data.
-@mixin logo($image, $inline:false) {
- @include no-mp;
- width: image-width($image);
- height: image-height($image);
- a {
- @include image-link($image, $inline);
- &:hover { opacity: 0.7;}
- }
-}
-
-// Area for a header link, meant to be used when it inherits a background image.
-// This should be invoked on the H1-6 Tag and not in the link, the needed structure is:2
-// <h1><a href=""></a></h1>
-@mixin logo-area($width, $height, $debugging: false) {
- @include no-mp;
- width:$width;
- height:$height;
- a {
- @include link-area($width, $height, $debugging);
- }
-}
-
-// An area which should be clickable. It's meant to be a low level mixin, you should
-// use the alternatuves.
-// - debugging enables a background color to know the position.
-@mixin link-area($width, $height, $debugging: false) {
- width:$width;
- height:$height;
- @if $debugging {
- @include debug($debugging);
- }
- @extend .ext-hide-text;
-}
-
-// Mixin for quickly replacing images for any given element.
-// @var $image string path to the image
-// @var $inline boolean embed via data.
-@mixin image-replace($image, $inline:false) {
- @include image-background($image, $inline);
- @extend .ext-hide-text;
-}
-@mixin image-replace-url($image, $width, $height) {
- background:transparent url($image) left top no-repeat;
- @include link-area($width, $height);
-}
-
-// Just adds the image as a background and sets the width/height accordingly.
-// @var $image string path to the image
-// @var $inline boolean embed via data.
-@mixin image-background($image, $inline:false) {
- @include sk-background(transparent, $image, no-repeat, top, left, $inline);
- width: image-width($image);
- height: image-height($image);
-}
-
-// Add a background by passing the exact same parameters as a normal one. With
-// one more parameter $inline. Which will use inline-image and add backward
-// compatibility to IE7 via *background.
-//
-// @var $color
-// @var $image string can be a path to an image or inherit (will insert tags separately)
-// @var $horizontal
-// @var $vertical
-// @var $repeat
-// @var $inline
-@mixin sk-background($color, $image, $horizontal, $vertical, $repeat, $inline: false) {
- @if $image == inherit {
- background-color: $color;
- background-repeat: $repeat;
- background-position: $horizontal $vertical;
- } @else {
- @if $inline == true {
- background : $color inline-image($image) $horizontal $vertical $repeat;
- *background : $color image-url($image) $horizontal $vertical $repeat;
- } @else {
- background: $color image-url($image) $horizontal $vertical $repeat;
- }
- }
-}
-
-
-// Common styles needed by our Image Mixins.
-// Depends on Compass.
-.ext-hide-text {
- @include hide-text;
- display:block;
- direction: ltr;
- outline:none;
-}