coer-elements 0.0.28 → 0.0.30

package/styles/coer-elements.css

@@ -22,6 +22,169 @@ input[type=file] {
 }
 
 /********** COER styles **********/
+mat-drawer-container {
+  height: calc(100vh - 45px) !important;
+}
+mat-drawer-container .margin-left-40px {
+  margin-left: 40px !important;
+}
+mat-drawer-container mat-drawer {
+  width: auto;
+  min-width: 200px;
+  background-color: var(--black) !important;
+  z-index: 1 !important;
+}
+mat-drawer-container mat-drawer div.mat-drawer-inner-container::-webkit-scrollbar {
+  width: 1px !important;
+}
+mat-drawer-container mat-drawer div.mat-drawer-inner-container::-webkit-scrollbar-thumb {
+  background-color: var(--gray) !important;
+  border-radius: 5px !important;
+}
+mat-drawer-container mat-drawer div.mat-drawer-inner-container::-webkit-scrollbar-thumb:hover {
+  background-color: var(--gray) !important;
+}
+mat-drawer-container mat-drawer div.mat-drawer-inner-container::-webkit-scrollbar-thumb:active {
+  background-color: var(--white) !important;
+}
+mat-drawer-container mat-drawer i {
+  font-size: 16px !important;
+}
+mat-drawer-container mat-drawer div.separator {
+  border: 0.5px solid rgba(245, 245, 245, 0.041) !important;
+}
+mat-drawer-container mat-drawer-content {
+  margin-right: 0px !important;
+}
+mat-drawer-container mat-drawer-content aside.side-nav {
+  background-color: var(--black) !important;
+  width: 40px !important;
+  position: fixed !important;
+  left: 0px !important;
+  top: 45px !important;
+  bottom: 0px !important;
+  cursor: pointer !important;
+}
+mat-drawer-container mat-drawer-content aside.side-nav span.icon-container {
+  width: 100% !important;
+  height: 49.6px !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  font-size: 16px !important;
+  border-bottom: 1px solid rgba(245, 245, 245, 0.041) !important;
+  color: var(--white);
+}
+mat-drawer-container mat-drawer-content aside.side-nav span.icon-container:hover {
+  background-color: #2f2f2f !important;
+}
+mat-drawer-container mat-drawer-content aside.side-nav span.icon-container.active-link {
+  color: var(--orange) !important;
+}
+mat-drawer-container div.backdrop {
+  position: absolute !important;
+  top: 0px !important;
+  left: 0px !important;
+  right: 0px !important;
+  bottom: 0px !important;
+  background-color: rgba(0, 0, 0, 0.3568627451) !important;
+  z-index: 1500 !important;
+}
+
+mat-accordion.coer-tree-accordion div, mat-accordion.coer-tree-accordion span {
+  font-size: 16px !important;
+  font-family: sans-serif !important;
+  font-weight: bold;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel {
+  background-color: var(--black) !important;
+  box-shadow: none !important;
+  border-radius: 0px !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel div.mat-expansion-panel-body {
+  padding: 0px !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel div.separator {
+  border: 0.5px solid rgba(245, 245, 245, 0.041) !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel span::selection {
+  background-color: transparent !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header {
+  padding: 0px 10px;
+  height: 48px !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header span.mat-expansion-indicator {
+  width: 10px !important;
+  margin-left: 15px !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header span.mat-expansion-indicator::after {
+  color: var(--white) !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header mat-panel-description {
+  margin-right: 0px !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header mat-panel-description span.icon-container {
+  height: 48px !important;
+  min-width: 20px !important;
+  max-width: 20px !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  color: var(--white);
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header mat-panel-description span.label-container {
+  height: 48px !important;
+  margin-left: 10px !important;
+  display: flex !important;
+  align-items: center !important;
+  color: var(--white);
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header.text-orange span.mat-expansion-indicator::after {
+  color: var(--orange) !important;
+}
+mat-accordion.coer-tree-accordion mat-expansion-panel mat-expansion-panel-header:not(.background-orange):hover {
+  background-color: #2f2f2f !important;
+}
+
+mat-nav-list.coer-menu-option {
+  padding: 0px !important;
+}
+mat-nav-list.coer-menu-option div, mat-nav-list.coer-menu-option span {
+  font-size: 16px !important;
+  font-family: sans-serif !important;
+  font-weight: bold;
+}
+mat-nav-list.coer-menu-option mat-list-item {
+  padding: 0px 35px 0px 10px !important;
+  display: inline-flex !important;
+  height: 48px !important;
+  color: var(--white);
+}
+mat-nav-list.coer-menu-option mat-list-item span.icon-container {
+  display: inline-flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  height: 48px !important;
+  min-width: 20px !important;
+  max-width: 20px !important;
+  color: var(--white);
+}
+mat-nav-list.coer-menu-option mat-list-item span.label-container {
+  justify-content: flex-start !important;
+  display: inline-flex !important;
+  height: auto !important;
+  margin-left: 10px !important;
+  color: var(--white);
+}
+mat-nav-list.coer-menu-option mat-list-item span.icon-container.active-link,
+mat-nav-list.coer-menu-option mat-list-item span.label-container.active-link {
+  color: var(--orange) !important;
+}
+mat-nav-list.coer-menu-option mat-list-item:hover {
+  background-color: #2f2f2f !important;
+}
+
 * {
   --blue: #0d6efd;
   --gray: #6c757d;
@@ -31,6 +194,7 @@ input[type=file] {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 
 .text-blue {
@@ -386,6 +550,7 @@ div.coer-text-box * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-text-box .text-blue {
   color: #0d6efd !important;
@@ -638,6 +803,7 @@ div.coer-textarea * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-textarea .text-blue {
   color: #0d6efd !important;
@@ -872,6 +1038,7 @@ div.coer-select-box * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-select-box .text-blue {
   color: #0d6efd !important;
@@ -1168,6 +1335,7 @@ div.coer-number-box * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-number-box .text-blue {
   color: #0d6efd !important;
@@ -1428,6 +1596,7 @@ div.coer-switch * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-switch .text-blue {
   color: #0d6efd !important;
@@ -1606,6 +1775,7 @@ div.coer-checkbox * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-checkbox .text-blue {
   color: #0d6efd !important;
@@ -1809,6 +1979,7 @@ div.coer-tab * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-tab .text-blue {
   color: #0d6efd !important;
@@ -2003,6 +2174,7 @@ header.coer-page-title * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 header.coer-page-title .text-blue {
   color: #0d6efd !important;
@@ -2192,6 +2364,7 @@ div.coer-grid * {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 div.coer-grid .text-blue {
   color: #0d6efd !important;
@@ -2559,6 +2732,282 @@ div.modal-content {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
+}
+
+.text-blue {
+  color: #0d6efd !important;
+}
+
+.text-blue-bold {
+  color: #0d6efd !important;
+  font-weight: bold !important;
+}
+
+.background-blue {
+  background-color: #0d6efd !important;
+}
+
+.background-border-blue {
+  background-color: #0d6efd !important;
+  border-color: #0d6efd !important;
+}
+
+.border-blue {
+  border-color: #0d6efd !important;
+}
+
+.text-gray {
+  color: #6c757d !important;
+}
+
+.text-gray-bold {
+  color: #6c757d !important;
+  font-weight: bold !important;
+}
+
+.background-gray {
+  background-color: #6c757d !important;
+}
+
+.background-border-gray {
+  background-color: #6c757d !important;
+  border-color: #6c757d !important;
+}
+
+.border-gray {
+  border-color: #6c757d !important;
+}
+
+.text-green {
+  color: #198754 !important;
+}
+
+.text-green-bold {
+  color: #198754 !important;
+  font-weight: bold !important;
+}
+
+.background-green {
+  background-color: #198754 !important;
+}
+
+.background-border-green {
+  background-color: #198754 !important;
+  border-color: #198754 !important;
+}
+
+.border-green {
+  border-color: #198754 !important;
+}
+
+.text-yellow {
+  color: #ffc107 !important;
+}
+
+.text-yellow-bold {
+  color: #ffc107 !important;
+  font-weight: bold !important;
+}
+
+.background-yellow {
+  background-color: #ffc107 !important;
+}
+
+.background-border-yellow {
+  background-color: #ffc107 !important;
+  border-color: #ffc107 !important;
+}
+
+.border-yellow {
+  border-color: #ffc107 !important;
+}
+
+.text-red {
+  color: #dc3545 !important;
+}
+
+.text-red-bold {
+  color: #dc3545 !important;
+  font-weight: bold !important;
+}
+
+.background-red {
+  background-color: #dc3545 !important;
+}
+
+.background-border-red {
+  background-color: #dc3545 !important;
+  border-color: #dc3545 !important;
+}
+
+.border-red {
+  border-color: #dc3545 !important;
+}
+
+.text-white {
+  color: #f5f5f5 !important;
+}
+
+.text-white-bold {
+  color: #f5f5f5 !important;
+  font-weight: bold !important;
+}
+
+.background-white {
+  background-color: #f5f5f5 !important;
+}
+
+.background-border-white {
+  background-color: #f5f5f5 !important;
+  border-color: #f5f5f5 !important;
+}
+
+.border-white {
+  border-color: #f5f5f5 !important;
+}
+
+.text-black {
+  color: #252525 !important;
+}
+
+.text-black-bold {
+  color: #252525 !important;
+  font-weight: bold !important;
+}
+
+.background-black {
+  background-color: #252525 !important;
+}
+
+.background-border-black {
+  background-color: #252525 !important;
+  border-color: #252525 !important;
+}
+
+.border-black {
+  border-color: #252525 !important;
+}
+
+.text-orange {
+  color: #fd6031 !important;
+}
+
+.text-orange-bold {
+  color: #fd6031 !important;
+  font-weight: bold !important;
+}
+
+.background-orange {
+  background-color: #fd6031 !important;
+}
+
+.background-border-orange {
+  background-color: #fd6031 !important;
+  border-color: #fd6031 !important;
+}
+
+.border-orange {
+  border-color: #fd6031 !important;
+}
+
+aside.toast-container {
+  position: fixed;
+  bottom: 0px;
+  right: 0px;
+  padding: 15px !important;
+  z-index: 2000 !important;
+}
+aside.toast-container i, aside.toast-container svg {
+  display: flex;
+  align-items: center;
+}
+aside.toast-container strong {
+  margin: 0px auto 0px 5px;
+}
+aside.toast-container div.toast,
+aside.toast-container div.toast-header {
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+  color: #f5f5f5;
+}
+aside.toast-container div.toast,
+aside.toast-container div.toast-body {
+  border-bottom-left-radius: 10px;
+  border-bottom-right-radius: 10px;
+  color: #f5f5f5;
+}
+aside.toast-container div.toast-body {
+  min-height: 36px;
+}
+aside.toast-container pre {
+  font-family: Roboto, RobotoFallback, "Noto Kufi Arabic", Helvetica, Arial, sans-serif;
+  white-space: pre-wrap;
+  font-size: medium;
+}
+aside.toast-container button {
+  margin: 0px 2px !important;
+  width: 10px !important;
+  height: 10px !important;
+  box-shadow: none !important;
+  outline: none !important;
+  border: none !important;
+}
+aside.toast-container div#alert-success div.toast-header,
+aside.toast-container div#alert-success div.toast-body {
+  background-color: #198754;
+}
+aside.toast-container div#alert-info div.toast-header,
+aside.toast-container div#alert-info div.toast-body {
+  background-color: #0d6efd;
+}
+aside.toast-container div#alert-error div.toast-header,
+aside.toast-container div#alert-error div.toast-body {
+  background-color: #dc3545;
+}
+aside.toast-container div#alert-warning div.toast-header,
+aside.toast-container div#alert-warning div.toast-body {
+  background-color: #ffc107;
+  border-color: #252525;
+  color: #252525;
+}
+aside.toast-container div#alert-success:hover,
+aside.toast-container div#alert-info:hover,
+aside.toast-container div#alert-error:hover,
+aside.toast-container div#alert-warning:hover {
+  transform: scale(1.01);
+  box-shadow: 2px 2px 10px lightslategray;
+  cursor: default;
+}
+
+button.sweet-alert-button {
+  width: 100px !important;
+  height: 40px !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  margin: 0px 5px !important;
+  outline: none !important;
+  border: none !important;
+  box-shadow: none !important;
+}
+
+aside.toast-container > * {
+  border: none !important;
+  z-index: 2000 !important;
+  margin: 15px 0px 0px 0px !important;
+}
+
+* {
+  --blue: #0d6efd;
+  --gray: #6c757d;
+  --green: #198754;
+  --yellow: #ffc107;
+  --red: #dc3545;
+  --white: #f5f5f5;
+  --black: #252525;
+  --orange: #fd6031;
+  --purple: #a615bc;
 }
 
 .text-blue {
@@ -2807,6 +3256,7 @@ div.modal-content {
   --white: #f5f5f5;
   --black: #252525;
   --orange: #fd6031;
+  --purple: #a615bc;
 }
 
 .text-blue {

package/styles/colors.scss

@@ -7,6 +7,7 @@
     --white: #f5f5f5;
     --black: #252525;
     --orange: #fd6031;
+    --purple: #a615bc;
 }
 
 $blue: #0d6efd;
@@ -17,6 +18,7 @@ $red: #dc3545;
 $white: #f5f5f5;
 $black: #252525;
 $orange: #fd6031;
+$purple: #a615bc;
 
 //Blue
 .text-blue {

package/tools/lib/colors.class.d.ts

@@ -0,0 +1,21 @@
+export declare class Colors {
+    static readonly blue = "#0d6efd";
+    static readonly gray = "#6c757d";
+    static readonly green = "#198754";
+    static readonly yellow = "#ffc107";
+    static readonly red = "#dc3545";
+    static readonly white = "#f5f5f5";
+    static readonly black = "#252525";
+    static readonly orange = "#fd6031";
+    static readonly purple = "#a615bc";
+    /** Returns the color palette in hexadecimal */
+    private static readonly colorsHex;
+    /** Returns the color palette in RGB */
+    private static readonly ColorsRGB;
+    /** Returns a random color in hexadecimal */
+    static GetRandomColorHex: () => string;
+    /** Returns the number of colors requested */
+    static GetColorHexList(quantity: number): string[];
+    /** Returns the number of colors requested with opacity */
+    static GetColorRGBList(quantity: number): string[];
+}

package/tools/lib/menu.class.d.ts

@@ -2,7 +2,7 @@ import { IMenuOptionSelected } from "coer-elements/interfaces";
 export declare class Menu {
     private static readonly storage;
     /** */
-    static Set(menu: IMenuOptionSelected): void;
+    static SetSelectedOption(menu: IMenuOptionSelected): void;
     /** */
-    static Get(): IMenuOptionSelected | null;
+    static GetSelectedOption(): IMenuOptionSelected | null;
 }

package/tools/public-api.d.ts

@@ -1,5 +1,6 @@
 export * from './lib/coer-alert/coer-alert.component';
 export * from './lib/breadcrumbs.class';
+export * from './lib/colors.class';
 export * from './lib/control-value.class';
 export * from './lib/date-time.class';
 export * from './lib/files.class';

package/esm2022/signals/lib/menu.signal.mjs

@@ -1,3 +0,0 @@
-import { signal } from "@angular/core";
-export const menuSIGNAL = signal([]);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWVudS5zaWduYWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2VyLWVsZW1lbnRzL3NpZ25hbHMvbGliL21lbnUuc2lnbmFsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFdkMsTUFBTSxDQUFDLE1BQU0sVUFBVSxHQUFHLE1BQU0sQ0FBVSxFQUFFLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IHNpZ25hbCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCB7IElNZW51IH0gZnJvbSBcImNvZXItZWxlbWVudHMvaW50ZXJmYWNlc1wiO1xyXG5leHBvcnQgY29uc3QgbWVudVNJR05BTCA9IHNpZ25hbDxJTWVudVtdPihbXSk7Il19

package/signals/lib/menu.signal.d.ts

@@ -1,2 +0,0 @@
-import { IMenu } from "coer-elements/interfaces";
-export declare const menuSIGNAL: import("@angular/core").WritableSignal<IMenu[]>;