test dropdown for aggregate function

Chronos-EaaS · Aug 16, 2024 · e67aa3f · e67aa3f
1 parent e50f39b
commit e67aa3f
Showing 1 changed file with 53 additions and 0 deletions.
diff --git a/libraries/graphs/bar-plot/build.template.html b/libraries/graphs/bar-plot/build.template.html
@@ -1,3 +1,48 @@
+<style>
+    /*Testing different implementations, source from https://www.w3schools.com/howto/howto_css_dropdown.asp
+    /* Dropdown Button */
+    .dropbtn {
+        background-color: #04AA6D;
+        color: white;
+        padding: 16px;
+        font-size: 16px;
+        border: none;
+    }
+
+    /* The container <div> - needed to position the dropdown content */
+    .dropdown {
+        position: relative;
+        display: inline-block;
+    }
+
+    /* Dropdown Content (Hidden by Default) */
+    .dropdown-content {
+        display: none;
+        position: absolute;
+        background-color: #f1f1f1;
+        min-width: 160px;
+        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+        z-index: 1;
+    }
+
+    /* Links inside the dropdown */
+    .dropdown-content a {
+        color: black;
+        padding: 12px 16px;
+        text-decoration: none;
+        display: block;
+    }
+
+    /* Change color of dropdown links on hover */
+    .dropdown-content a:hover {background-color: #ddd;}
+
+    /* Show the dropdown menu on hover */
+    .dropdown:hover .dropdown-content {display: block;}
+
+    /* Change the background color of the dropdown button when the dropdown content is shown */
+    .dropdown:hover .dropbtn {background-color: #3e8e41;}
+</style>
+
 <div class="box box-default" id="[[id]]">
     <div class="box-header with-border">
         <h3 class="box-title">Bar Plot</h3>
@@ -9,6 +54,14 @@ <h3 class="box-title">Bar Plot</h3>
             <input type="hidden" name="type" value="bar-plot">
             <label>Parameter Name (taken from each job)</label>
             <input name="parameter" type="text" class="form-control" placeholder="Parameter name" value="{{IF [[parameter]] != false}}[[parameter]]{{ENDIF}}">
+            <div class="dropdown">
+                <button class="dropbtn">Dropdown</button>
+                <div class="dropdown-content">
+                    <a href="#">Link 1</a>
+                    <a href="#">Link 2</a>
+                    <a href="#">Link 3</a>
+                </div>
+            </div>
         </div>
     </div>
     <div class="box-footer">