Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Generated by SassMeister.com.
// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----
$initial_selector: (".directory")
$new_selector: ()
$final_selector: ()
$result: ()
$base-padding: 66px
$base-arrow: 48px
$base-folder: $base-padding
$distance-value: 22px
@for $i from 3 through 10
$selector: $initial_selector $final_selector
$final_selector: append($selector, $new_selector)
$result: #{$final_selector}
#{$initial_selector} #{$result} .name
padding-left: $base-padding + (($i - 3)*$distance-value)
@if $i > 3
#{$initial_selector} #{$result} .name .icon-arrow
left: $base-arrow + (($i - 4)*$distance-value)
#{$initial_selector} #{$result} .name .icon-folder
left: $base-folder + (($i - 4)*$distance-value)
.directory .directory .name {
padding-left: 66px;
}
.directory .directory .directory .name {
padding-left: 88px;
}
.directory .directory .directory .name .icon-arrow {
left: 48px;
}
.directory .directory .directory .name .icon-folder {
left: 66px;
}
.directory .directory .directory .directory .name {
padding-left: 110px;
}
.directory .directory .directory .directory .name .icon-arrow {
left: 70px;
}
.directory .directory .directory .directory .name .icon-folder {
left: 88px;
}
.directory .directory .directory .directory .directory .name {
padding-left: 132px;
}
.directory .directory .directory .directory .directory .name .icon-arrow {
left: 92px;
}
.directory .directory .directory .directory .directory .name .icon-folder {
left: 110px;
}
.directory .directory .directory .directory .directory .directory .name {
padding-left: 154px;
}
.directory .directory .directory .directory .directory .directory .name .icon-arrow {
left: 114px;
}
.directory .directory .directory .directory .directory .directory .name .icon-folder {
left: 132px;
}
.directory .directory .directory .directory .directory .directory .directory .name {
padding-left: 176px;
}
.directory .directory .directory .directory .directory .directory .directory .name .icon-arrow {
left: 136px;
}
.directory .directory .directory .directory .directory .directory .directory .name .icon-folder {
left: 154px;
}
.directory .directory .directory .directory .directory .directory .directory .directory .name {
padding-left: 198px;
}
.directory .directory .directory .directory .directory .directory .directory .directory .name .icon-arrow {
left: 158px;
}
.directory .directory .directory .directory .directory .directory .directory .directory .name .icon-folder {
left: 176px;
}
.directory .directory .directory .directory .directory .directory .directory .directory .directory .name {
padding-left: 220px;
}
.directory .directory .directory .directory .directory .directory .directory .directory .directory .name .icon-arrow {
left: 180px;
}
.directory .directory .directory .directory .directory .directory .directory .directory .directory .name .icon-folder {
left: 198px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.