@solidstarters/create-solid-app 1.2.13 → 1.2.15

package/templates/next-template/app/globals.css

@@ -1520,25 +1520,6 @@ li.header-li-px {
   font-size: 0.8rem;
 }
 
-.s_group {
-  position: relative;
-  width: 100%;
-  overflow-x: auto;
-}
-
-.s_group fieldset {
-  border: 0px;
-}
-
-.s_group_heading {
-  position: absolute;
-  left: 10px;
-  top: -25px;
-  font-size: 0.7rem !important;
-  font-weight: 700;
-  color: #000 !important;
-}
-
 .small-input .p-multiselect-label .p-multiselect-token {
   padding: 3px;
 }
@@ -1677,12 +1658,14 @@ li.header-li-px {
   justify-content: space-between;
 }
 
-/* .solid-form-wrapper{
+.solid-form-wrapper {
   overflow: hidden;
-} */
+}
 
 .solid-form-wrapper .solid-form-content {
-  height: calc(100vh - 118px);
+  height: calc(100vh - 64px);
+  /* if Stepper */
+  /* height: calc(100vh - 124px); */
   overflow-y: auto;
 }
 
@@ -1979,12 +1962,12 @@ li.header-li-px {
 
 .solid-panel-menu .menuHead a {
   text-decoration: none;
-  color: var(--secondary-dark-color);
+  color: var(--solid-dark-title) !important;
   padding: 0.75rem 0rem 0.75rem 0rem;
 }
 
 .solid-panel-menu .menuHead a .sidebar-chevrons {
-  color: var(--secondary-dark-color);
+  color: var(--solid-dark-title) !important;
 }
 
 /* .navBarTwo .subMenuHead {
@@ -2051,7 +2034,7 @@ li.header-li-px {
 
 .user-profile-panel .p-overlaypanel-content {
   padding: 0 !important;
-  min-width: 300px;
+  /* min-width: 300px; */
   border: 1px solid #D8E2EA;
   border-radius: 0.25rem;
   box-shadow: 0px 4px 4px 0px rgba(200, 199, 199, 0.25);
@@ -2142,7 +2125,7 @@ li.header-li-px {
 
 .solid-auth-input-label {
   font-size: 0.875rem;
-  font-weight: 500;
+  font-weight: 400;
   line-height: 1.25rem;
 }
 
@@ -2226,17 +2209,33 @@ li.header-li-px {
   color: #fff !important;
 }
 
+.listview-cogwheel-panel .p-overlaypanel-content {
+  min-width: 220px;
+}
+
+.cogwheel-column-filter label{
+  font-size: 14px;
+}
+
 .customize-layout-panel.p-overlaypanel {
-  left: 1400px !important;
-  top: 166px !important;
+  /* left: 1400px !important;
+  top: 21% !important; */
+  left: 1370px !important;
+  top: 19% !important;
 }
 
 .solid-auth-footer {
-  bottom: 5%;
+  bottom: 2%;
   width: 80%;
   z-index: 999;
 }
 
+.solid-auth-footer-2 {
+  bottom: 2%;
+  width: 100%;
+  z-index: 999;
+}
+
 .auth-submit-button {
   display: flex !important;
   align-items: center !important;
@@ -2247,22 +2246,14 @@ li.header-li-px {
 
 .auth-submit-button .p-button-label {
   flex: none;
+  font-weight: 400;
 }
 
-@keyframes shake {
-  0% { transform: translateX(0); }
-  20% { transform: translateX(-5px); }
-  40% { transform: translateX(5px); }
-  60% { transform: translateX(-5px); }
-  80% { transform: translateX(5px); }
-  100% { transform: translateX(0); }
+.auth-back-button .p-button-label {
+  font-weight: 400;
+  color: #AEAEAE;
 }
 
-.tab-error {
-  animation: shake 0.8s ease-in-out;
-  border-bottom: 3px solid red;
-  font-weight: bold;
-}
 .p-button.p-button-icon-only.custom-add-button {
   padding: 4px !important;
   width: 2rem;
@@ -2279,4 +2270,247 @@ li.header-li-px {
   align-items: center;
   justify-content: space-between;
   background: var(--solid-light-grey);
+}
+
+.solid-auth-tabview .p-tabview-panels {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.solid-auth-tabview .p-tabview-nav {
+  border-radius: 0.5rem;
+  background: rgba(205, 205, 205, 0.20);
+  border: 1px solid #d7d7d7;
+  padding: 4px;
+  margin: 5px 0;
+}
+
+.solid-auth-tabview .p-tabview-nav a {
+  font-weight: 400;
+}
+
+.solid-auth-tabview .p-tabview-nav li {
+  flex: 1;
+  border-radius: 0.3rem;
+}
+
+.solid-auth-tabview .p-tabview-nav-link {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 40px;
+  color: var(--solid-grey-500) !important;
+}
+
+.solid-auth-tabview .p-tabview-selected.p-highlight {
+  background-color: var(--primary-color);
+}
+
+.solid-auth-tabview .p-tabview-selected.p-highlight .p-tabview-nav-link {
+  color: #fff !important;
+}
+
+.solid-auth-tabview .p-tabview-nav-link {
+  border: none !important;
+}
+
+.solid-global-search-filter .p-dialog-content {
+  padding: 0;
+  border-radius: 0.25rem;
+}
+
+.solid-global-search-filter .p-dialog-content h5 {
+  font-size: 1.25rem !important;
+}
+
+.solid-global-search-filter .p-fieldset .p-fieldset-legend {
+  padding: 0 !important;
+  border: none !important;
+  font-weight: 700;
+}
+
+.solid-global-search-filter .p-fieldset .p-fieldset-content {
+  padding: 0 1.25rem;
+}
+
+.custom-filter-condition-btn {
+  padding: 0.25rem 0.5rem !important;
+  font-size: 0.625rem !important;
+}
+
+.primary-filter-fieldset {
+  background-color: #F8F7FC;
+}
+
+.nested-custom-filter .primary-filter-fieldset {
+  background-color: #FFF;
+}
+
+.custom-filter-chip .p-chips-token {
+  padding: 0.25rem 0.5rem !important;
+  color: var(--primary-color) !important;
+  font-size: 0.875rem !important;
+  border-radius: 0.375rem !important;
+  background: #FBF5FF !important;
+}
+
+.solid-filter-action-btn .p-button-icon {
+  font-weight: 600;
+  color: var(--solid-form-title);
+  font-size: 1rem;
+}
+
+
+.custom-filter-chip .p-chips-token-icon.pi {
+  font-size: 12px !important;
+  color: #000000E0;
+}
+
+.custom-chip-column {
+  color: rgba(0, 0, 0, 0.65);
+}
+
+.custom-chip-value {
+  color: #000000;
+}
+
+.custom-chip-or {
+  color: rgba(0, 0, 0, 0.65);
+  font-weight: 700;
+}
+
+.custom-filter-search-options button:first-child {
+  background-color: #64748b0a;
+}
+
+.custom-filter-search-options button:first-child:hover {
+  background-color: transparent;
+}
+
+.solid-layout-accordion .p-accordion .p-accordion-header .p-accordion-header-link {
+  padding: 1.25rem 1.25rem 0.875rem 1.25rem;
+}
+
+.solid-layout-accordion .p-accordion .p-accordion-tab {
+  margin-bottom: 0;
+}
+
+.solid-layout-accordion a {
+  color: var(--solid-title);
+}
+
+.solid-layout-accordion .p-accordion .p-accordion-header .p-accordion-header-link {
+  border: none;
+  background-color: transparent;
+}
+
+.solid-layout-accordion .p-accordion-tab:first-child {
+  border-bottom: 1px solid var(--primary-light-color);
+}
+
+.solid-layout-accordion .p-accordion-content {
+  border: none;
+  padding: 0;
+  border-radius: 0;
+}
+
+.solid-layout-accordion .p-accordion-header a {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-direction: row-reverse;
+}
+
+.solid-layout-accordion label{
+  color: #000;
+  font-weight: 400;
+}
+
+.solid-standard-autocomplete .p-inputtext {
+  border-right: none;
+}
+
+.solid-standard-autocomplete .p-autocomplete-dropdown.p-button {
+  background-color: #fff;
+  border-left: none;
+  border-color: #d1d5db;
+  color: rgba(0, 0, 0, 0.60);
+}
+
+.solid-standard-autocomplete:hover .p-autocomplete-dropdown.p-button,
+.solid-standard-autocomplete:hover .p-inputtext {
+  border-color: var(--primary-color);
+}
+
+/* Hide right shadow of input and left shadow of button to make them merge */
+.solid-standard-autocomplete .p-inputtext:focus {
+  box-shadow: 0 0 0 0.2rem #d3b5f5, inset -2px 0 0 #fff, inset 2px 0 0 transparent;
+}
+
+.solid-standard-autocomplete .p-inputtext:focus+.p-button {
+  box-shadow: 0 0 0 0.2rem #d3b5f5, inset -2px 0 0 transparent, inset 2px 0 0 #fff;
+  border-color: #d1d5db !important;
+}
+
+.solid-dialog .p-dialog-content {
+  padding: 0 !important;
+}
+
+.google-auth-button {
+  font-weight: 400 !important;
+  color: var(--solid-grey-500);
+  /* font-size: 14px; */
+}
+
+.custom-input-group.p-inputgroup-addon:first-child,
+.custom-input-group.p-inputgroup button:first-child,
+.custom-input-group.p-inputgroup input:first-child,
+.custom-input-group.p-inputgroup>.p-inputwrapper:first-child,
+.custom-input-group.p-inputgroup>.p-inputwrapper:first-child>.p-inputtext {
+  border-top-left-radius: 8px;
+  border-bottom-left-radius: 8px;
+}
+
+
+.custom-input-group.p-inputgroup-addon:last-child,
+.custom-input-group.p-inputgroup button:last-child,
+.custom-input-group.p-inputgroup input:last-child,
+.custom-input-group.p-inputgroup>.p-inputwrapper:last-child,
+.custom-input-group.p-inputgroup>.p-inputwrapper:last-child>.p-inputtext {
+  border-top-right-radius: 8px;
+  border-bottom-right-radius: 8px;
+}
+
+.solid-form-stepper-overlay .p-button {
+  min-width: 150px;
+}
+
+.solid-form-stepper-overlay .p-button .p-button-label {
+  color: var(--solid-title);
+  font-weight: 400 !important;
+  flex: none;
+  font-size: 14px;
+}
+
+.solid-form-stepper-overlay .p-button:hover .p-button-label {
+  color: #fff;
+}
+
+.solid-form-stepper-overlay .p-button.p-button-text:not(:disabled):hover {
+  background-color: var(--primary-color);
+}
+
+@keyframes shake {
+  0% { transform: translateX(0); }
+  20% { transform: translateX(-5px); }
+  40% { transform: translateX(5px); }
+  60% { transform: translateX(-5px); }
+  80% { transform: translateX(5px); }
+  100% { transform: translateX(0); }
+}
+
+.tab-error {
+  animation: shake 0.8s ease-in-out;
+  border-bottom: 3px solid red;
+  font-weight: bold;
 }

package/templates/next-template/app/layout.tsx

@@ -1,7 +1,6 @@
 
-import "./globals.css";
+import "./solid-global.css";
 import '../public/styles/layout/layout.scss';
-import "./solid-stylesheet.css";
 // import "primereact/resources/themes/lara-light-cyan/theme.css";
 // import "primereact/resources/primereact.min.css";
 import "primereact/resources/primereact.css";
@@ -9,13 +8,12 @@ import "primeicons/primeicons.css";
 import "primeflex/primeflex.css";
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
-import Head from "./head";
 import { GlobalProvider } from "./GlobalProvider";
 import { PrimeReactProvider } from "primereact/api";
 import { CustomHeader } from "@solidstarters/solid-core-ui";
 import { CustomFooter } from "@solidstarters/solid-core-ui";
 import { LayoutProvider } from "@solidstarters/solid-core-ui";
-import { ToastContainer } from "@solidstarters/solid-core-ui";
+import { SolidThemeLink } from "@solidstarters/solid-core-ui";
 
 const inter = Inter({
   subsets: ["latin"],
@@ -50,7 +48,8 @@ export default async function RootLayout({ children }: { children: React.ReactNo
         <meta content="width=device-width, initial-scale=1" name="viewport" />
         <meta name="description" content="Generated by create next app" />
         <link rel="icon" href="/favicon.ico" />
-        <link id="theme-css" href={`/themes/solid-light-purple/theme.css`} rel="stylesheet"></link>
+        {/* <link id="theme-css" href={`/themes/solid-light-purple/theme.css`} rel="stylesheet"></link> */}
+        <SolidThemeLink />
       </head>
       <body>
         <GlobalProvider entities={solidEntities}>

package/templates/next-template/app/solid-global.css

@@ -0,0 +1,2 @@
+@import url('./globals.css');
+/* @import url('../public/styles/layout/layout.scss'); */

package/templates/next-template/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
+// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.

package/templates/next-template/package-lock.json

@@ -12,7 +12,7 @@
         "@codemirror/theme-one-dark": "^6.1.2",
         "@hello-pangea/dnd": "^17.0.0",
         "@reduxjs/toolkit": "^1.9.5",
-        "@solidstarters/solid-core-ui": "^1.1.9",
+        "@solidstarters/solid-core-ui": "^1.1.19",
         "@types/node": "20.5.9",
         "@types/react": "18.2.21",
         "@types/react-dom": "18.2.7",
@@ -35,7 +35,6 @@
         "moment": "^2.29.4",
         "moment-range": "^4.0.2",
         "mongoose": "^7.5.0",
-        "next": "^14.2.13",
         "next-auth": "^4.23.1",
         "next-connect": "^1.0.0",
         "node-geocoder": "^4.2.0",
@@ -69,7 +68,8 @@
         "@types/lodash": "^4.17.9",
         "@types/pluralize": "^0.0.33",
         "@types/qs": "^6.9.15",
-        "@types/react-js-pagination": "^3.0.7"
+        "@types/react-js-pagination": "^3.0.7",
+        "next": "^14.2.7"
       }
     },
     "node_modules/@babel/runtime": {
@@ -961,9 +961,9 @@
       }
     },
     "node_modules/@solidstarters/solid-core-ui": {
-      "version": "1.1.9",
-      "resolved": "https://registry.npmjs.org/@solidstarters/solid-core-ui/-/solid-core-ui-1.1.9.tgz",
-      "integrity": "sha512-HXMZ9d57jugU9TeNNVXXRDUxuc0RmE1DmgbgspLwJbBpLQizFHAOUvkTRx78TADasow87Aj68sckzyZzuAFajg==",
+      "version": "1.1.19",
+      "resolved": "https://registry.npmjs.org/@solidstarters/solid-core-ui/-/solid-core-ui-1.1.19.tgz",
+      "integrity": "sha512-hkqp5WLxG0DCdZsN2g5BVhhrM2TD00dKIDMml/LMJr8CKsqtWkiACM8dajO8jV3D3EtqeeCA/Vzx+bYJaMqxcQ==",
       "license": "ISC",
       "dependencies": {
         "@hello-pangea/dnd": "^17.0.0",

package/templates/next-template/package.json

@@ -14,7 +14,7 @@
     "@codemirror/theme-one-dark": "^6.1.2",
     "@hello-pangea/dnd": "^17.0.0",
     "@reduxjs/toolkit": "^1.9.5",
-    "@solidstarters/solid-core-ui": "^1.1.9",
+    "@solidstarters/solid-core-ui": "^1.1.19",
     "@types/node": "20.5.9",
     "@types/react": "18.2.21",
     "@types/react-dom": "18.2.7",
@@ -37,7 +37,6 @@
     "moment": "^2.29.4",
     "moment-range": "^4.0.2",
     "mongoose": "^7.5.0",
-    "next": "^14.2.13",
     "next-auth": "^4.23.1",
     "next-connect": "^1.0.0",
     "node-geocoder": "^4.2.0",
@@ -71,6 +70,7 @@
     "@types/lodash": "^4.17.9",
     "@types/pluralize": "^0.0.33",
     "@types/qs": "^6.9.15",
-    "@types/react-js-pagination": "^3.0.7"
+    "@types/react-js-pagination": "^3.0.7",
+    "next": "^14.2.7"
   }
 }

package/templates/next-template/public/styles/layout/_main.scss

@@ -15,6 +15,7 @@ body {
     min-height: 100%;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
+    overflow: hidden;
 }
 
 a {
@@ -22,7 +23,25 @@ a {
     color: var(--primary-color);
 }
 
-// .layout-wrapper {
-//     min-height: 100vh;
-//     display: flex;
-// }
+/* width */
+::-webkit-scrollbar {
+    width: 4px;
+    height: 4px; /* For horizontal scrollbar */
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+    box-shadow: inset 0 0 5px #EFEFEF;
+    border-radius: 10px;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+    background: #ADADAD;
+    border-radius: 10px;
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+    background: #c7c6c6;
+}

package/templates/next-template/public/themes/solid-dark-purple/theme.css

@@ -1166,6 +1166,10 @@
     outline-color: transparent;
   }
 
+  .solid-custom-filter-wrapper .p-chips .p-chips-multiple-container {
+    padding: 0.12rem 0.65625rem;
+  }
+
   .p-chips .p-chips-multiple-container .p-chips-token {
     padding: 0.375rem 0.75rem;
     margin-right: 0.5rem;
@@ -4141,7 +4145,7 @@
     padding: 0.954rem 1rem;
     border: 1px solid #424b57;
     border-width: 1px 0 1px 0;
-    font-weight: 700;
+    font-weight: 600;
     color: rgba(255, 255, 255, 0.87);
     background: #1f2937;
     transition: box-shadow 0.2s;
@@ -6310,7 +6314,7 @@
   .p-dialog .p-dialog-content {
     background: #1f2937;
     color: rgba(255, 255, 255, 0.87);
-    padding: 0 1.5rem 2rem 1.5rem;
+    /* padding: 0 1.5rem 2rem 1.5rem; */
   }
 
   .p-dialog .p-dialog-content:last-of-type {
@@ -7566,6 +7570,11 @@
     outline: 0 none;
   }
 
+  .p-panelmenu-header-content .menuHead:hover {
+    background-color: #424b57;
+    border-radius: 6px;
+  }
+
   .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content {
     border: 1px solid #424b57;
     color: rgba(255, 255, 255, 0.87);
@@ -8882,7 +8891,8 @@
 
 @layer primereact {
   .p-button-label {
-    font-weight: 700;
+    /* font-weight: 700; */
+    font-weight: 400;
   }
 
   .p-selectbutton>.p-button,