@pepperi-addons/ngx-lib 0.2.61-query-builder.2 → 0.3.0

package/src/core/style/components/textarea.scss

@@ -1,198 +1,207 @@
-@use '../abstracts/mixins';
-@use '../abstracts/functions';
-
-// -----------------------------------------------------
-//  Textarea & Override material style
-// -----------------------------------------------------
-.pepperi-textarea-container, .pep-textarea-container {
-    height: inherit;
-    display: grid;
-    align-items: center;
-
-    // Hide scroll
-    .mat-form-field {
-        .mat-form-field-wrapper {
-            .mat-form-field-flex {
-                display: flex;
-            }
-
-            .mat-form-field-infix {
-                line-height: unset;
-                width: 100%;
-                height: 100%;
-                overflow: hidden;
-                display: grid !important;
-            }
-
-            .mat-input-element {
-                margin: 0;
-                padding: 0.5rem 1.5rem 0.5rem 0;
-                vertical-align: unset;
-                resize: none;
-                // @include calc(width, '100% + 3rem');
-                width: calc(100% + 3rem);
-                max-width: unset;
-                overflow-y: scroll;
-                // @include mixins.box-sizing(border-box);
-                box-sizing: border-box;
-            }
-        }
-
-        .mat-form-field-prefix,
-        .mat-form-field-suffix {
-            align-self: flex-end !important;
-            margin-bottom: 0.5rem;
-        }
-
-    }
-
-    &.one-row {
-        .mat-form-field {
-            .mat-form-field-wrapper {
-                .mat-form-field-infix {
-                    .mat-input-element {
-                        padding-top: 0.35rem;
-                    }
-                }
-
-                .mat-form-field-prefix,
-                .mat-form-field-suffix {
-                    align-self: center !important;
-                    margin-bottom: unset;
-
-                    .card-one-row-icon {
-                        .pepperi-button, .pep-button {
-                            width: 1rem !important;
-                            height: 1rem !important;
-                        }
-                    }
-                }
-            }
-
-            &.pepperi-table-textarea, &.pep-table-textarea {
-                .mat-input-element {
-                    padding-top: 0.135rem !important;
-                }
-            }
-        }
-    }
-
-    .rich-text-cont {
-        overflow-x: hidden;
-        display: inline-block;
-        // vertical-align: middle;
-        vertical-align: unset;
-        margin: 0;
-        padding: 0.5rem 1.5rem 0.5rem 0;
-        resize: none;
-        // @include calc(width, '100% + 3rem');
-        width: calc(100% + 3rem);
-        max-width: unset;
-        overflow-y: scroll;
-        // @include mixins.box-sizing(border-box);
-        box-sizing: border-box;
-    }
-
-    &.right-alignment {
-        .mat-form-field {
-            .mat-form-field-wrapper {
-                .mat-input-element {
-                    padding: 0.5rem 0 0.5rem 1.5rem;
-                }
-            }
-        }
-
-        .rich-text-cont {
-            padding: 0.5rem 0 0.5rem 1.5rem;
-        }
-    }
-}
-
-.pepperi-textarea-card-container, .pep-textarea-card-container {
-    .mat-form-field {
-        .mat-form-field-wrapper {
-
-            .mat-form-field-flex {
-                padding-left: 0.5rem;
-                padding-right: 0.5rem;
-
-                .mat-input-element {
-                    padding: 0.25rem 1.5rem 0.5rem 0;
-                }
-            }
-        }
-    }
-
-    &.card-flex-container {
-        height: inherit;
-        display: flex;
-        @include mixins.ellipsis();
-        white-space: unset;
-        // padding: 0.5rem 1.5rem 0.5rem 0;
-        padding: 0.25rem;
-
-        &.one-row {
-            .title {
-                padding-top: 0.25rem;
-            }
-        }
-
-        span {
-            &.value {
-                @include mixins.ellipsis();
-                white-space: unset;
-            }
-        }
-    }
-
-    &.one-row {
-        .mat-form-field {
-            .mat-form-field-wrapper {
-                .mat-form-field-infix {
-                    line-height: 0 !important;
-
-                    .mat-input-element {
-                        padding-top: 0;
-                        padding-bottom: 0;
-                    }
-                }
-            }
-        }
-    }
-
-    &.right-alignment {
-        .mat-form-field {
-            .mat-form-field-wrapper {
-                .mat-input-element {
-                    padding: 0.25rem 0 0.5rem 1.5rem;
-                }
-            }
-        }
-    }
-}
-
-.pepperi-report-textarea, .pep-report-textarea {
-    .mat-form-field-wrapper {
-        // margin-top: 0 !important;
-    }
-
-    .mat-form-field-suffix {
-        right: 0 !important;
-    }
-
-    &.readonly {
-        .mat-form-field-wrapper {
-            .mat-form-field-flex {
-                padding: 0;
-            }
-        }
-    }
-}
-
-@mixin pep-textarea-theme() {
-    .pepperi-report-textarea, .pep-report-textarea {
-        .mat-form-field-flex {
-            background: transparent !important;
-        }
-    }
-}
+@use '../abstracts/mixins';
+@use '../abstracts/functions';
+
+// -----------------------------------------------------
+//  Textarea & Override material style
+// -----------------------------------------------------
+.pepperi-textarea-container, .pep-textarea-container {
+    height: inherit;
+    display: grid;
+    align-items: center;
+
+    // Hide scroll
+    ::ng-deep {
+        .mat-form-field {
+            .mat-form-field-wrapper {
+                .mat-form-field-flex {
+                    display: flex;
+                }
+
+                .mat-form-field-infix {
+                    line-height: unset;
+                    width: 100%;
+                    height: 100%;
+                    overflow: hidden;
+                    display: grid !important;
+                }
+
+                .mat-input-element {
+                    margin: 0;
+                    padding: 0.5rem 1.5rem 0.5rem 0;
+                    vertical-align: unset;
+                    resize: none;
+                    // @include calc(width, '100% + 3rem');
+                    width: calc(100% + 3rem);
+                    max-width: unset;
+                    overflow-y: scroll;
+                    // @include mixins.box-sizing(border-box);
+                    box-sizing: border-box;
+                }
+            }
+
+            .mat-form-field-prefix,
+            .mat-form-field-suffix {
+                align-self: flex-end !important;
+                margin-bottom: 0.5rem;
+            }
+
+        }
+    }
+
+    &.one-row {
+        ::ng-deep {
+            .mat-form-field {
+                .mat-form-field-wrapper {
+                    .mat-form-field-infix {
+                        .mat-input-element {
+                            padding-top: 0.35rem;
+                        }
+                    }
+
+                    .mat-form-field-prefix,
+                    .mat-form-field-suffix {
+                        align-self: center !important;
+                        margin-bottom: unset;
+
+                        .card-one-row-icon {
+                            .pepperi-button, .pep-button {
+                                width: 1rem !important;
+                                height: 1rem !important;
+                            }
+                        }
+                    }
+                }
+
+                &.pepperi-table-textarea, &.pep-table-textarea {
+                    .mat-input-element {
+                        padding-top: 0.135rem !important;
+                    }
+                }
+            }
+        }
+    }
+
+    .rich-text-cont {
+        overflow-x: hidden;
+        display: inline-block;
+        // vertical-align: middle;
+        vertical-align: unset;
+        margin: 0;
+        padding: 0.5rem 1.5rem 0.5rem 0;
+        resize: none;
+        // @include calc(width, '100% + 3rem');
+        width: calc(100% + 3rem);
+        max-width: unset;
+        overflow-y: scroll;
+        // @include mixins.box-sizing(border-box);
+        box-sizing: border-box;
+    }
+
+    &.right-alignment {
+        ::ng-deep {
+            .mat-form-field {
+                .mat-form-field-wrapper {
+                    .mat-input-element {
+                        padding: 0.5rem 0 0.5rem 1.5rem;
+                    }
+                }
+            }
+        }
+
+        .rich-text-cont {
+            padding: 0.5rem 0 0.5rem 1.5rem;
+        }
+    }
+}
+
+.pepperi-textarea-card-container, .pep-textarea-card-container {
+    ::ng-deep {
+        .mat-form-field {
+            .mat-form-field-wrapper {
+
+                .mat-form-field-flex {
+                    padding-left: 0.5rem;
+                    padding-right: 0.5rem;
+
+                    .mat-input-element {
+                        padding: 0.25rem 1.5rem 0.5rem 0;
+                    }
+                }
+            }
+        }
+    }
+
+    &.card-flex-container {
+        height: inherit;
+        display: flex;
+        @include mixins.ellipsis();
+        white-space: unset;
+        // padding: 0.5rem 1.5rem 0.5rem 0;
+        padding: 0.25rem;
+        max-width: 100%;
+
+        &.one-row {
+            .title {
+                padding-top: 0.25rem;
+            }
+        }
+
+        span {
+            &.value {
+                @include mixins.ellipsis();
+                white-space: unset;
+            }
+        }
+    }
+
+    &.one-row {
+        ::ng-deep {
+            .mat-form-field {
+                .mat-form-field-wrapper {
+                    .mat-form-field-infix {
+                        line-height: 0 !important;
+
+                        .mat-input-element {
+                            padding-top: 0;
+                            padding-bottom: 0;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    &.right-alignment {
+        ::ng-deep {
+            .mat-form-field {
+                .mat-form-field-wrapper {
+                    .mat-input-element {
+                        padding: 0.25rem 0 0.5rem 1.5rem;
+                    }
+                }
+            }
+        }
+    }
+}
+
+.pepperi-report-textarea, .pep-report-textarea {
+    .mat-form-field-suffix {
+        right: 0 !important;
+    }
+
+    &.readonly {
+        .mat-form-field-wrapper {
+            .mat-form-field-flex {
+                padding: 0;
+            }
+        }
+    }
+}
+
+@mixin pep-textarea-theme() {
+    .pepperi-report-textarea, .pep-report-textarea {
+        ::ng-deep.mat-form-field-flex {
+            background: transparent !important;
+        }
+    }
+}

package/src/core/style/themes/black-theme.scss

@@ -1,7 +1,7 @@
-@use '~@angular/material' as mat;
-$material-black-primary: mat.define-palette(mat.$grey-palette, 700, 300, 900);
-$material-black-accent: mat.define-palette(mat.$blue-grey-palette, 400);
-$material-black-warn: mat.define-palette(mat.$red-palette, 500);
-
-$material-black-theme: mat.define-dark-theme($material-black-primary, $material-black-accent, $material-black-warn);
-$user-black-theme-color: #39413e;
+@use '~@angular/material' as mat;
+$material-black-primary: mat.define-palette(mat.$grey-palette, 700, 300, 900);
+$material-black-accent: mat.define-palette(mat.$blue-grey-palette, 400);
+$material-black-warn: mat.define-palette(mat.$red-palette, 500);
+
+$material-black-theme: mat.define-dark-theme($material-black-primary, $material-black-accent, $material-black-warn);
+$user-black-theme-color: #39413e;