Added questions and icons to module_types database

_data/module_types.yml

@@ -0,0 +1,12 @@
+culture:
+    question: What are the core missions, values, and norms?
+    icon: assets/tabler_icons/palette.svg
+decision:
+    question: Who can make decisions and how?
+    icon: assets/tabler_icons/thumb-up.svg
+process:
+    question: How are policies implemented, and how do they evolve?
+    icon: assets/tabler_icons/rotate.svg
+structure:
+    question: What kinds of roles and internal entities are there?
+    icon: assets/tabler_icons/building.svg

_layouts/rule.html

@@ -608,7 +608,7 @@ https://github.com/Bernardo-Castilho/dragdroptouch -->
 
       <div id="module-input"
            ondrop="drop(event)" ondragover="allowDrop(event)">
-        <span class="prompt" id="drag-directions">Browse modules with the tool button and drag them here.</span>
+        <span class="prompt" id="drag-directions">Browse modules from below and drag them here.</span>
       </div>
 
       <div id="builder-field">
@@ -635,19 +635,11 @@ https://github.com/Bernardo-Castilho/dragdroptouch -->
         {% if module.type != last_type %}
         {% if last_type != "" %}</div>{% endif %} 
       <div class="module-type-header">
-        <img
-          {% if module.type == "structure" %}
-          src="{% link assets/tabler_icons/building.svg %}" {% endif %}
-          {% if module.type == "process" %}
-          src="{% link assets/tabler_icons/rotate.svg %}" {% endif %}
-          {% if module.type == "decision" %}
-          src="{% link assets/tabler_icons/thumb-up.svg %}" {% endif %}
-          {% if module.type == "culture" %}
-          src="{% link assets/tabler_icons/palette.svg %}" {% endif %}
-          />
+        <img src="{{ site.baseurl }}/{{ site.data.module_types[module.type].icon }}" />
         {{ module.type }}
         <button onclick="toggleVisible('module-type-{{ module.type }}')" class="button chevrons"><img src="{% link assets/tabler_icons/chevrons-down.svg %}" title="Show/hide" /></button>
       </div>
+      <div class="module-questions">{{ site.data.module_types[module.type].question }}</div>
       <div id="module-type-{{ module.type }}">
         {% endif %}
         {% assign last_type = module.type %}

_sass/communityrule.scss

@@ -62,6 +62,11 @@
     font-size: 1em;
     margin: 10px 5px 5px 5px;
 }
+.module-questions {
+    color: gray;
+    font-size: .8em;
+    margin: 0 10px 10px 10px;
+}
 
 .button:hover {
     background-color: lightgray;