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

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

@@ -214,7 +214,8 @@
   .solid-list-surface,
   .solid-form-section,
   .solid-card-view-card,
-  .solid-kanban-card {
+  .solid-kanban-card,
+  .p-card {
     background: #f6efe2;
     border: 1px solid var(--solid-border-default);
     border-radius: 20px;
@@ -341,7 +342,8 @@
   }
 
   .custom-add-button,
-  .custom-add-button.solid-btn {
+  .custom-add-button.solid-btn,
+  .custom-add-button.p-button {
     border: 1px solid var(--solid-border-default) !important;
     background: #f3ebdd !important;
     background-color: #f3ebdd !important;
@@ -351,14 +353,17 @@
   }
 
   .custom-add-button:hover:not(:disabled),
-  .custom-add-button.solid-btn:hover:not(:disabled) {
+  .custom-add-button.solid-btn:hover:not(:disabled),
+  .custom-add-button.p-button:hover:not(:disabled) {
     background: #ede2d1 !important;
     background-color: #ede2d1 !important;
     border-color: var(--solid-border-default) !important;
     color: #2e2e2e !important;
   }
 
+  .solid-list-toolbar .p-button,
   .solid-list-toolbar .solid-btn,
+  .solid-form-toolbar-actions .p-button,
   .solid-form-toolbar-actions .solid-btn {
     height: 38px;
     border-radius: 10px;
@@ -366,6 +371,110 @@
     font-weight: 700;
   }
 
+  .p-button:not(.p-button-text):not(.p-button-link) {
+    background: #2e2e2e;
+    border-color: #2e2e2e;
+    color: #f8f1e5;
+    box-shadow: 0 8px 16px rgba(46, 46, 46, 0.12);
+  }
+
+  .p-button:not(.p-button-text):not(.p-button-link):hover {
+    background: #383838;
+    border-color: #383838;
+  }
+
+  .p-button.p-button-secondary,
+  .p-button.p-button-outlined {
+    background: #f7f0e3;
+    color: #5c4b3e;
+    border-color: var(--solid-border-default);
+    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 var(--solid-border-default) !important;
+    background: #f3ebdd !important;
+    color: #2e251f !important;
+    box-shadow: none !important;
+  }
+
+  .p-inputtext::placeholder,
+  .p-inputtextarea::placeholder,
+  .p-autocomplete-input::placeholder {
+    color: #8d7c6e !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(46, 46, 46, 0.24) !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: #2e2e2e !important;
+    box-shadow: 0 0 0 4px rgba(46, 46, 46, 0.08) !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: #8d7c6e !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: #fbf6ee !important;
+    color: #2e251f !important;
+    border: 1px solid var(--solid-border-default) !important;
+    border-radius: 14px !important;
+    box-shadow: 0 18px 40px rgba(92, 75, 62, 0.1) !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: #2e251f !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(46, 46, 46, 0.08) !important;
+    color: #2e2e2e !important;
+  }
+
   .solid-form-section {
     --solid-form-control-bg: rgba(255, 255, 255, 0.94);
     --solid-form-control-bg-disabled: #eceff4;
@@ -407,6 +516,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,
@@ -416,10 +531,32 @@
     border-color: var(--solid-border-default) !important;
   }
 
+  .solid-form-content .p-dropdown .p-dropdown-label,
+  .solid-form-content .p-multiselect .p-multiselect-label,
+  .solid-form-content .p-inputtext,
+  .solid-form-content .p-inputtextarea,
+  .solid-form-content .p-inputnumber-input,
+  .solid-form-content .solid-standard-autocomplete .p-inputtext,
   .solid-form-content .react-datepicker-wrapper input {
     background: transparent !important;
   }
 
+  .solid-form-content .p-dropdown-trigger,
+  .solid-form-content .p-multiselect-trigger,
+  .solid-form-content .p-treeselect-trigger,
+  .solid-form-content .p-cascadeselect-trigger {
+    background: transparent !important;
+  }
+
+  .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: #2e2e2e;
+    box-shadow: 0 0 0 4px rgba(46, 46, 46, 0.08);
+  }
+
   .solid-form-content .solid-notebook,
   .solid-form-section .solid-notebook,
   .solid-list-surface .solid-notebook {
@@ -609,6 +746,7 @@
   }
 
   .solid-list-page-wrapper .solid-datatable-wrapper > .solid-data-table-root,
+  .solid-list-page-wrapper .solid-datatable-wrapper > .p-datatable,
   .solid-list-page-wrapper .solid-datatable-wrapper > div:first-child {
     margin-top: 10px;
     margin-bottom: 10px;
@@ -628,7 +766,9 @@
     background: #f1e8da !important;
   }
 
-  .solid-data-table-viewport > .relative {
+  .solid-data-table-viewport > .relative,
+  .solid-datatable-wrapper .p-datatable,
+  .solid-datatable-wrapper .p-datatable-wrapper {
     background: #f6efe2 !important;
   }
 
@@ -669,10 +809,30 @@
 
   .solid-data-table-head .solid-tree-sticky-cell,
   .solid-data-table-head .solid-tree-sticky-cell-left,
-  .solid-data-table-head .solid-tree-sticky-cell-right {
+  .solid-data-table-head .solid-tree-sticky-cell-right,
+  .solid-datatable-wrapper .p-datatable .p-datatable-thead > tr > th.solid-tree-sticky-cell,
+  .solid-datatable-wrapper .p-datatable .p-datatable-thead > tr > th.solid-tree-sticky-cell-left,
+  .solid-datatable-wrapper .p-datatable .p-datatable-thead > tr > th.solid-tree-sticky-cell-right {
     background: #d7cebd !important;
   }
 
+  .solid-datatable-wrapper .p-datatable .p-datatable-thead > tr > th {
+    background: #d7cebd !important;
+    color: #3d342d;
+    font-size: 11px;
+    font-weight: 600;
+    letter-spacing: 0.01em;
+    text-transform: none;
+    border-bottom: 1px solid var(--solid-border-strong);
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+  }
+
+  .solid-datatable-wrapper .p-datatable .p-datatable-tbody > tr {
+    background: #f6efe2;
+    color: #3b3029;
+  }
+
   .solid-data-table-row {
     border-top: 0;
     background: transparent;
@@ -735,13 +895,18 @@
   }
 
   .solid-paginator-btn,
-  .solid-paginator-select {
+  .solid-paginator-select,
+  .solid-paginator-select .p-dropdown,
+  .solid-paginator-select .p-dropdown-label,
+  .solid-table-paginator .p-button,
+  .solid-table-paginator .p-inputtext {
     background: #f3ebdd !important;
     background-color: #f3ebdd !important;
     border-color: var(--solid-border-default) !important;
   }
 
   .solid-row-menu-trigger,
+  .solid-row-menu-trigger.p-button,
   .solid-tree-row-menu-trigger {
     background: #f3ebdd !important;
     background-color: #f3ebdd !important;
@@ -751,6 +916,7 @@
   }
 
   .solid-row-menu-trigger:hover,
+  .solid-row-menu-trigger.p-button:hover,
   .solid-tree-row-menu-trigger:hover {
     background: #ede2d1 !important;
     background-color: #ede2d1 !important;
@@ -786,7 +952,11 @@
     border-top: 1px solid var(--solid-border-default) !important;
   }
 
-  .solid-form-footer .solid-btn {
+  .solid-form-footer .p-button,
+  .solid-form-footer .solid-btn,
+  .solid-form-footer .p-inputtext,
+  .solid-form-footer .p-dropdown,
+  .solid-form-footer .p-dropdown-label {
     background-color: #f3ebdd !important;
     border-color: var(--solid-border-default) !important;
   }
@@ -796,6 +966,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(247, 239, 226, 0.98);
     border: 1px solid var(--solid-border-default);
@@ -804,6 +977,30 @@
     box-shadow: 0 8px 24px rgba(92, 75, 62, 0.05);
   }
 
+  .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(126, 110, 95, 0.08);
+    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: #efe5d4;
+  }
+
+  .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(46, 46, 46, 0.08);
+    color: #2e2e2e;
+  }
+
   .solid-segmented {
     border: 1px solid var(--solid-border-default) !important;
     border-radius: 14px;

package/dist/routes/pages/admin/core/DatasourceIntrospectionPage.css

@@ -445,7 +445,7 @@
 .sdix-table-area .solid-table-density-compact .solid-data-table-td {
   height: 30px;
   padding: 0.26rem 0.5rem;
-  vertical-align: middle;
+  vertical-align: top;
 }
 
 .sdix-table-primary-cell {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidxai/core-ui",
-  "version": "0.1.17-beta.2",
+  "version": "0.1.17",
   "scripts": {
     "build:tailwind": "tailwindcss -i ./src/resources/solid-tailwind.css -o ./src/resources/solid-tailwind-generated.css -c ./tailwind.config.js --minify",
     "prebuild": "npm run build:tailwind && npm run copy-resources && npm run copy-styles",