@solidxai/core-ui 0.1.17-beta.2 → 0.1.17

package/dist/resources/themes/solid-dark-modern/theme.css

@@ -163,7 +163,8 @@
   .solid-list-surface,
   .solid-form-section,
   .solid-card-view-card,
-  .solid-kanban-card {
+  .solid-kanban-card,
+  .p-card {
     background: #2c3448;
     border: 1px solid rgba(65, 76, 104, 0.7);
     border-radius: 20px;
@@ -236,7 +237,9 @@
     box-shadow: none;
   }
 
+  .solid-list-toolbar .p-button,
   .solid-list-toolbar .solid-btn,
+  .solid-form-toolbar-actions .p-button,
   .solid-form-toolbar-actions .solid-btn {
     height: 40px;
     border-radius: 12px;
@@ -244,6 +247,110 @@
     font-weight: 700;
   }
 
+  .p-button:not(.p-button-text):not(.p-button-link) {
+    background: #f28c28;
+    border-color: #f28c28;
+    color: #1a120d;
+    box-shadow: 0 10px 20px rgba(242, 140, 40, 0.2);
+  }
+
+  .p-button:not(.p-button-text):not(.p-button-link):hover {
+    background: #da7415;
+    border-color: #da7415;
+  }
+
+  .p-button.p-button-secondary,
+  .p-button.p-button-outlined {
+    background: #1f2738;
+    color: #eef2f8;
+    border-color: rgba(65, 76, 104, 0.72);
+    box-shadow: none;
+  }
+
+  .p-inputtext,
+  .p-dropdown,
+  .p-multiselect,
+  .p-inputnumber-input,
+  .p-password-input,
+  .p-inputtextarea,
+  .p-autocomplete .p-inputtext,
+  .p-calendar .p-inputtext,
+  .p-treeselect,
+  .p-cascadeselect {
+    min-height: 46px;
+    border-radius: 12px !important;
+    border: 1px solid rgba(65, 76, 104, 0.72) !important;
+    background: #31384d !important;
+    color: #f3f5fa !important;
+    box-shadow: none !important;
+  }
+
+  .p-inputtext::placeholder,
+  .p-inputtextarea::placeholder,
+  .p-autocomplete-input::placeholder {
+    color: #aeb6c9 !important;
+  }
+
+  .p-inputtext:enabled:hover,
+  .p-dropdown:not(.p-disabled):hover,
+  .p-multiselect:not(.p-disabled):hover,
+  .p-treeselect:not(.p-disabled):hover,
+  .p-cascadeselect:not(.p-disabled):hover {
+    border-color: rgba(242, 140, 40, 0.3) !important;
+  }
+
+  .p-inputtext:enabled:focus,
+  .p-inputtextarea:enabled:focus,
+  .p-dropdown:not(.p-disabled).p-focus,
+  .p-multiselect:not(.p-disabled).p-focus,
+  .p-treeselect:not(.p-disabled).p-focus,
+  .p-cascadeselect:not(.p-disabled).p-focus,
+  .p-autocomplete:not(.p-disabled).p-focus .p-inputtext,
+  .p-calendar:not(.p-disabled).p-focus .p-inputtext {
+    border-color: #f28c28 !important;
+    box-shadow: 0 0 0 4px rgba(242, 140, 40, 0.14) !important;
+  }
+
+  .p-dropdown .p-dropdown-trigger,
+  .p-multiselect .p-multiselect-trigger,
+  .p-treeselect .p-treeselect-trigger,
+  .p-cascadeselect .p-cascadeselect-trigger {
+    width: 2.75rem;
+    color: #b7bfd2 !important;
+  }
+
+  .p-dropdown-panel,
+  .p-multiselect-panel,
+  .p-autocomplete-panel,
+  .p-datepicker,
+  .p-datepicker:not(.p-datepicker-inline),
+  .p-treeselect-panel,
+  .p-cascadeselect-panel {
+    background: #2c3448 !important;
+    color: #f3f5fa !important;
+    border: 1px solid rgba(65, 76, 104, 0.72) !important;
+    border-radius: 14px !important;
+    box-shadow: 0 18px 40px rgba(2, 6, 23, 0.28) !important;
+  }
+
+  .p-dropdown-panel .p-dropdown-items .p-dropdown-item,
+  .p-multiselect-panel .p-multiselect-items .p-multiselect-item,
+  .p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item,
+  .p-treeselect-panel .p-treeselect-items-wrapper .p-treenode-content,
+  .p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item {
+    border-radius: 10px;
+    margin: 4px 8px;
+    color: #f3f5fa !important;
+  }
+
+  .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight,
+  .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight,
+  .p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item.p-highlight,
+  .p-cascadeselect-panel .p-cascadeselect-items .p-cascadeselect-item.p-highlight {
+    background: rgba(242, 140, 40, 0.16) !important;
+    color: #ffd8af !important;
+  }
+
   .solid-form-section {
     --solid-form-control-bg: rgba(255, 255, 255, 0.04);
     --solid-form-control-bg-disabled: rgba(51, 65, 85, 0.24);
@@ -285,6 +392,12 @@
     margin-bottom: 0.5rem;
   }
 
+  .solid-form-content .p-inputtext,
+  .solid-form-content .p-dropdown,
+  .solid-form-content .p-multiselect,
+  .solid-form-content .p-inputnumber-input,
+  .solid-form-content .solid-standard-autocomplete .p-inputtext,
+  .solid-form-content .solid-standard-autocomplete .p-autocomplete-dropdown.p-button,
   .solid-form-content .react-datepicker-wrapper input,
   .solid-form-content .solid-input,
   .solid-form-content .solid-select,
@@ -292,6 +405,15 @@
     min-height: 46px;
   }
 
