added frontend and changed design

modules/universal_table/info.json

@@ -24,6 +24,14 @@
                 },
             "thumbnail" : "thumb.png",
             "default": true
+        },
+        {
+            "filename" : "mindmap",
+            "name" : {
+                "zh_tw" : "6. Mind Maps",
+                "en" : "6. Mind Maps"
+                },
+            "thumbnail" : "thumb.png"
         }
     ]
 }

modules/universal_table/mindmap.html.erb

@@ -0,0 +1,107 @@
+<style>
+  tr>th:first-child{
+    display: none!important;
+  }
+  /* tr>td:first-child{
+    display: none!important;
+  } */
+  .universal-table-index3{
+    table-layout: auto!important;
+  }
+  .universal-dropdown-menu {
+    padding: 15px 18px;
+    white-space: nowrap;
+  }
+  .universal-th-text{
+    white-space: pre!important;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    white-space: normal;
+}
+  .universal-dropdown-menu {
+    padding: 15px 18px;
+    white-space: nowrap;
+  }
+  .universal-th-text  {
+    padding: 8px 0 0 0;
+    display: inline;
+    margin-right: 5px;
+  }
+  .universal-dropdown {
+    display: inline-block;
+  }
+  a.universal-btn {
+    vertical-align: baseline;
+    color: #fff;
+  }
+  .universal-table-index {
+    border-collapse: collapse;
+    border: 1px solid #eee;
+    table-layout: fixed;
+    word-wrap: break-word;
+  }
+  .universal-table-index h3 {
+    float: left;
+    margin: 0;
+  }
+  .universal-table-index.table td{
+    padding: 15px 18px;
+  }
+  .universal-table-index thead th:last-child .dropdown-menu {
+    left: auto;
+    right: 0;
+  }
+  /* .universal-table-index tbody {
+     counter-reset: item;
+  } */
+  .universal-th-icon {
+    border: 1px solid #eee;
+    padding: 5px 8px;
+    margin-right: 5px;
+    color: gray;
+    cursor: pointer;
+  }
+  .universal-th-text.no-sort.no-search {
+    position: relative;
+    top: -6px;
+  }
+  .image-preview {
+    width: 120px;
+  }
+</style>
+<form class="form-inline universal-form-inline universal-form-inline5" action="{{url}}" method="get">
+<table class="table table-hover table-striped universal-table-index universal-table-index3">
+  <caption>
+    <h3>{{table-name}}</h3>
+  </caption>
+  <tbody>
+    <tr class="tdken" data-level="0" data-list="mindmaps">
+      <td><a href="{{url}}">{{title}}</a></td>
+    </tr>
+  </tbody>
+</table>
+</form>
+{{pagination_goes_here}}
+<script>
+$(document).ready(function(){
+  $('.tdken>td:nth-child(4)').prepend($('.col-ken:nth-child(4)>.universal-th-text '));
+  $('.tdken>td:nth-child(3)').prepend($('.col-ken:nth-child(3)>.universal-th-text '));
+  $(".universal-th-text").append(" :");
+  $(".tdken").append('<i class="fa-solid fa-thumbtack"></i>');
+});
+// $(document).ready(function(){
+//   $("tr>th:first-child").removeClass("col-md-3");
+//   $("tr>th:first-child").addClass("col-md-1");
+//   $("tr>th:nth-child(2)").removeClass("col-md-3");
+//   $("tr>th:nth-child(2)").addClass("col-md-6");
+//   $("tr>th:nth-child(3)").removeClass("col-md-3");
+//   $("tr>th:nth-child(3)").addClass("col-md-3");
+//   $("tr>th:nth-child(4)").removeClass("col-md-3");
+//   $("tr>th:nth-child(4)").addClass("col-md-2");
+//   $("tr>th:nth-child(5)").removeClass("col-md-3");
+//   $("tr>th:nth-child(5)").addClass("col-md-3");
+// });
+// $('.universal-table-index thead tr').prepend('<th></th>')
+// $('.universal-table-index tbody tr').prepend('<td></td>')
+</script>