Skip to content

Latest commit

 

History

History
29 lines (23 loc) · 1.83 KB

index.md

File metadata and controls

29 lines (23 loc) · 1.83 KB
layout
default

Site Components

We were so inspired by 10up's Component library that we decided to build our own. Since 10up opensourced their component library, we've taken the parts about it that we love and incorporated it to work really well with our new starter theme.

Our setup

Our setup is most likely different from yours, so there will be some difference in how we handle some things from what you might prefer. We have tried to implement an overall structure that can be utilized within different formats. For example, we are switching to working primarily with Timber and Twig for building our these. You will see markup snippets for each component with Twig samples.

We also use Advanced Custom Fields (ACF) for handling all of our custom fields. For components that might require some ACF fields, we will be providing the field IDs that will work with the code snippets and the types of fields that we recommend.

One other thing that you might notice that is strange is the way we write our classes. We have been following the Suit CSS methodology. We find it more readable and follows the component structure found in many new Javascript libraries.

{% for category in site.data.categories %}

{{category.pretty}}

    {% for component in site.component %} {% if component.category == category.slug %}
  • {{ component.title }}
  • {% endif %} {% endfor %}
{% endfor %}