pattern-lab / styleguidekit-mustache-default

The default Mustache StyleguideKit provides the basic front-end assets when using the Mustache PatternEngine.
http://patternlab.io/
MIT License
1 stars 10 forks source link

More refined looping through viewall #4

Open bradfrost opened 6 years ago

bradfrost commented 6 years ago

In order to accomplish the desired UI for a whole bunch of things, I'm trying to make changes to the markup for viewall.mustache. Right now, it's looping through {{# partials }}, but it appears to be looping through in a pretty flat manner. Right now it looks something like this:

{{# partials }}
{{# patternSectionSubtype }}
{{> patternSectionSubtype }}
{{/ patternSectionSubtype }}
{{^ patternSectionSubtype }}
{{> patternSection }}
{{/ patternSectionSubtype }}
{{/ partials }}

This basically checks if it's a category header or if it's a pattern, and prints out either the category header or the pattern.

What I'm trying to accomplish is something that's a bit more nuanced (taking some liberties on the nam:


{{# partials }}
<section class="pl-c-category">

    {{> patternCategoryHeader }}

        <div class="pl-c-category__body">

        <ul class="pl-c-pattern-list">
        {{# patternsWithinCategory }}

            <li class="pl-c-pattern-list__item">
                {{> patternPartial }}
            </li><!--end pl-c-pattern-list__item-->

        {{/ patternsWithinCategory }}
        </ul><!--end pl-c-pattern-list-->

        </div><!--end pl-c-category__body-->

</section><!--end pl-c-pattern-category-->
{{/ partials }}

The idea is that each category of pattern (i.e. molecules > forms) would be displayed as its own section, and would contain a section header containing the category title and optional description, followed by a list of all the patterns contained in that category.

So my question is, how can I achieve this? I know that the Pattern Lab nav is able to loop through things in a nuanced/layered way. So I'm hoping it's a matter of wording or light restructuring vs something crazy.

/cc @bmuenzenmeyer @EvanLovely

bmuenzenmeyer commented 6 years ago

@bradfrost do you see this as part of https://github.com/pattern-lab/styleguidekit-assets-default/issues/104 or a more immediate need? Trying to play traffic cop with my attenion-span 😸

bradfrost commented 6 years ago

@bradfrost do you see this as part of pattern-lab/styleguidekit-assets-default#104 or a more immediate need? Trying to play traffic cop with my attenion-span 😸

Definitely don't want to split your attention any more than it already is! This is mostly part of the storefront discussion, although it has implications beyond that.