duzo zmian ux w panelu

static/css/style.css

@@ -352,12 +352,10 @@ input.form-control {
   background-color: #212529 !important;
   color: #fff !important;
   border: 1px solid #495057 !important;
-}
-
-.ts-dropdown {
-  background-color: #212529 !important;
-  color: #fff !important;
-  z-index: 9999 !important;
+  border-radius: 0.375rem;
+  min-height: 38px;
+  padding: 0.25rem 0.5rem;
+  box-sizing: border-box;
 }
 
 .tom-dark .ts-control .item {
@@ -365,4 +363,54 @@ input.form-control {
   color: #fff !important;
   border-radius: 0.25rem;
   padding: 2px 8px;
+  margin-right: 4px;
+}
+
+.ts-dropdown {
+  background-color: #212529 !important;
+  color: #fff !important;
+  border: 1px solid #495057;
+  border-radius: 0.375rem;
+  z-index: 9999 !important;
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.ts-dropdown .active {
+  background-color: #495057 !important;
+  color: #fff !important;
+}
+
+td select.tom-dark {
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+}
+
+.table-dark.table-striped tbody tr:nth-of-type(odd) {
+  background-color: rgba(255, 255, 255, 0.025);
+}
+
+.table-dark tbody tr:hover {
+  background-color: rgba(255, 255, 255, 0.04);
+}
+
+.table-dark thead th {
+  background-color: #1c1f22;
+  color: #e1e1e1;
+  font-weight: 500;
+  border-bottom: 1px solid #3a3f44;
+}
+
+.table-dark td,
+.table-dark th {
+  padding: 0.6rem 0.75rem;
+  vertical-align: middle;
+  border-top: 1px solid #3a3f44;
+}
+
+.card .table {
+  border-radius: 0 !important;
+  overflow: hidden;
+  margin-bottom: 0;
 }

static/js/categories_select_admin.js

@@ -0,0 +1,11 @@
+document.addEventListener("DOMContentLoaded", function () {
+    document.querySelectorAll("select.tom-dark").forEach(function (el) {
+        new TomSelect(el, {
+            plugins: ['remove_button'],
+            persist: false,
+            create: false,
+            hidePlaceholder: true,
+            dropdownParent: 'body'
+        });
+    });
+});