Skip to content

Instantly share code, notes, and snippets.

@stowball
Created February 22, 2015 23:46
Show Gist options
  • Select an option

  • Save stowball/69b512500a63f35018e0 to your computer and use it in GitHub Desktop.

Select an option

Save stowball/69b512500a63f35018e0 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----
$camp-prog-co1-snapshot: (
name: 'camp-prog-co1-snapshot',
x: 0px,
y: 40px,
offset_x: 0px,
offset_y: -40px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co1: (
name: 'camp-prog-co1',
x: 395px,
y: 80px,
offset_x: -395px,
offset_y: -80px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co2-snapshot: (
name: 'camp-prog-co2-snapshot',
x: 395px,
y: 40px,
offset_x: -395px,
offset_y: -40px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co2: (
name: 'camp-prog-co2',
x: 0px,
y: 240px,
offset_x: 0px,
offset_y: -240px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co3-snapshot: (
name: 'camp-prog-co3-snapshot',
x: 0px,
y: 80px,
offset_x: 0px,
offset_y: -80px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co3: (
name: 'camp-prog-co3',
x: 0px,
y: 120px,
offset_x: 0px,
offset_y: -120px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co4-snapshot: (
name: 'camp-prog-co4-snapshot',
x: 0px,
y: 160px,
offset_x: 0px,
offset_y: -160px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co4: (
name: 'camp-prog-co4',
x: 0px,
y: 200px,
offset_x: 0px,
offset_y: -200px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co5-snapshot: (
name: 'camp-prog-co5-snapshot',
x: 0px,
y: 0px,
offset_x: 0px,
offset_y: 0px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co5: (
name: 'camp-prog-co5',
x: 0px,
y: 280px,
offset_x: 0px,
offset_y: -280px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co6-snapshot: (
name: 'camp-prog-co6-snapshot',
x: 0px,
y: 320px,
offset_x: 0px,
offset_y: -320px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-co6: (
name: 'camp-prog-co6',
x: 395px,
y: 0px,
offset_x: -395px,
offset_y: 0px,
width: 395px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp0: (
name: 'camp-prog-cp0',
x: 0px,
y: 560px,
offset_x: 0px,
offset_y: -560px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1-a: (
name: 'camp-prog-cp1-a',
x: 583px,
y: 440px,
offset_x: -583px,
offset_y: -440px,
width: 204px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1-b-delivery: (
name: 'camp-prog-cp1-b-delivery',
x: 720px,
y: 200px,
offset_x: -720px,
offset_y: -200px,
width: 54px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1-b: (
name: 'camp-prog-cp1-b',
x: 720px,
y: 120px,
offset_x: -720px,
offset_y: -120px,
width: 70px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1-c: (
name: 'camp-prog-cp1-c',
x: 720px,
y: 160px,
offset_x: -720px,
offset_y: -160px,
width: 54px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1-snapshot: (
name: 'camp-prog-cp1-snapshot',
x: 516px,
y: 480px,
offset_x: -516px,
offset_y: -480px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1-test: (
name: 'camp-prog-cp1-test',
x: 395px,
y: 240px,
offset_x: -395px,
offset_y: -240px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp1: (
name: 'camp-prog-cp1',
x: 258px,
y: 520px,
offset_x: -258px,
offset_y: -520px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp2-snapshot: (
name: 'camp-prog-cp2-snapshot',
x: 516px,
y: 520px,
offset_x: -516px,
offset_y: -520px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp2: (
name: 'camp-prog-cp2',
x: 0px,
y: 520px,
offset_x: 0px,
offset_y: -520px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp3-snapshot: (
name: 'camp-prog-cp3-snapshot',
x: 258px,
y: 560px,
offset_x: -258px,
offset_y: -560px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp3: (
name: 'camp-prog-cp3',
x: 325px,
y: 440px,
offset_x: -325px,
offset_y: -440px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp4-snapshot: (
name: 'camp-prog-cp4-snapshot',
x: 0px,
y: 480px,
offset_x: 0px,
offset_y: -480px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-cp4: (
name: 'camp-prog-cp4',
x: 258px,
y: 480px,
offset_x: -258px,
offset_y: -480px,
width: 258px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf1-snapshot: (
name: 'camp-prog-sf1-snapshot',
x: 395px,
y: 320px,
offset_x: -395px,
offset_y: -320px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf1: (
name: 'camp-prog-sf1',
x: 0px,
y: 360px,
offset_x: 0px,
offset_y: -360px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf2-snapshot: (
name: 'camp-prog-sf2-snapshot',
x: 325px,
y: 360px,
offset_x: -325px,
offset_y: -360px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf2: (
name: 'camp-prog-sf2',
x: 0px,
y: 400px,
offset_x: 0px,
offset_y: -400px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf3-snapshot: (
name: 'camp-prog-sf3-snapshot',
x: 325px,
y: 400px,
offset_x: -325px,
offset_y: -400px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf3: (
name: 'camp-prog-sf3',
x: 395px,
y: 280px,
offset_x: -395px,
offset_y: -280px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf4-snapshot: (
name: 'camp-prog-sf4-snapshot',
x: 395px,
y: 200px,
offset_x: -395px,
offset_y: -200px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf4: (
name: 'camp-prog-sf4',
x: 395px,
y: 160px,
offset_x: -395px,
offset_y: -160px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf5-snapshot: (
name: 'camp-prog-sf5-snapshot',
x: 395px,
y: 120px,
offset_x: -395px,
offset_y: -120px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-sf5: (
name: 'camp-prog-sf5',
x: 0px,
y: 440px,
offset_x: 0px,
offset_y: -440px,
width: 325px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-tr1-snapshot: (
name: 'camp-prog-tr1-snapshot',
x: 516px,
y: 560px,
offset_x: -516px,
offset_y: -560px,
width: 181px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-tr1: (
name: 'camp-prog-tr1',
x: 0px,
y: 600px,
offset_x: 0px,
offset_y: -600px,
width: 181px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-tr2-snapshot: (
name: 'camp-prog-tr2-snapshot',
x: 181px,
y: 600px,
offset_x: -181px,
offset_y: -600px,
width: 181px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-tr2: (
name: 'camp-prog-tr2',
x: 362px,
y: 600px,
offset_x: -362px,
offset_y: -600px,
width: 181px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-tr3-snapshot: (
name: 'camp-prog-tr3-snapshot',
x: 543px,
y: 600px,
offset_x: -543px,
offset_y: -600px,
width: 181px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog-tr3: (
name: 'camp-prog-tr3',
x: 0px,
y: 640px,
offset_x: 0px,
offset_y: -640px,
width: 181px,
height: 40px,
total_width: 790px,
total_height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721'
);
$camp-prog: (
width: 790px,
height: 680px,
image: '../img/gend/misc/camp-prog.png?150220162721',
sprites: $camp-prog-co1-snapshot $camp-prog-co1 $camp-prog-co2-snapshot $camp-prog-co2 $camp-prog-co3-snapshot $camp-prog-co3 $camp-prog-co4-snapshot $camp-prog-co4 $camp-prog-co5-snapshot $camp-prog-co5 $camp-prog-co6-snapshot $camp-prog-co6 $camp-prog-cp0 $camp-prog-cp1-a $camp-prog-cp1-b-delivery $camp-prog-cp1-b $camp-prog-cp1-c $camp-prog-cp1-snapshot $camp-prog-cp1-test $camp-prog-cp1 $camp-prog-cp2-snapshot $camp-prog-cp2 $camp-prog-cp3-snapshot $camp-prog-cp3 $camp-prog-cp4-snapshot $camp-prog-cp4 $camp-prog-sf1-snapshot $camp-prog-sf1 $camp-prog-sf2-snapshot $camp-prog-sf2 $camp-prog-sf3-snapshot $camp-prog-sf3 $camp-prog-sf4-snapshot $camp-prog-sf4 $camp-prog-sf5-snapshot $camp-prog-sf5 $camp-prog-tr1-snapshot $camp-prog-tr1 $camp-prog-tr2-snapshot $camp-prog-tr2 $camp-prog-tr3-snapshot $camp-prog-tr3
);
@mixin sprite-image($sprite) {
background-image: url(map-get($sprite, 'image'));
}
@mixin sprite-position($sprite) {
background-position: map-get($sprite, 'offset_x') map-get($sprite, 'offset_y');
}
@mixin sprite-height($sprite) {
height: map-get($sprite, 'height');
}
@mixin sprite-width($sprite) {
width: map-get($sprite, 'width');
}
@mixin sprite($sprite, $output-position: false, $output-image: false, $output-dimensions: false) {
.#{map-get($sprite, 'name')} {
@if ($output-image == true) {
@include sprite-image($sprite);
}
@if ($output-position == true) {
@include sprite-position($sprite);
}
@if ($output-dimensions == true) {
@include sprite-height($sprite);
@include sprite-width($sprite);
}
}
}
@mixin sprites-list-selector($sprites, $output-image: false, $output-dimensions: false) {
$sprites-map: map-get($sprites, 'sprites');
$selectors: ();
$first-sprite: false;
$first-loop: true;
@each $sprite in $sprites-map {
$selectors: append($selectors, '.' + map-get($sprite, 'name'), comma);
@if ($first-loop == true) {
$first-loop: false;
$first-sprite: $sprite;
}
}
@if ($output-image == true) OR ($output-dimensions == true) {
#{$selectors} {
@if ($output-image == true) {
@include sprite-image($first-sprite);
}
@if ($output-dimensions == true) {
@include sprite-height($first-sprite);
@include sprite-width($first-sprite);
}
}
}
}
@mixin sprites($sprites) {
$sprites-map: map-get($sprites, 'sprites');
@each $sprite in $sprites-map {
$sprite-name: map-get($sprite, 'name');
@include sprite($sprite, true);
}
}
@mixin sprites-all($sprites, $output-image: false, $output-dimensions: false) {
@include sprites-list-selector($sprites, $output-image, $output-dimensions);
@include sprites($sprites);
}
.camp-prog-co1 {
@include sprite-width($camp-prog-co1);
@include sprite-height($camp-prog-co1);
@include sprite-image($camp-prog-co1);
@include sprite-position($camp-prog-co1);
}
/* 1-------------------------------------- */
@include sprite($camp-prog-co1, true, true, true);
/* 2-------------------------------------- */
@include sprites-all($camp-prog, true, true);
.camp-prog-co1 {
width: 395px;
height: 40px;
background-image: url("../img/gend/misc/camp-prog.png?150220162721");
background-position: -395px -80px;
}
/* 1-------------------------------------- */
.camp-prog-co1 {
background-image: url("../img/gend/misc/camp-prog.png?150220162721");
background-position: -395px -80px;
height: 40px;
width: 395px;
}
/* 2-------------------------------------- */
.camp-prog-co1-snapshot, .camp-prog-co1, .camp-prog-co2-snapshot, .camp-prog-co2, .camp-prog-co3-snapshot, .camp-prog-co3, .camp-prog-co4-snapshot, .camp-prog-co4, .camp-prog-co5-snapshot, .camp-prog-co5, .camp-prog-co6-snapshot, .camp-prog-co6, .camp-prog-cp0, .camp-prog-cp1-a, .camp-prog-cp1-b-delivery, .camp-prog-cp1-b, .camp-prog-cp1-c, .camp-prog-cp1-snapshot, .camp-prog-cp1-test, .camp-prog-cp1, .camp-prog-cp2-snapshot, .camp-prog-cp2, .camp-prog-cp3-snapshot, .camp-prog-cp3, .camp-prog-cp4-snapshot, .camp-prog-cp4, .camp-prog-sf1-snapshot, .camp-prog-sf1, .camp-prog-sf2-snapshot, .camp-prog-sf2, .camp-prog-sf3-snapshot, .camp-prog-sf3, .camp-prog-sf4-snapshot, .camp-prog-sf4, .camp-prog-sf5-snapshot, .camp-prog-sf5, .camp-prog-tr1-snapshot, .camp-prog-tr1, .camp-prog-tr2-snapshot, .camp-prog-tr2, .camp-prog-tr3-snapshot, .camp-prog-tr3 {
background-image: url("../img/gend/misc/camp-prog.png?150220162721");
height: 40px;
width: 395px;
}
.camp-prog-co1-snapshot {
background-position: 0px -40px;
}
.camp-prog-co1 {
background-position: -395px -80px;
}
.camp-prog-co2-snapshot {
background-position: -395px -40px;
}
.camp-prog-co2 {
background-position: 0px -240px;
}
.camp-prog-co3-snapshot {
background-position: 0px -80px;
}
.camp-prog-co3 {
background-position: 0px -120px;
}
.camp-prog-co4-snapshot {
background-position: 0px -160px;
}
.camp-prog-co4 {
background-position: 0px -200px;
}
.camp-prog-co5-snapshot {
background-position: 0px 0px;
}
.camp-prog-co5 {
background-position: 0px -280px;
}
.camp-prog-co6-snapshot {
background-position: 0px -320px;
}
.camp-prog-co6 {
background-position: -395px 0px;
}
.camp-prog-cp0 {
background-position: 0px -560px;
}
.camp-prog-cp1-a {
background-position: -583px -440px;
}
.camp-prog-cp1-b-delivery {
background-position: -720px -200px;
}
.camp-prog-cp1-b {
background-position: -720px -120px;
}
.camp-prog-cp1-c {
background-position: -720px -160px;
}
.camp-prog-cp1-snapshot {
background-position: -516px -480px;
}
.camp-prog-cp1-test {
background-position: -395px -240px;
}
.camp-prog-cp1 {
background-position: -258px -520px;
}
.camp-prog-cp2-snapshot {
background-position: -516px -520px;
}
.camp-prog-cp2 {
background-position: 0px -520px;
}
.camp-prog-cp3-snapshot {
background-position: -258px -560px;
}
.camp-prog-cp3 {
background-position: -325px -440px;
}
.camp-prog-cp4-snapshot {
background-position: 0px -480px;
}
.camp-prog-cp4 {
background-position: -258px -480px;
}
.camp-prog-sf1-snapshot {
background-position: -395px -320px;
}
.camp-prog-sf1 {
background-position: 0px -360px;
}
.camp-prog-sf2-snapshot {
background-position: -325px -360px;
}
.camp-prog-sf2 {
background-position: 0px -400px;
}
.camp-prog-sf3-snapshot {
background-position: -325px -400px;
}
.camp-prog-sf3 {
background-position: -395px -280px;
}
.camp-prog-sf4-snapshot {
background-position: -395px -200px;
}
.camp-prog-sf4 {
background-position: -395px -160px;
}
.camp-prog-sf5-snapshot {
background-position: -395px -120px;
}
.camp-prog-sf5 {
background-position: 0px -440px;
}
.camp-prog-tr1-snapshot {
background-position: -516px -560px;
}
.camp-prog-tr1 {
background-position: 0px -600px;
}
.camp-prog-tr2-snapshot {
background-position: -181px -600px;
}
.camp-prog-tr2 {
background-position: -362px -600px;
}
.camp-prog-tr3-snapshot {
background-position: -543px -600px;
}
.camp-prog-tr3 {
background-position: 0px -640px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment