From 6e1e45861304c17104a0db9eb3057a2984099add Mon Sep 17 00:00:00 2001
From: Scott Duensing <scott@kangaroopunch.com>
Date: Thu, 6 Jan 2022 20:38:03 -0600
Subject: [PATCH] Config plugin finally working.

---
 .../kangaworld-integration/dialogs/fields.php |  6 ++---
 .../plugins/kangaworld-integration/index.css  | 16 ++++++++++----
 .../plugins/kangaworld-integration/index.js   |  4 ++--
 .../src/components/KwConfig.vue               | 22 ++++++++++++++-----
 4 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/kanga.world/site/plugins/kangaworld-integration/dialogs/fields.php b/kanga.world/site/plugins/kangaworld-integration/dialogs/fields.php
index 502a881..303712b 100644
--- a/kanga.world/site/plugins/kangaworld-integration/dialogs/fields.php
+++ b/kanga.world/site/plugins/kangaworld-integration/dialogs/fields.php
@@ -4,8 +4,8 @@ use KangarooPunch\KwConfig;
 use Kirby\Toolkit\A;
 
 return [
-	'title' => [
-		 'label' => 'Title',
+	'name' => [
+		 'label' => 'Name',
 		 'type'  => 'text'
 	],
 	'type' => [
@@ -22,7 +22,7 @@ return [
 		 'type'    => 'textarea',
 		 'buttons' => false
 	],
-	'price' => [
+	'data' => [
 		 'label'  => 'Value',
 		 'type'   => 'text'
 	]
diff --git a/kanga.world/site/plugins/kangaworld-integration/index.css b/kanga.world/site/plugins/kangaworld-integration/index.css
index c8af1c3..b0d3252 100644
--- a/kanga.world/site/plugins/kangaworld-integration/index.css
+++ b/kanga.world/site/plugins/kangaworld-integration/index.css
@@ -14,6 +14,14 @@
   overflow: hidden;
   background: var(--color-white);
 }
+.k-kwconfig th {
+   font-weight: var(--font-bold);
+}
+.k-kwconfig th button {
+  font: inherit;
+  text-align: left;
+  width: 100%;
+}
 .k-kwconfig-name {
   /* width: 8rem; */
 }
@@ -28,8 +36,8 @@
   font-variant-numeric: tabular-nums;
   text-align: right !important;
 }
-.k-kwconfig th button {
-  font: inherit;
-  text-align: left;
-  width: 100%;
+.k-kwconfig-options {
+   padding: 0 !important;
+   width: 3rem;
+   overflow: visible !important;
 }
diff --git a/kanga.world/site/plugins/kangaworld-integration/index.js b/kanga.world/site/plugins/kangaworld-integration/index.js
index 206d6c7..e171e7a 100644
--- a/kanga.world/site/plugins/kangaworld-integration/index.js
+++ b/kanga.world/site/plugins/kangaworld-integration/index.js
@@ -14,8 +14,8 @@
       return _vm.sortBy("description");
     } } }, [_vm._v(" Description "), _vm.sort === "description" ? _c("span", { domProps: { "innerHTML": _vm._s(_vm.sortArrow) } }) : _vm._e()])]), _c("th", { staticClass: "k-kwconfig-data" }, [_c("button", { on: { "click": function($event) {
       return _vm.sortBy("data");
-    } } }, [_vm._v(" Value "), _vm.sort === "data" ? _c("span", { domProps: { "innerHTML": _vm._s(_vm.sortArrow) } }) : _vm._e()])])]), _vm._l(_vm.kwconfig, function(kwconfig, name) {
-      return _c("tr", { key: name }, [_c("td", { staticClass: "k-kwconfig-name" }, [_vm._v(_vm._s(kwconfig.name))]), _c("td", { staticClass: "k-kwconfig-type" }, [_vm._v(_vm._s(kwconfig.type))]), _c("td", { staticClass: "k-kwconfig-description" }, [_vm._v(_vm._s(kwconfig.description))]), _c("td", { staticClass: "k-kwconfig-data" }, [_vm._v(_vm._s(kwconfig.data)), _c("k-options-dropdown", { attrs: { "options": "kwconfig/" + name } })], 1)]);
+    } } }, [_vm._v(" Value "), _vm.sort === "data" ? _c("span", { domProps: { "innerHTML": _vm._s(_vm.sortArrow) } }) : _vm._e()])]), _c("th", { staticClass: "k-kwconfig-options" })]), _vm._l(_vm.kwconfig, function(kwconfig, name) {
+      return _c("tr", { key: name }, [_c("td", { staticClass: "k-kwconfig-name" }, [_vm._v(_vm._s(kwconfig.name))]), _c("td", { staticClass: "k-kwconfig-type" }, [_vm._v(_vm._s(kwconfig.type))]), _c("td", { staticClass: "k-kwconfig-description" }, [_vm._v(_vm._s(kwconfig.description))]), _c("td", { staticClass: "k-kwconfig-data" }, [_vm._v(_vm._s(kwconfig.data))]), _c("td", { staticClass: "k-kwconfig-options" }, [_c("k-options-dropdown", { attrs: { "options": "kwconfig/" + name } })], 1)]);
     })], 2)], 1)], 1);
   };
   var staticRenderFns$1 = [];
diff --git a/kanga.world/site/plugins/kangaworld-integration/src/components/KwConfig.vue b/kanga.world/site/plugins/kangaworld-integration/src/components/KwConfig.vue
index 7258316..d21b7ce 100644
--- a/kanga.world/site/plugins/kangaworld-integration/src/components/KwConfig.vue
+++ b/kanga.world/site/plugins/kangaworld-integration/src/components/KwConfig.vue
@@ -37,12 +37,16 @@
                 <span v-if="sort === 'data'" v-html="sortArrow"/>
              </button>
           </th>
+          <th class="k-kwconfig-options"></th>
         </tr>
         <tr v-for="(kwconfig, name) in kwconfig" :key="name">
           <td class="k-kwconfig-name">{{ kwconfig.name }}</td>
           <td class="k-kwconfig-type">{{ kwconfig.type }}</td>
           <td class="k-kwconfig-description">{{ kwconfig.description }}</td>
-          <td class="k-kwconfig-data">{{ kwconfig.data }}<k-options-dropdown :options="'kwconfig/' + name" /></td>
+          <td class="k-kwconfig-data">{{ kwconfig.data }}</td>
+          <td class="k-kwconfig-options">
+             <k-options-dropdown :options="'kwconfig/' + name" />
+          </td>
         </tr>
       </table>
     </k-view>
@@ -92,6 +96,14 @@ export default {
   overflow: hidden;
   background: var(--color-white);
 }
+.k-kwconfig th {
+   font-weight: var(--font-bold);
+}
+.k-kwconfig th button {
+  font: inherit;
+  text-align: left;
+  width: 100%;
+}
 .k-kwconfig-name {
   /* width: 8rem; */
 }
@@ -106,9 +118,9 @@ export default {
   font-variant-numeric: tabular-nums;
   text-align: right !important;
 }
-.k-kwconfig th button {
-  font: inherit;
-  text-align: left;
-  width: 100%;
+.k-kwconfig-options {
+   padding: 0 !important;
+   width: 3rem;
+   overflow: visible !important;
 }
 </style>