coer-elements 0.0.94 → 0.0.96

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "coer-elements",
-  "version": "0.0.94",
+  "version": "0.0.96",
   "author": "Christian Omar Escamilla Rodríguez",
   "keywords": [
     "COER",

package/styles/angular-material.scss

@@ -17,5 +17,4 @@
 @use "../components/lib/coer-tab/coer-tab.component.scss";
 @use "../components/lib/coer-textarea/coer-textarea.component.scss";
 @use "../components/lib/coer-textbox/coer-textbox.component.scss";
-@use "../tools/lib/coer-alert/coer-alert.component.scss";
- 
+@use "../tools/lib/coer-alert/coer-alert.component.scss"; 

package/styles/coer-elements.css

@@ -405,13 +405,6 @@ div.coer-button .mat-mdc-button-touch-target {
   height: 0px !important;
 }
 
-div#coer-tool-bar coer-button * {
-  color: var(--orange) !important;
-}
-div#coer-tool-bar coer-dropdown coer-button * {
-  color: transparent !important;
-}
-
 div.coer-checkbox mat-checkbox div.mdc-form-field.mat-internal-form-field div.mdc-checkbox {
   padding: 10px !important;
 }
@@ -694,6 +687,7 @@ div.coer-grid div.loading {
   background-color: rgba(187, 187, 187, 0.5137254902) !important;
   flex-direction: column !important;
   gap: 10px !important;
+  z-index: 1;
 }
 div.coer-grid div.loading span.fa-fade {
   position: relative !important;
@@ -1071,7 +1065,7 @@ div.coer-dropdown ul.dropdown-menu {
   border-top-left-radius: 0px !important;
   border-top-right-radius: 0px !important;
   max-height: 205px !important;
-  width: 100% !important;
+  width: 100%;
   overflow: auto !important;
   padding: 0px !important;
 }
@@ -1269,7 +1263,7 @@ mat-drawer-container mat-drawer {
   width: auto;
   min-width: 200px;
   background-color: var(--black) !important;
-  z-index: 1 !important;
+  z-index: 3 !important;
 }
 mat-drawer-container mat-drawer div.mat-drawer-inner-container::-webkit-scrollbar {
   width: 1px !important;
@@ -1351,6 +1345,9 @@ mat-nav-list.coer-menu-option mat-list-item span.icon-container {
   max-width: 20px !important;
   color: var(--white);
 }
+mat-nav-list.coer-menu-option mat-list-item span.icon-container i {
+  min-height: 16px !important;
+}
 mat-nav-list.coer-menu-option mat-list-item span.label-container {
   justify-content: flex-start !important;
   display: inline-flex !important;
@@ -2044,3 +2041,21 @@ input[type=file] {
 .no-selection::selection {
   background-color: transparent !important;
 }
+
+div#coer-tool-bar coer-button * {
+  color: var(--orange) !important;
+}
+div#coer-tool-bar coer-dropdown coer-button * {
+  color: transparent !important;
+}
+div#coer-tool-bar coer-dropdown ul {
+  right: 0px !important;
+  width: auto !important;
+  top: 2px !important;
+  border-top: 0px !important;
+  background-color: whitesmoke !important;
+}
+div#coer-tool-bar coer-dropdown ul li:not(.no-options):hover {
+  color: black !important;
+  background-color: rgb(240.618852459, 246.3831967213, 254.881147541) !important;
+}

package/styles/index.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use "./angular-material.scss";
 @use "./bootstrap.scss";
 @use "./colors.scss";
@@ -29,4 +30,29 @@ input[type="file"] {
 
 .no-selection::selection {
     background-color: transparent !important;
-}
+} 
+
+
+div#coer-tool-bar {  
+    coer-button * {
+        color: var(--orange) !important;
+    }
+
+    coer-dropdown coer-button * {
+        color: transparent !important;
+    } 
+
+    coer-dropdown ul {
+        right: 0px !important;
+        width: auto !important;
+        top: 2px !important;
+        border-top: 0px !important;
+        background-color: whitesmoke !important;
+    
+        li:not(.no-options):hover{
+            color: black !important;
+            background-color: color.adjust(#0d6efd, $lightness: 45%) !important;
+        }
+    }
+}
+

package/tools/lib/elements-html.class.d.ts

@@ -0,0 +1,6 @@
+export declare const ElementsHTML: {
+    /** Get width in px */
+    GetElementWidth: (element: HTMLElement | null | undefined, ...args: (number | HTMLElement | null | undefined)[]) => string;
+    /** Get height in px */
+    GetElementHeight: (element: HTMLElement | null | undefined, ...args: (number | HTMLElement | null | undefined)[]) => string;
+};

package/tools/public-api.d.ts

@@ -4,6 +4,7 @@ export * from './lib/coer-grid.templates';
 export * from './lib/colors.class';
 export * from './lib/control-value.class';
 export * from './lib/date-time.class';
+export * from './lib/elements-html.class';
 export * from './lib/files.class';
 export * from './lib/user.class';
 export * from './lib/filters.class';