From 23eb7386f49ab19ad647c8a7219e36d5094f86a7 Mon Sep 17 00:00:00 2001
From: hodasemi <michaelh.95@t-online.de>
Date: Sun, 4 Nov 2018 17:26:54 +0100
Subject: [PATCH] Enlist options

---
 css/main.css | 19 +++++++++++++------
 index.html   |  5 ++---
 js/table.js  |  8 +-------
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/css/main.css b/css/main.css
index 5964b18..f7daeef 100644
--- a/css/main.css
+++ b/css/main.css
@@ -208,12 +208,6 @@ th {
     min-width: 250px;
 }
 
-.div {
-    display: none;
-    border: 2px solid lightgreen;
-    min-width: 50px;
-}
-
 .footer {
     border-top: 2px solid lightgreen;
     font-family: 'Roboto', sans-serif;
@@ -232,6 +226,19 @@ th {
     text-align: right;
 }
 
+.option_list ul li {
+    display: inline;
+    list-style-type: none;
+}
+
+.option_list ul {
+    padding: 5px;
+}
+
+.option_list li {
+    padding: 3px;
+}
+
 /* hamburger menu stuff */
 
 @media only screen and (max-width: 950px) {
diff --git a/index.html b/index.html
index f63c577..d357364 100644
--- a/index.html
+++ b/index.html
@@ -70,9 +70,8 @@
 
             At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. <a href="index.html">jony_ipsum</a>
         </p>
-        <p class="hideOptions">Show/Hide: </p>
-        <button onClick="div_change('options')">Show Options</button>
-        <div id="options" class="div"></div>
+
+        <div id="options" class="option_list"></div>
 
         <div class="table-wrapper">
             <table id="t01"></table>
diff --git a/js/table.js b/js/table.js
index 3306bf5..4ac659e 100644
--- a/js/table.js
+++ b/js/table.js
@@ -4,7 +4,7 @@
 // Source: https://www.w3schools.com/howto/howto_js_sort_table.asp
 // Source: https://stackoverflow.com/questions/19105009/how-to-insert-variables-in-javascript-strings
 
-window.onload = function() {
+window.onload = function () {
     handleFile("resources/world_data_v1.csv");
     registerHamburgerToggleClickListener();
 };
@@ -263,12 +263,6 @@ function stringPerToSlash(columnname) {
     return columnname.includes(" per ") ? columnname.replace(" per ", " / ") : columnname;
 }
 
-function div_change(strID) {
-    document.getElementById(strID).style.display = (document.getElementById(strID).style.display == 'none') ? 'inline-block' : 'none';
-    document.getElementById(strID + "_shown").style.display = (document.getElementById(strID + "_shown").style.display == 'none') ? 'inline-block' : 'none';
-    document.getElementById(strID + "_hidden").style.display = (document.getElementById(strID + "_hidden").style.display == 'none') ? 'inline-block' : 'none';
-}
-
 function registerHamburgerToggleClickListener() {
     let menu = document.querySelector("#menu");
     let header = document.querySelector("#header");