{% if printview != 'detailedview' %}
  <div class="color-swatch">
    <div class="swatch-info">
       <svg width="100%" height="100%" class="color-swatch-svg" xmlns="http://www.w3.org/2000/svg">
        <rect fill="rgb{{ color_block.color.rgb }}" stroke="rgb(192, 192, 192)" stroke-width="1px" width="100%" height="100%" />
        <text fill="rgb{{ color_block.color.font_color }}">
            <tspan dy="1.2em" x="2mm" y="2mm" class="color-name">{{ _('Color') }}: </tspan><tspan data-field-name="color-{{ color_block.color.hex_digits }}">{{ color_block.color.name }}</tspan>
            {# We don't want to see rgb if we have more than 7 colorSwatches #}
            {% if color_blocks|length < 7 %}
            <tspan dy="1.2em" x="2mm" class="color-rgb">{{ _('rgb') }}: {{ color_block.color.rgb }}</tspan>
            {% endif %}
            {# We don't want to see thread_used if we have more than 7 colorSwatches to show #}
            {% if color_blocks|length < 7 %}
            <tspan dy="1.2em" x="2mm" class="swatch-thread" data-field-name="thread-{{ color_block.color.hex_digits }}">{{ _('thread') }}: {{ color_block.color.manufacturer }} {{ "#" + color_block.color.number if color_block.color.number }}</tspan>
            {% endif %}
            {# We don't want to see num_stitch if we have more than 49 colorSwatches to show #}
            {% if color_blocks|length < 49 %}
            <tspan dy="1.2em" x="2mm" class="swatch-stitches">{{ _('# stitches') }}: {{ color_block.num_stitches }}</tspan>
            {% endif %}
            {# We don't want to see stops and trims if we have more than 13 colorSwatches to show #}
            {% if color_blocks|length < 13 %}
            <tspan dy="1.2em" x="2mm" class="swatch-stops">{{ _('# stops') }}: {{ color_block.num_stops }}</tspan>
            <tspan dy="1.2em" x="2mm" class="swatch-trims">{{ _('# trims') }}: {{ color_block.num_trims }}</tspan>
            {% endif %}
          </text>
      </svg>
    </div>
  </div>

  {% else %}

  <div class="color-swatch">
    <div class="swatch-info">
       <svg width="100%" height="100%" class="colorSwatchSVG" xmlns="http://www.w3.org/2000/svg">
        <rect fill="rgb{{ color_block.color.rgb }}" stroke="rgb(192, 192, 192)" width="40mm" height="100%" />
       </svg>
       <div class="color-info">
        <div>
          <p><span class="color-name">{{ _('Color') }}:</span><span data-field-name="color-{{ color_block.color.hex_digits }}" contenteditable="true" data-placeholder="Enter thread name...">{{ color_block.color.name }}</span></p>
          <p><span class="color-rgb">{{ _('rgb') }}:</span><span>{{ color_block.color.rgb }}</span></p>
          <p><span class="swatch-thread">{{ _('thread') }}:</span><span data-field-name="thread-{{ color_block.color.hex_digits }}" contenteditable="true">{{ color_block.color.manufacturer }} {{ "#" + color_block.color.number if color_block.color.number }}</span></p>
          <p><span class="swatch-stitches">{{ _('# stitches') }}:</span><span>{{ color_block.num_stitches }}</span></p>
          <p><span class="swatch-stops">{{ _('# stops') }}:</span><span>{{ color_block.num_stops }}</span></p>
          <p><span class="swatch-trims">{{ _('# trims') }}:</span><span>{{ color_block.num_trims }}</span></p>
        </div>
      </div>
    </div>
  </div>

  {%endif %}