Skip to content

Instantly share code, notes, and snippets.

@timseverien
Last active August 29, 2015 14:13
Show Gist options
  • Save timseverien/e9f24e5f5dceed66c2d5 to your computer and use it in GitHub Desktop.
Save timseverien/e9f24e5f5dceed66c2d5 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class="output"></div>
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----
/****************************************************************
* SCALE A PATH
****************************************************************/
@function scale($path, $scale) {
@for $n from 1 through length($path) {
$coords: nth($path, $n);
$path: nth-set($path, $n, (
nth($coords, 1) * $scale,
nth($coords, 2) * $scale
));
}
@return $path;
}
/****************************************************************
* TRANSLATE A PATH
****************************************************************/
@function translate($path, $x, $y) {
@for $n from 1 through length($path) {
$coords: nth($path, $n);
$path: nth-set($path, $n, (
nth($coords, 1) + $x,
nth($coords, 2) + $y
));
}
@return $path;
}
@function render-polygon($polygon, $size) {
}
/****************************************************************
* RENDER THE WHOLE THING
****************************************************************/
@mixin render($polygons, $size) {
$shadows: null;
@each $polygon in $polygons {
$shadows: join($shadows, render-polygon($polygon, $size), comma);
}
background-color: transparent;
box-shadow: $shadows;
height: 1px;
width: 1px;
}
/****************************************************************
* CREATE SHAPES
****************************************************************/
$square: (
(0, 0), (1, 0),
(1, 1), (0, 1)
);
$triangle: (
(0.5, 0),
(1, 1), (0, 1)
);
/****************************************************************
* CREATE PATHS
****************************************************************/
$paths: (
translate(scale($square, 100), 100, 0),
scale($triangle, 100)
);
// .output { @include render($paths, (200, 200)); }
List index is 2 but list is only 1 item long for `nth'
<div class="output"></div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment