Added Texture Packer Pro tool entry (#252)

Ads Texture Packer Pro to the list alongside Free and Paid tags

Co-authored-by: TomSki <[email protected]>

Author: Raxorg

_includes/feature_row.html

@@ -0,0 +1,53 @@
+{% if include.id %}
+{% assign feature_row = page[include.id] %}
+{% else %}
+{% assign feature_row = page.feature_row %}
+{% endif %}
+
+<div class="feature__wrapper">
+
+    {% for f in feature_row %}
+    <div class="feature__item{% if include.type %}--{{ include.type }}{% endif %}">
+        <div class="archive__item">
+            {% if f.image_path %}
+            <div class="archive__item-teaser">
+                <img src="{{ f.image_path | relative_url }}"
+                     alt="{% if f.alt %}{{ f.alt }}{% endif %}">
+                {% if f.image_caption %}
+                <span class="archive__item-caption">{{ f.image_caption | markdownify | remove: "<p>" | remove: "</p>" }}</span>
+                {% endif %}
+            </div>
+            {% endif %}
+
+            <div class="archive__item-body">
+                {% if f.title %}
+                <h2 class="archive__item-title">
+                    {{ f.title }}
+                </h2>
+                {% endif %}
+
+                {% if f.tags %}
+                <div class="tools__item-tags">
+                    {% for tag in f.tags %}
+                    <span class="tools__item-tag tag--{{ tag | downcase | replace: ' ', '-' }}">
+                  {{ tag }}
+                </span>
+                    {% endfor %}
+                </div>
+                {% endif %}
+
+                {% if f.excerpt %}
+                <div class="archive__item-excerpt">
+                    {{ f.excerpt | markdownify }}
+                </div>
+                {% endif %}
+
+                {% if f.url %}
+                <p><a href="{{ f.url | relative_url }}" class="btn {{ f.btn_class }}">{{ f.btn_label | default: site.data.ui-text[site.locale].more_label | default: "Learn More" }}</a></p>
+                {% endif %}
+            </div>
+        </div>
+    </div>
+    {% endfor %}
+
+</div>

_pages/dev/tools.md

@@ -17,18 +17,21 @@ feature_row:
     url: "http://en.esotericsoftware.com/"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Paid"]
   - image_path: /assets/images/dev/tools/talos.jpg
     title: "Talos"
     excerpt: 'A node based, open source VFX Editor with powerful interface'
     url: "https://talosvfx.com"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
   - image_path: /assets/images/dev/tools/hyperlap.gif
     title: "HyperLap2D"
     excerpt: 'A visual editor for complex 2D worlds and scenes'
     url: "https://github.com/rednblackgames/HyperLap2D"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
 
 feature_row2:
   - image_path: /assets/images/dev/tools/gdx-liftoff.png
@@ -37,18 +40,21 @@ feature_row2:
     url: "/wiki/start/project-generation"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
   - image_path: /assets/images/dev/tools/skin_composer.png
     title: "Skin Composer"
     excerpt: "A skin creator for libGDX's scene2d.ui"
     url: "https://github.com/raeleus/skin-composer/wiki"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
   - image_path: /assets/images/dev/tools/particle_editor.png
     title: "Particle Editor"
     excerpt: 'A powerful tool for making 2D particle effects'
     url: "/wiki/tools/2d-particle-editor"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
 
 feature_row3:
   - image_path: /assets/images/dev/tools/flame.gif
@@ -57,18 +63,21 @@ feature_row3:
     url: "/wiki/graphics/3d/3d-particle-effects"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
   - image_path: /assets/images/dev/tools/hiero.png
     title: "Hiero"
     excerpt: 'A bitmap font packing tool compatible with libGDX'
     url: "/wiki/tools/hiero"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
   - image_path: /assets/images/dev/tools/fbx_conv.gif
     title: "fbx-conv"
     excerpt: 'A tool for converting 3D models to libGDX-friendly formats'
     url: "https://github.com/libgdx/fbx-conv"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
 
 feature_row4:
   - image_path: /assets/images/dev/tools/tiled.png
@@ -77,18 +86,30 @@ feature_row4:
     url: "https://www.mapeditor.org"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
   - image_path: /assets/images/dev/tools/texture_packer.jpeg
     title: "Texture Packer"
     excerpt: 'A tool for packing images into atlases'
     url: "/wiki/tools/texture-packer"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
+  - image_path: /assets/images/dev/tools/texture_packer_pro.png
+    title: "Texture Packer Pro"
+    excerpt: 'Create sprite sheets and optimize your game graphics'
+    url: "https://www.codeandweb.com/texturepacker"
+    btn_label: "Documentation & Download"
+    btn_class: "btn--primary"
+    tags: ["Free", "Paid"]
+    
+feature_row5:
   - image_path: /assets/images/dev/tools/tiled_map_packer.gif
     title: "Tiled Map Packer"
     excerpt: 'A tool for packing TiledMap tilesets into an atlas'
     url: "/wiki/tools/tiled-map-packer"
     btn_label: "Documentation & Download"
     btn_class: "btn--primary"
+    tags: ["Free"]
 
 sidebar:
   nav: "dev"
@@ -97,10 +118,12 @@ sidebar:
 
 {% include breadcrumbs.html %}
 
-{% include feature_row %}
+{% include feature_row.html %}
+
+{% include feature_row.html id="feature_row2" %}
 
-{% include feature_row id="feature_row2" %}
+{% include feature_row.html id="feature_row3" %}
 
-{% include feature_row id="feature_row3" %}
+{% include feature_row.html id="feature_row4" %}
 
-{% include feature_row id="feature_row4" %}
+{% include feature_row.html id="feature_row5" %}

_sass/minimal-mistakes.scss

@@ -230,3 +230,36 @@ html, body {
       color: #600;
   }
 }
+
+/* Container to handle spacing between Title and Tags */
+.tools__item-tags {
+  display: block;
+  line-height: 0;
+  margin-bottom: 8px;
+}
+
+/* Base Tag Style */
+.tools__item-tag {
+  display: inline-block;
+  font-size: 12px;
+  font-weight: bold;
+  line-height: 1;
+  padding: 4px 6px;
+  border-radius: 6px;
+  border: 1.5px solid #ccc;
+  background-color: transparent;
+  color: #777;
+  margin-right: 4px;
+}
+
+/* PAID Tag: Gold border and text */
+.tag--paid {
+  border-color: #d4b000;
+  color: #d4b000;
+}
+
+/* FREE Tag: Green border and text */
+.tag--free {
+  border-color: #4caf50;
+  color: #4caf50;
+}