@indice/ng-components 0.3.2-beta.0 → 0.3.2-beta.10

package/_styles.scss

@@ -279,7 +279,7 @@
     }
 
     .tab-active {
-        @apply border-blue-500 text-blue-600 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
+        @apply border-gray-500 text-gray-900 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
     }
 
     .tab {
@@ -533,7 +533,7 @@
   }
 
   .card {
-    @apply relative h-full border border-gray-200 bg-white shadow-sm rounded-sm overflow-hidden;
+    @apply relative h-full border border-gray-200 bg-gray-50 shadow-sm rounded-lg sm:rounded-3xl overflow-hidden;;
   }
 
   .card-body {
@@ -545,11 +545,11 @@
   }
 
   .card-header {
-    @apply inset-x-0 bg-gray-50 px-4 py-4 sm:px-6 border-b border-gray-200;
+    @apply inset-x-0 px-4 py-6 sm:py-4 sm:px-6 border-b bg-white border-gray-200;
   }
 
   .card-footer {
-    @apply absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6 border-t border-gray-200;
+    @apply absolute bottom-0 inset-x-0 bg-white px-4 py-4 sm:px-6 border-t border-gray-200;
   }
 
   .kpi-tile-title-container {
@@ -572,12 +572,10 @@
     @apply grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2 sm:gap-x-6 p-4;
   }
   
-
   .gallery-deck-3 {
     @apply grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-6 p-4;
   }
   
-
   .gallery-deck-4 {
     @apply grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-6 lg:grid-cols-4 xl:gap-x-8 p-4;
   }
@@ -699,7 +697,7 @@
         @apply flex flex-wrap -mx-1 items-center;
     }
     .datepicker-year {
-        @apply cursor-pointer text-center hover:text-white text-sm rounded-sm leading-loose transition ease-in-out duration-100;
+        @apply cursor-pointer text-center hover:text-white text-sm rounded-md leading-loose transition ease-in-out duration-100;
     }
     .datepicker-year.selected {
         @apply bg-gray-700 text-white font-medium;
@@ -713,7 +711,7 @@
     }
 
     .datepicker-days {
-        @apply cursor-pointer text-center hover:text-white text-sm rounded-sm leading-loose transition ease-in-out duration-100;
+        @apply cursor-pointer text-center hover:text-white text-sm rounded-md leading-loose transition ease-in-out duration-100;
     }
 
     .datepicker-days.selected {
@@ -733,7 +731,7 @@
   }
 
   .dropdown-button {
-    @apply bg-white block w-full rounded-sm border-0 pl-3 py-1.5 pr-10 ring-1 ring-inset ring-gray-200 placeholder:text-gray-300 focus:ring-1 focus:ring-inset focus:ring-gray-500 
+    @apply bg-white block w-full rounded-md border-0 pl-3 py-1.5 pr-10 ring-1 ring-inset ring-gray-200 placeholder:text-gray-300 focus:ring-1 focus:ring-inset focus:ring-gray-500 
     text-xs leading-6 disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-500 disabled:ring-gray-200;
   }
 
@@ -750,7 +748,7 @@
   }
 
   .dropdown-ul {
-    @apply absolute z-50 mt-1 w-auto bg-white shadow-lg max-h-60 rounded-sm py-1 text-xs ring-1 ring-gray-300 ring-opacity-5 focus:outline-none overflow-x-hidden;
+    @apply absolute z-50 mt-1 w-auto bg-white shadow-lg max-h-60 rounded-md py-1 text-xs ring-1 ring-gray-300 ring-opacity-5 focus:outline-none overflow-x-hidden;
   }
 
   .dropdown-li {
@@ -779,11 +777,11 @@
 
 
   .form-layout-container {
-    @apply bg-white shadow-sm border border-gray-200 rounded-sm;
+    @apply bg-white shadow-sm border border-gray-200 rounded-xl;
   }
 
   .form-header {
-    @apply px-4 py-5 sm:px-6 bg-gray-50 sm:flex sm:items-center sm:justify-between;
+    @apply px-4 py-4 bg-gray-50 rounded-t-xl h-24 sm:flex sm:items-center sm:justify-between;
   }
 
   .form-header-inner {
@@ -807,7 +805,7 @@
   }
 
   .form-content-container {
-    @apply border-t border-gray-200 px-4 py-5 sm:p-0;
+    @apply px-4 py-4;
   }
 
   .form-content-container-inner {
@@ -815,7 +813,7 @@
   }
 
   .form-header-search-input {
-    @apply block w-60 bg-gray-50 rounded-sm text-sm text-gray-900 placeholder-gray-500 outline-none;
+    @apply block w-60 bg-gray-50 rounded-md text-sm text-gray-900 placeholder-gray-500 outline-none;
   }
 
   .field-label {
@@ -827,7 +825,7 @@
   }
 
   .form-actions {
-    @apply px-4 py-3 bg-gray-100 text-gray-700 text-right sm:px-6 flex justify-end;
+    @apply -mx-4 -mb-4 mt-4 px-4 sm:px-6 py-3 bg-gray-100 text-gray-700 text-right flex justify-end rounded-b-xl;
   }
 
 /*
@@ -3199,15 +3197,15 @@
   }
 
   .model-view-aside-header-container {
-    @apply bg-white shadow rounded-sm;
+    @apply bg-white shadow-sm border border-gray-200 rounded-xl;
   }
 
   .model-view-aside-header-container-inner {
-    @apply flex flex-col justify-self-stretch bg-gray-50 border-b;
+    @apply flex flex-col bg-gray-50 justify-self-stretch rounded-t-xl h-24;
   }
 
   .model-view-menu-container {
-    @apply mt-2 px-4 py-4 flow-root hidden sm:block;
+    @apply bg-white px-4 py-4 flow-root hidden sm:block rounded-b-xl;
   }
 
   .model-view-menu-container-mobile {
@@ -3960,7 +3958,7 @@
     }
 
     .tab-active {
-        @apply border-blue-500 text-blue-600 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
+        @apply border-gray-500 text-gray-900 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
     }
 
     .tab {
@@ -4150,7 +4148,7 @@
   }
 
   .search-container {
-    @apply relative inline-flex items-center bg-white text-gray-400 focus-within:text-gray-600 hover:shadow-sm border border-gray-200;
+    @apply relative rounded-md inline-flex items-center bg-white text-gray-400 focus-within:text-gray-600 focus:shadow-lg hover:shadow-sm border border-gray-200;
   }
 /* 
   .search-input {
@@ -4158,7 +4156,7 @@
   }  */
 
   .search-input {
-    @apply w-60 rounded-sm text-sm text-gray-900 pt-2 pl-2 pb-2 placeholder-gray-500 outline-none border-0 focus:outline-none focus:ring-0;
+    @apply w-64 focus:w-80 rounded-md text-sm text-gray-900 pt-2 pl-2 pb-2 placeholder-gray-500 outline-none border-0 focus:shadow-lg focus:outline-none focus:ring-0;
   }
 
   .search-button {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@indice/ng-components",
-  "version": "0.3.2-beta.0",
+  "version": "0.3.2-beta.10",
   "description": "Indice common components for Angular v12",
   "repository": {
     "type": "git",