[Docs] Document the enumerate helper.
This commit is contained in:
parent
7acd09b1a0
commit
45785b7561
7
doc-src/content/examples/compass/helpers/enumerate.haml
Normal file
7
doc-src/content/examples/compass/helpers/enumerate.haml
Normal file
@ -0,0 +1,7 @@
|
||||
---
|
||||
title: "Compass Helper: enumerate"
|
||||
description: How to use the enumerate() helper function.
|
||||
framework: compass
|
||||
example: true
|
||||
---
|
||||
= render "partials/example"
|
@ -0,0 +1,6 @@
|
||||
.example
|
||||
.class-1 .class-1
|
||||
.class-2 .class-2
|
||||
.class-3 .class-3
|
||||
.class-4 .class-4
|
||||
.class-5 .class-5
|
@ -0,0 +1,8 @@
|
||||
.example
|
||||
#{enumerate(".class", 2, 4)}
|
||||
background-color: #aaa
|
||||
border: 2px solid #777
|
||||
margin: 1em
|
||||
@for $i from 2 through 4
|
||||
.class-#{$i}
|
||||
margin-left: 1em * ($i - 1)
|
@ -0,0 +1,7 @@
|
||||
---
|
||||
title: "Using @extend in place of the enumerate() helper."
|
||||
description: Using @extend in place of the enumerate() helper.
|
||||
framework: compass
|
||||
example: true
|
||||
---
|
||||
= render "partials/example"
|
@ -0,0 +1,6 @@
|
||||
.example
|
||||
.class-1 .class-1
|
||||
.class-2 .class-2
|
||||
.class-3 .class-3
|
||||
.class-4 .class-4
|
||||
.class-5 .class-5
|
@ -0,0 +1,9 @@
|
||||
.example
|
||||
.base-class
|
||||
background-color: #aaa
|
||||
border: 2px solid #777
|
||||
margin: 1em
|
||||
@for $i from 2 through 4
|
||||
.class-#{$i}
|
||||
@extend .base-class
|
||||
margin-left: 1em * ($i - 1)
|
@ -14,3 +14,8 @@ layout: core
|
||||
:markdown
|
||||
The compass helpers are functions that augment the [functions provided
|
||||
by Sass](http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html).
|
||||
|
||||
All Helpers:
|
||||
|
||||
* [elements-of-type](/docs/reference/compass/helpers/display/)
|
||||
* [enumerate](/docs/reference/compass/helpers/enumerate/)
|
||||
|
@ -22,7 +22,7 @@ classnames:
|
||||
the elements listed to the right.
|
||||
%dl
|
||||
%dg.head
|
||||
%dt Default Display
|
||||
%dt Display Value
|
||||
%dd Elements Returned
|
||||
- display_map = Compass::SassExtensions::Functions::Display::DEFAULT_DISPLAY
|
||||
- display_map.keys.each do |key|
|
||||
|
30
doc-src/content/reference/compass/helpers/enumerate.haml
Normal file
30
doc-src/content/reference/compass/helpers/enumerate.haml
Normal file
@ -0,0 +1,30 @@
|
||||
---
|
||||
title: Compass Enumeration Helpers
|
||||
crumb: Enumerate
|
||||
framework: compass
|
||||
meta_description: Helper functions for enumerating.
|
||||
layout: core
|
||||
classnames:
|
||||
- reference
|
||||
- core
|
||||
- helpers
|
||||
---
|
||||
%h1 Compass Enumerate Helper
|
||||
|
||||
#enumerate.helper
|
||||
%h3
|
||||
%a(href="#enumerate")
|
||||
enumerate(<span class="arg">$prefix</span>, <span class="arg">$from</span>, <span class="arg">$through</span>, <span class="arg" data-default-value='-'>$separator</span>)
|
||||
.details
|
||||
%p
|
||||
Enumerate the given <code>$prefix</code> from <code>$from</code> through <code>$through</code>.
|
||||
%p <em>Note:</em> Using the <code>@extend</code> directive is usually preferred to this helper, which was created before <code>@extend</code> existed.
|
||||
.examples
|
||||
%h4 Examples
|
||||
%ul
|
||||
%li
|
||||
%a(href="/docs/examples/compass/helpers/enumerate/") Example of enumerate
|
||||
%li
|
||||
%a(href="/docs/examples/compass/helpers/using-extend-in-place-of-enumerate/") Example of using <code>@extend</code> in place of enumerate
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user