Improve exports and GUI

app/assets/stylesheets/dropdown.scss

@@ -0,0 +1,67 @@
+.details-dropdown {
+  display: inline-block;
+  position: relative;
+}
+
+/* Hide The disclosure widget: */
+.details-dropdown summary {
+  list-style: none;
+  cursor: pointer;
+}
+.details-dropdown[open] summary {
+  list-style: none;
+  cursor: pointer;
+  i {
+    
+  color: var(--bs-body-color)
+  }
+  /* border-left: solid 1px $secondary; */
+  /* border-top: solid 1px $secondary; */
+  /* border-right: solid 1px $secondary; */
+}
+.details-dropdown[open] {
+  background-color: $secondary;
+}
+
+/* Detache details content */
+.details-dropdown .details-dropdown-content {
+  border: solid 1px $secondary;
+  position: absolute;
+  min-inline-size: max-content;
+  z-index: 2000;
+
+  /* In case the details-dropdown should open to the left: */
+  right: 0;
+}
+
+/* Closing the details-dropdown on clicking anywhere else */
+.details-dropdown[open] summary::before {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  content: "";
+  cursor: default;
+}
+
+/* Visual styles for your details-dropdown: */
+.details-dropdown .details-dropdown-trigger {
+  /* your look and feel here */
+}
+
+.details-dropdown .details-dropdown-content {
+  /* your look and feel here */
+}
+
+form.no-padding {
+  button {
+    padding: 0;
+  }
+}
+
+li.list-group-item-danger:hover {
+  button {
+    color: var(--bs-body-color) ;
+  }
+}