modify links field to specify text and uri

1 files changed, 44 insertions, 12 deletions

diff --git a/themes/okadmin/templates/partials/inputs.liquid b/themes/okadmin/templates/partials/inputs.liquid
index c6efc68..55d5fb8 100644
--- a/themes/okadmin/templates/partials/inputs.liquid
+++ b/themes/okadmin/templates/partials/inputs.liquid
@@ -79,26 +79,58 @@
                value="{{spec.value}}"
                placeholder="Enter a comma separated list of tags.">
       </div>
-    {% elsif type == 'link-list' %}
 
+    {% elsif type == 'link-list' %}
       <div class="link-list group">
         <div class="links">
-          {% for url in spec.value %}
-            <input
-                name="{{name}}[{{forloop.index0}}]"
-                value="{{url}}"
-                type="text"
-                class="link-input">
-            <button class="remove-link-btn"
-                    data-for="{{name}}[{{forloop.index0}}]">
-              -
-            </button>
+          {% for link in spec.value %}
+            <li>
+              <input
+                  name="{{name}}[][text]"
+                  value="{{link.text}}"
+                  type="text"
+                  placeholder="Link text"
+                  class="link-input link-text">
+              <input
+                  name="{{name}}[][uri]"
+                  value="{{link.uri}}"
+                  type="text"
+                  placeholder="URL"
+                  class="link-input link-uri">
+              <button class="remove-link-btn">
+                -
+              </button>
+            </li>
           {% endfor %}
         </div>
         <input type="text"
-               class="link-input-new"
+               class="link-input-new link-text"
+               placeholder="Link text">
+        <input type="text"
+               class="link-input-new link-uri"
                placeholder="http://www.example.com">
         <button class="add-link-btn">+</button>
+
+        <script type="text/html" class="link-template">
+          <li>
+            <input
+                name="{{name}}[][text]"
+                value=""
+                type="text"
+                placeholder="Link text"
+                class="link-input link-text">
+            <input
+                name="{{name}}[][uri]"
+                value=""
+                type="text"
+                placeholder="URL"
+                class="link-input link-uri">
+            <button class="remove-link-btn">
+              -
+            </button>
+          </li>
+        </script>
+
       </div>
 
     {% elsif type == 'media-list' %}