feat: header iteration 2

src/fellchensammlung/static/fellchensammlung/css/styles.css

@@ -49,6 +49,7 @@ table {
     background-color: var(--secondary-light-one);
     word-break: break-word;
 }
+
 @media screen and (max-width: 500px) {
     table {
         font-size: small;
@@ -86,7 +87,6 @@ h1, h2 {
 }
 
 
-
 .nav-link {
     color: var(--text-one);
     text-align: center;
@@ -142,12 +142,12 @@ h1, h2 {
     color: var(--highlight-one-text);
 
     button {
-    width: 100%;
-    padding: 10px;
-    border: none;
-    border-radius: 4px;
-    opacity: 1;
-    background-color: var(--secondary-light-one);
+        width: 100%;
+        padding: 10px;
+        border: none;
+        border-radius: 4px;
+        opacity: 1;
+        background-color: var(--secondary-light-one);
     }
 }
 
@@ -201,6 +201,7 @@ h1, h2 {
 .container-edit-buttons {
     display: flex;
     flex-wrap: wrap;
+
     .btn {
         margin: 5px;
     }
@@ -517,4 +518,31 @@ textarea {
 
 .info {
     border: rgba(17, 58, 224, 0.51) 4px solid;
+}
+
+.container-dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: #f9f9f9;
+    min-width: 160px;
+    z-index: 1;
+}
+
+.container-dropdown:hover .dropdown-content {
+    display: block;
+}
+
+
+.dropbtn {
+    background-color: #f1f1f1;
+    color: black;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
 }