Joined buttons

lib/assets/icons/import.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-import"><path d="M12 3v12"/><path d="m8 11 4 4 4-4"/><path d="M8 5H4a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-4"/></svg>

lib/assets/styles/classes.scss

@@ -486,6 +486,18 @@ a,
     background: none;
     box-shadow: none;
   }
+
+  &.btn-dropdown-animation {
+    svg {
+      transition: transform 0.125s ease-in-out;
+    }
+
+    &.popout-open {
+      svg {
+        transform: rotate(180deg);
+      }
+    }
+  }
 }
 
 .btn-group {
@@ -494,6 +506,27 @@ a,
   flex-wrap: wrap;
 }
 
+.joined-buttons {
+  display: flex;
+  gap: 1px;
+
+  > :not(:first-child) {
+    &.btn,
+    > .btn {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+    }
+  }
+
+  > :not(:last-child) {
+    &.btn,
+    > .btn {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+    }
+  }
+}
+
 // PROJECT CARDS
 
 .project-list {