JTannerShaw.github.io/_includes/section-skills.html

{% assign content = site.data.content['skills'] %}

{% for column in content.columns %}
<!-- Section Design Skills -->
<div class="section skills" id="section-skills-{{ column.slug }}">
  <div class="content">

    <!-- title -->
    <div class="titles">
      <div class="title">{{ column.title }}</div>
      <div class="subtitle">{{ column.subtitle }}</div>
    </div>

    <!-- skills items -->
    <div class="skills {% if column.type %} {{ column.type }}{% endif %}">
      <ul>
        {% if column.type == 'default' %}
				{% for item in column.items %}
				<li>
					<div class="name">{{ item.label }}</div>
          <div class="single-post-text">
            <p>{{ item.text }}</p>
          </div>
					<!-- <div class="progress">
						<div class="percentage" style="width:{{ item.value }}%;">
							<span class="percent">{{ item.value }}%</span>
						</div>
					</div> -->
				</li>
				{% endfor %}
				{% endif %}

				{% if column.type == 'dotted' %}
				{% for item in column.items %}
				<li>
					<div class="name">{{ item.label }}</div>
          <div class="single-post-text">
            <p>{{ item.text }}</p>
          </div>
					<div class="progress">
						<div class="percentage" style="width: {{ item.value }}%;">
							<span class="percent">{{ item.value }}%</span>
						</div>
					</div>
				</li>
				{% endfor %}
				{% endif %}

				{% if column.type == 'circles' %}
				{% for item in column.items %}
				<li>
					<div class="progress p{{ item.value }}">
						<div class="percentage"></div>
						<span>{{ item.value }}%</span>
					</div>
          <div class="name">{{ item.label }}</div>
          <div class="single-post-text">
            <p>{{ item.text }}</p>
          </div>
				</li>
				{% endfor %}
				{% endif %}

      </ul>
    </div>

  </div>
</div>
{% endfor %}