+  .solid-form-content .p-dropdown:not(.p-disabled).p-focus,
+  .solid-form-content .p-multiselect:not(.p-disabled).p-focus,
+  .solid-form-content .p-inputtext:enabled:focus,
+  .solid-form-content .solid-standard-autocomplete.p-inputwrapper-focus .p-inputtext,
+  .solid-form-content .solid-standard-autocomplete.p-inputwrapper-focus .p-autocomplete-dropdown.p-button {
+    border-color: #f28c28;
+    box-shadow: 0 0 0 4px rgba(242, 140, 40, 0.14);
+  }
+
   .solid-notebook-tablist {
     border-bottom: 0;
     gap: 0.4rem;
@@ -361,6 +483,23 @@
     padding-bottom: 0.8rem;
   }
 
+  .solid-datatable-wrapper .p-datatable .p-datatable-thead > tr > th {
+    background: #20283a;
+    color: #b6bed0;
+    font-size: 11px;
+    font-weight: 700;
+    letter-spacing: 0.08em;
+    text-transform: uppercase;
+    border-bottom: 1px solid rgba(65, 76, 104, 0.62);
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+  }
+
+  .solid-datatable-wrapper .p-datatable .p-datatable-tbody > tr {
+    background: rgba(44, 52, 72, 0.96);
+    color: #f3f5fa;
+  }
+
   .solid-data-table-row {
     border-top: 0;
     background: transparent;
@@ -424,6 +563,9 @@
   }
 
   .solid-form-content > .flex,
+  .solid-form-content > .p-tabview,
+  .solid-form-content > .p-panel,
+  .solid-form-content > .p-fieldset,
   .solid-form-content > .solid-layout-accordion {
     background: rgba(44, 52, 72, 0.94);
     border: 1px solid rgba(65, 76, 104, 0.56);
@@ -431,4 +573,28 @@
     padding: 16px;
     box-shadow: 0 8px 24px rgba(2, 6, 23, 0.16);
   }
+
+  .solid-form-content .p-panel,
+  .solid-form-content .p-fieldset,
+  .solid-form-content .p-accordion .p-accordion-header .p-accordion-header-link,
+  .solid-form-content .p-accordion .p-accordion-content {
+    border-radius: 16px;
+  }
+
+  .solid-datatable-wrapper .p-datatable .p-datatable-tbody > tr > td {
+    border-bottom: 1px solid rgba(86, 62, 46, 0.16);
+    padding-top: 0.95rem;
+    padding-bottom: 0.95rem;
+  }
+
+  .solid-datatable-wrapper .p-datatable .p-datatable-tbody > tr:hover,
+  .solid-datatable-wrapper .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody > tr:not(.p-highlight):hover {
+    background: rgba(242, 140, 40, 0.08);
+  }
+
+  .solid-datatable-wrapper .p-datatable .p-datatable-tbody > tr.p-highlight,
+  .solid-datatable-wrapper .p-datatable .p-datatable-tbody > tr > td.p-highlight {
+    background: rgba(242, 140, 40, 0.16);
+    color: #ffd8af;
+  }
 }