forstok-ui-lib 5.9.1 → 5.9.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "forstok-ui-lib",
-  "version": "5.9.1",
+  "version": "5.9.5",
   "description": "Forstok UI Components Library",
   "path": "dist",
   "main": "dist/index.js",

package/src/assets/stylesheets/shares.styles.ts

@@ -576,7 +576,7 @@ const getTabsWrapperModFunc =({ $mode }:{ $mode?: string }) => {
 const getTableItemWrapperModFunc = ({ $mode, $isBorder, $isPopup }:{ $mode: string, $isBorder?: boolean, $isPopup?: boolean }) => {
   let style = `
     ${TableItemColumn} {
-      width: 960px;
+      width: 100%;
       border-bottom: 1px solid var(--pri-clr-ln);
       &:first-child {
         border-bottom: 1px solid var(--sec-clr-ln);
@@ -1040,10 +1040,10 @@ const getTableItemWrapperModFunc = ({ $mode, $isBorder, $isPopup }:{ $mode: stri
     style += `
       ${TableItemColumn} {
         &[role=rowheader] {
-          grid-template-columns: 310px 270px var(--qty-pd20); 
+          grid-template-columns: 270px 270px var(--qty-pd20); 
         }
         &[role=row] {
-          grid-template-columns: 310px auto; 
+          grid-template-columns: 270px auto; 
         }
         &[role=row] > div[role=cellgroup] > div[role=rowgroup], 
         ._refCollapse > div, 
@@ -1063,7 +1063,16 @@ const getTableItemWrapperModFunc = ({ $mode, $isBorder, $isPopup }:{ $mode: stri
         ._refCollapseContainer > div {
           grid-template-columns: 270px var(--qty-pd20);
         }
-        
+      }
+      @media only screen and (min-width: 1024px) {
+        ${TableItemColumn} {
+          &[role=rowheader] {
+            grid-template-columns: 310px 270px var(--qty-pd20); 
+          }
+          &[role=row] {
+            grid-template-columns: 310px auto; 
+          }
+        }
       }
     `
   }
@@ -1775,10 +1784,6 @@ export const HeaderContainer = styled.aside`
 `
 export const TabsContainer = styled.section<{ $mode?: string }>`
   width: 100%;
-  @media only screen and (max-width: 767.9px) {
-    overflow-x: auto;
-    overflow-y: hidden;
-  }
   ${({ $mode }:{ $mode?: string }) => {
     if ($mode === 'master-listing') {
       return css` 

package/src/components/dropdown/styles.ts

@@ -301,7 +301,7 @@ export const DropDownBody = styled.section<{ $area?: string }>`
   max-height: 75vh;
   overflow-x: hidden;
   @media (max-width: 767px) {
-    max-height: 65vh;
+    max-height: 72vh;
   }
   ${getDropDownBodyModifiedStyled}
 `

package/src/components/icon/styles.ts

@@ -54,7 +54,7 @@ const getIconContainerStyled = ({ $mode, $name, $width, onClick }:{ $mode?: stri
     case 'search': 
       style += `
         &:before { 
-          content: url(${IconSearch}); 
+          content: url('https://forstok-staging-storage.s3.ap-southeast-1.amazonaws.com/public/frontend/icons/search.svg'); 
         }
       `
       break;