aio-table 2.1.0 → 5.0.1

package/index.css

@@ -9,6 +9,8 @@
   position: relative;
   color:#999;
   font-size:14px;
+  overflow: hidden;
+  height:500px;
 }
 .aio-table.rtl{
   direction:rtl;
@@ -16,7 +18,7 @@
 .aio-table-body{
     display: flex;
     width:100%;
-    overflow:hidden;
+    flex:1;
 }
 .aio-table-unit{
     display: grid;
@@ -58,20 +60,20 @@
     background-color: #868e9e;
   }
 .aio-table-title{
-    background:#fff;
     display:flex;
     align-items: center;
     padding:0 6px;
     position:sticky;
     box-sizing:border-box;
     position: -webkit-sticky;
+    background: #fff;
     z-index:100;
     border-bottom:1px solid #ddd;
     border-left:1px solid #ddd;
-    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.2);
+    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.1);
 }
 .aio-table.rtl .aio-table-title{
-    box-shadow: -1px 4px 6px -2px rgba(0,0,0,0.2);
+    box-shadow: -1px 4px 6px -2px rgba(0,0,0,0.1);
 }
 .aio-table-title-text{
   flex:1;
@@ -101,16 +103,30 @@
 .aio-table-cell{
     display:flex;
     align-items: center;
-    background:#fff;
-    padding:6px 8px;
+    padding:0 8px;
     box-sizing: border-box;
     position: relative;
-    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.2);
+    box-shadow: 3px 4px 6px -2px rgba(0,0,0,0.1);
     white-space:nowrap;
     text-overflow:ellipsis;
+    background:#fff;
+}
+.aio-table-content{
+  width:100%;
+  overflow:hidden;
+  display: flex;
+}
+.aio-table-icon{
+  height:24px;
+  display:flex;
+  font-size:16px;
+  align-items: center;
+  justify-content: center;
+  width:fit-content;
 }
+
 .aio-table.rtl .aio-table-cell{
-    box-shadow: -1px 4px 6px -2px rgba(0,0,0,0.2);
+    box-shadow: -3px 4px 6px -2px rgba(0,0,0,0.1);
 }
 
 .aio-table-input-container{
@@ -126,19 +142,23 @@
   justify-content: flex-start;
   max-height:75%;
 }
+.aio-table-input-container.on-template{
+  flex:1;
+  position: absolute;
+  max-height:100%;
+}
 .aio-table-input{
     border:none;
     outline:none;
     flex:1;
     width:100%;
     position:relative;
-    color:inherit;
+    color:inherit; 
     font-size:inherit;
     
 }
 select.aio-table-input{
     background: rgba(0,0,0,0.02);
-    
 }
 .aio-table-input-border{
     height:2px;
@@ -152,19 +172,11 @@ select.aio-table-input{
     width:100%;
     transition: 0.3s;
 }
-.aio-table-icon{
-    height:24px;
-    display:flex;
-    font-size:16px;
-    align-items: center;
-    justify-content: center;
-}
 
 .aio-table-nodata{
   display:flex;
   align-items: center;
   justify-content: center;
-  background:#fff;
 }
 
 .aio-table-paging{
@@ -265,6 +277,8 @@ select.aio-table-paging-button{
   }
   .aio-table-filter-icon button{
     color:inherit;
+    height:100%;
+    background:none;
   }
 
   .aio-table-filter-item{
@@ -314,21 +328,6 @@ select.aio-table-paging-button{
     align-items: center;
     justify-content: center;
     margin-bottom: 6px;
-    font-size:16px;
-    font-weight:bold;
-  }
-
-  .aio-table-checkbox{
-    width:100%;
-    height:100%;
-    display:flex;
-    align-items: center;
-    justify-content: center;
-    cursor:pointer;
-  }
-  .aio-table-checkbox.disabled{
-    opacity:0.2;
-    cursor:not-allowed;
   }
   .aio-table-group{
     display:flex;
@@ -338,18 +337,30 @@ select.aio-table-paging-button{
     white-space:nowrap;
     background:#fff;
     text-overflow:ellipsis;
+    overflow: hidden;
     position:relative;
-    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.2);
+    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.1);
+  }
+  .aio-table-group-text{
+    height:100%;
+    display: flex;
+    flex:1;
+    align-items: center;
+    white-space: pre-wrap;
   }
   .aio-table-toolbar{
-    background:#fff;
-    padding:6px;
+    padding:0 6px;
     display:flex;
     align-items: center;
     flex-shrink:0;
-    border-bottom:1px solid #ddd;
+    height:36px;
+  }
+  @media print{
+    .aio-table-toolbar{
+      display:none;
+    }
   }
-  .aio-table-toolbar-dropdown{
+  .aio-table-toolbar-button{
     background:dodgerblue;
     color:#fff;
     height:30px;
@@ -358,7 +369,7 @@ select.aio-table-paging-button{
   }
 
   .aio-table-splitter{
-    width:1px;
+    width:2px;
     background:#ddd;
     position:relative;
     display: flex;
@@ -372,7 +383,7 @@ select.aio-table-paging-button{
     cursor:col-resize;
     position:absolute;
     height:100%;
-    width:5px;
+    width:6px;
     flex:1;
     background:red;
   }
@@ -381,7 +392,7 @@ select.aio-table-paging-button{
     flex:1;
     border-radius:36px;
     margin:0 6px;
-    background:rgba(0,0,0,.06);
+    background:#fff;
     height:30px;
     display:flex;
     align-items: center;
@@ -407,7 +418,7 @@ select.aio-table-paging-button{
   .aio-table-cell-gantt .r-range-slider{
     flex:1;
     padding:0;
-    height:100%;
+    height:24px;
   }
   .aio-table-cell-gantt .r-range-slider-fill{
     height:16px !important;
@@ -415,10 +426,74 @@ select.aio-table-paging-button{
   }
   .aio-table-cell-gantt .r-range-slider-fill-container div:not(.r-range-slider-fill){
     z-index:1;
-    color:#fff;
     font-size:10px;
   }
   .aio-table-cell-gantt .r-range-slider-point{
     border-radius:0;
     background:rgba(0, 174, 255, 0);
-  }
+  }
+  .aio-table-arrow-up,.aio-table-arrow-down{
+    width:30px;
+    height:24px;
+    display:flex;
+    align-items: center;
+    justify-content: flex-end;
+  }
+  .aio-table-arrow-up:after{
+    content:'';
+    border-bottom:8px solid;
+    border-left:8px solid transparent;
+    border-right:8px solid transparent;
+  }
+  .aio-table-arrow-down:after{
+    content:'';
+    border-top:8px solid;
+    border-left:8px solid transparent;
+    border-right:8px solid transparent;
+  }
+  .aio-table-card{
+    background:#fff;
+    position:relative;
+    display:flex;
+    box-sizing: border-box;
+  }
+
+  .r-layout-item{
+  overflow:auto;
+  display:flex;
+  position: relative;
+  flex-grow:0;
+  flex-shrink: 0;
+  }
+.r-layout-parent{
+position:relative;
+display:flex;
+flex-grow:0;
+flex-shrink: 0;
+overflow:auto;
+}
+.r-layout-html{
+position: absolute;
+width:100%;
+height:100%;
+left:0;
+top:0;
+overflow:hidden;
+}
+.r-layout-gap{
+flex-shrink:0;
+}
+.r-layout-gap:last-child{
+display:none;
+}
+
+@media screen and (max-width: 768px) {
+.r-layout-hide-in-small {
+  display: none !important;
+}
+}
+@media screen and (min-width: 768px) {
+.r-layout-hide-in-large {
+  display: none !important;
+}
+}