@volo/ngx-lepton-x.lite 3.3.1 → 4.0.0-rc.1

package/assets/css/bootstrap-dim.css

@@ -2981,6 +2981,7 @@ textarea.form-control-lg {
 
 .form-control,
 .form-select {
+  font-weight: 400;
   background-color: #f5f5f7;
   border-radius: 0.5rem;
   transition: background-color 0.2s, border-color 0.4s;
@@ -2994,21 +2995,50 @@ textarea.form-control-lg {
   border-color: #e7e9ec;
   color: #161616;
 }
+.form-control:disabled,
+.form-select:disabled {
+  color: rgba(104, 107, 110, 0.5);
+  border-color: #e7e9ec;
+  background-color: #e7e9ec;
+}
+
+.form-control[disabled]::placeholder {
+  color: rgba(104, 107, 110, 0.5);
+}
+.form-control[disabled] ~ .input-group-text {
+  color: rgba(104, 107, 110, 0.5) !important;
+  background-color: #f5f6f8 !important;
+}
 
 .input-group-text {
   border-color: #e7e9ec;
   background-color: #ffffff;
 }
+.input-group-text.disabled {
+  color: rgba(104, 107, 110, 0.5) !important;
+  background-color: #f5f6f8 !important;
+}
 
 .form-check-input {
   border-width: 1px;
   border-color: #e7e9ec !important;
 }
-
 .form-check-input:checked {
   border-color: #f72585 !important;
   background-color: #f72585 !important;
 }
+.form-check-input[disabled] {
+  opacity: 1;
+  background-color: #e7e9ec;
+}
+.form-check-input[disabled]:checked {
+  border-color: rgba(104, 107, 110, 0.1) !important;
+  background-color: rgba(104, 107, 110, 0.5) !important;
+}
+.form-check-input[disabled] ~ .form-check-label {
+  color: rgba(104, 107, 110, 0.5);
+  opacity: 1;
+}
 
 .form-switch .form-check-input:focus {
   outline: 0;
@@ -3035,6 +3065,9 @@ textarea.form-control-lg {
 .form-select {
   background-position: right 0.75rem center;
 }
+.form-select:disabled {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23A2B1BD' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
+}
 
 select.form-select option:checked, select.form-select option:focus, select.form-select option:active {
   background: #f72585 !important;
@@ -3045,7 +3078,8 @@ select.form-select option:checked[selected], select.form-select option:focus[sel
   color: #fff !important;
 }
 
-.input-group > .form-control:focus, .input-group > .form-select:focus {
+.input-group > .form-control:focus,
+.input-group > .form-select:focus {
   z-index: 1;
 }
 
@@ -3058,7 +3092,10 @@ select.form-select option:checked[selected], select.form-select option:focus[sel
   border-color: #c00d49 !important;
 }
 
-.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label {
+.form-floating > .form-control:focus ~ label,
+.form-floating > .form-control:not(:placeholder-shown) ~ label,
+.form-floating > .form-control-plaintext ~ label,
+.form-floating > .form-select ~ label {
   opacity: 0.75;
   transform: scale(0.8) translateY(-0.15rem) translateX(0.35rem);
 }
@@ -4980,6 +5017,14 @@ select.form-select option:checked[selected], select.form-select option:focus[sel
 .card .card-footer {
   padding-top: 0;
 }
+@media only screen and (max-width: 767px) {
+  .card {
+    margin-bottom: 16px;
+  }
+  .card .card-body {
+    padding: 16px;
+  }
+}
 
 .accordion-item {
   background-color: #ffffff !important;

package/assets/css/bootstrap-dim.rtl.css

@@ -3010,6 +3010,7 @@ textarea.form-control-lg {
 
 .form-control,
 .form-select {
+  font-weight: 400;
   background-color: #f5f5f7;
   border-radius: 0.5rem;
   transition: background-color 0.2s, border-color 0.4s;
@@ -3023,21 +3024,54 @@ textarea.form-control-lg {
   border-color: #e7e9ec;
   color: #161616;
 }
+.form-control:disabled,
+.form-select:disabled {
+  color: rgba(104, 107, 110, 0.5);
+  border-color: #e7e9ec;
+  background-color: #e7e9ec;
+}
+
+.form-control[disabled]::-moz-placeholder {
+  color: rgba(104, 107, 110, 0.5);
+}
+
+.form-control[disabled]::placeholder {
+  color: rgba(104, 107, 110, 0.5);
+}
+.form-control[disabled] ~ .input-group-text {
+  color: rgba(104, 107, 110, 0.5) !important;
+  background-color: #f5f6f8 !important;
+}
 
 .input-group-text {
   border-color: #e7e9ec;
   background-color: #ffffff;
 }
+.input-group-text.disabled {
+  color: rgba(104, 107, 110, 0.5) !important;
+  background-color: #f5f6f8 !important;
+}
 
 .form-check-input {
   border-width: 1px;
   border-color: #e7e9ec !important;
 }
-
 .form-check-input:checked {
   border-color: #f72585 !important;
   background-color: #f72585 !important;
 }
+.form-check-input[disabled] {
+  opacity: 1;
+  background-color: #e7e9ec;
+}
+.form-check-input[disabled]:checked {
+  border-color: rgba(104, 107, 110, 0.1) !important;
+  background-color: rgba(104, 107, 110, 0.5) !important;
+}
+.form-check-input[disabled] ~ .form-check-label {
+  color: rgba(104, 107, 110, 0.5);
+  opacity: 1;
+}
 
 .form-switch .form-check-input:focus {
   outline: 0;
@@ -3064,6 +3098,9 @@ textarea.form-control-lg {
 .form-select {
   background-position: left 0.75rem center;
 }
+.form-select:disabled {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23A2B1BD' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
+}
 
 select.form-select option:checked, select.form-select option:focus, select.form-select option:active {
   background: #f72585 !important;
@@ -3074,7 +3111,8 @@ select.form-select option:checked[selected], select.form-select option:focus[sel
   color: #fff !important;
 }
 
-.input-group > .form-control:focus, .input-group > .form-select:focus {
+.input-group > .form-control:focus,
+.input-group > .form-select:focus {
   z-index: 1;
 }
 
@@ -3092,7 +3130,10 @@ select.form-select option:checked[selected], select.form-select option:focus[sel
   transform: scale(0.8) translateY(-0.15rem) translateX(-0.35rem);
 }
 
-.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label {
+.form-floating > .form-control:focus ~ label,
+.form-floating > .form-control:not(:placeholder-shown) ~ label,
+.form-floating > .form-control-plaintext ~ label,
+.form-floating > .form-select ~ label {
   opacity: 0.75;
   transform: scale(0.8) translateY(-0.15rem) translateX(-0.35rem);
 }
@@ -5016,6 +5057,14 @@ select.form-select option:checked[selected], select.form-select option:focus[sel
 .card .card-footer {
   padding-top: 0;
 }
+@media only screen and (max-width: 767px) {
+  .card {
+    margin-bottom: 16px;
+  }
+  .card .card-body {
+    padding: 16px;
+  }
+}
 
 .accordion-item {
   background-color: #ffffff !important;

package/assets/css/side-menu/layout-bundle.css

@@ -85,7 +85,7 @@ select:-webkit-autofill:focus {
 }
 @media only screen and (max-width: 767px) {
   .lpx-content-container .lpx-content {
-    padding: 3em 2em 4em 2em;
+    padding: 3em 1.14em 4em 1.14em;
   }
 }
 
@@ -119,6 +119,12 @@ select:-webkit-autofill:focus {
   margin-bottom: 0.875rem;
   margin-top: 0.875rem;
 }
+@media only screen and (max-width: 767px) {
+  .lpx-main-title {
+    margin-bottom: 0;
+    margin-top: 0;
+  }
+}
 
 .login-section-wrapper {
   height: 100vh;

package/assets/css/side-menu/layout-bundle.rtl.css

@@ -86,7 +86,7 @@ select:-webkit-autofill:focus {
 }
 @media only screen and (max-width: 767px) {
   .lpx-content-container .lpx-content {
-    padding: 3em 2em 4em 2em;
+    padding: 3em 1.14em 4em 1.14em;
   }
 }
 
@@ -120,6 +120,12 @@ select:-webkit-autofill:focus {
   margin-bottom: 0.875rem;
   margin-top: 0.875rem;
 }
+@media only screen and (max-width: 767px) {
+  .lpx-main-title {
+    margin-bottom: 0;
+    margin-top: 0;
+  }
+}
 
 .login-section-wrapper {
   height: 100vh;

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@volo/ngx-lepton-x.lite",
-  "version": "3.3.1",
+  "version": "4.0.0-rc.1",
   "dependencies": {
     "tslib": "^2.3.0",
     "bootstrap-icons": "~1.7.2",
     "@ng-bootstrap/ng-bootstrap": "~16.0.0",
-    "@volo/ngx-lepton-x.core": "3.3.1"
+    "@volo/ngx-lepton-x.core": "4.0.0-rc.1"
   },
   "publishConfig": {
     "access": "public"