feat: ✨ added the ability to create/edit/remove device types

static/css/device_types.css

@@ -0,0 +1,94 @@
+/* Icon search suggestions styling */
+.icon-suggestions {
+    max-height: 240px;
+    overflow-y: auto;
+    border-radius: 0.5rem;
+    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+}
+
+.icon-suggestion-item {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding: 0.75rem 1rem;
+    cursor: pointer;
+    transition: background-color 0.15s ease-in-out;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+.icon-suggestion-item:last-child {
+    border-bottom: none;
+}
+
+.icon-suggestion-item:hover {
+    background-color: rgba(0, 0, 0, 0.05);
+}
+
+.dark .icon-suggestion-item {
+    border-bottom-color: rgba(255, 255, 255, 0.1);
+}
+
+.dark .icon-suggestion-item:hover {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+.icon-suggestion-item i {
+    width: 20px;
+    text-align: center;
+    font-size: 1.125rem;
+    color: #4b5563;
+}
+
+.dark .icon-suggestion-item i {
+    color: #d1d5db;
+}
+
+.icon-suggestion-item span {
+    font-family: 'Courier New', monospace;
+    font-size: 0.875rem;
+    color: #374151;
+}
+
+.dark .icon-suggestion-item span {
+    color: #e5e7eb;
+}
+
+/* Icon preview styling */
+.icon-preview {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 2rem;
+}
+
+/* Scrollbar styling for suggestions */
+.icon-suggestions::-webkit-scrollbar {
+    width: 8px;
+}
+
+.icon-suggestions::-webkit-scrollbar-track {
+    background: rgba(0, 0, 0, 0.05);
+    border-radius: 4px;
+}
+
+.dark .icon-suggestions::-webkit-scrollbar-track {
+    background: rgba(255, 255, 255, 0.05);
+}
+
+.icon-suggestions::-webkit-scrollbar-thumb {
+    background: rgba(0, 0, 0, 0.2);
+    border-radius: 4px;
+}
+
+.dark .icon-suggestions::-webkit-scrollbar-thumb {
+    background: rgba(255, 255, 255, 0.2);
+}
+
+.icon-suggestions::-webkit-scrollbar-thumb:hover {
+    background: rgba(0, 0, 0, 0.3);
+}
+
+.dark .icon-suggestions::-webkit-scrollbar-thumb:hover {
+    background: rgba(255, 255, 255, 0.3);
+}
+