merge

CHANGELOG.md

@@ -1,46 +1,20 @@
-<a name="2.0.6"></a>
+<a name="2.0.9"></a>
-## [2.0.6](https://github.com/tinper-bee/bee-table/compare/v2.0.5...v2.0.6) (2019-03-15)
+## [2.0.9](https://github.com/tinper-bee/bee-table/compare/v2.0.0...v2.0.9) (2019-03-27)
 
 
 ### Bug Fixes
 
-* **行过滤、checkbox样式:** 1、行过滤点击已选的无效2、checkbox在Table中的样式 ([1a628a4](https://github.com/tinper-bee/bee-table/commit/1a628a4))
-
-
-
-<a name="2.0.5"></a>
-## [2.0.5](https://github.com/tinper-bee/bee-table/compare/v2.0.4...v2.0.5) (2019-03-14)
-
-
-### Bug Fixes
-
-* 参照场景中表格首次渲染最后一列没有撑开bug ([c705539](https://github.com/tinper-bee/bee-table/commit/c705539))
 * **Table.js:** 参照场景中第一次加载表格不撑满问题 ([a9530a4](https://github.com/tinper-bee/bee-table/commit/a9530a4))
-
+* **行过滤、checkbox样式:** 1、行过滤点击已选的无效2、checkbox在Table中的样式 ([1a628a4](https://github.com/tinper-bee/bee-table/commit/1a628a4))
-
+* Table 拖拽后同步表格整体宽度 ([ee40deb](https://github.com/tinper-bee/bee-table/commit/ee40deb))
-
+* 参照场景中表格首次渲染最后一列没有撑开bug ([c705539](https://github.com/tinper-bee/bee-table/commit/c705539))
-<a name="2.0.4"></a>
-## [2.0.4](https://github.com/tinper-bee/bee-table/compare/v2.0.3...v2.0.4) (2019-03-07)
-
-
-### Bug Fixes
-
 * 含有右侧固定列场景中，内容过少不需要滚动条bug ([37b9806](https://github.com/tinper-bee/bee-table/commit/37b9806))
-
+* 表格key警告问题 ([6977e2f](https://github.com/tinper-bee/bee-table/commit/6977e2f))
-
-
-<a name="2.0.3"></a>
-## [2.0.3](https://github.com/tinper-bee/bee-table/compare/v2.0.0...v2.0.3) (2019-03-05)
 
 
 
 <a name="2.0.0"></a>
-# [2.0.0](https://github.com/tinper-bee/bee-table/compare/v1.6.44...v2.0.0) (2019-03-01)
+# [2.0.0](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v2.0.0) (2019-03-01)
-
-
-
-<a name="1.6.44"></a>
-## [1.6.44](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v1.6.44) (2019-02-26)
 
 
 
@@ -335,7 +309,7 @@
 
 
 <a name="1.5.1"></a>
-## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-19)
+## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-18)
 
 
 

build/Table.css

@@ -1,168 +1,8 @@
-@charset "UTF-8";
 /* FormGroup */
 /*  Navlayout  */
-/* FormGroup */
-/*  Navlayout  */
-/**
-  * 加载背景
-  */
-/**
-  * 文字
-  */
-.u-loading-desc {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  font-size: 16px;
-  color: #000;
-  text-align: center; }
-
-/**
-  * default样式 单个圆圈加载
-  */
-.u-loading.u-loading-rotate > div {
-  position: absolute;
-  border-radius: 100%;
-  margin: 2px;
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
-  width: 40px;
-  height: 40px;
-  top: 50%;
-  left: 50%;
-  margin-left: -22px;
-  margin-top: -22px;
-  background: transparent !important;
-  display: inline-block;
-  -webkit-animation: rotate 1.5s 0s linear infinite;
-  animation: rotate 1.5s 0s linear infinite;
-  text-align: center;
-  line-height: 40px; }
-  .u-loading.u-loading-rotate > div > .uf {
-    color: #0084ff;
-    font-size: 40px;
-    padding: 0; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-lg > div {
-  margin-left: -35px;
-  margin-top: -35px;
-  width: 60px;
-  height: 60px;
-  line-height: 60px; }
-  .u-loading.u-loading-rotate.u-loading-rotate-lg > div > .uf {
-    font-size: 60px; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-sm > div {
-  margin-left: -15px;
-  margin-top: -15px;
-  width: 25px;
-  height: 25px;
-  line-height: 25px; }
-  .u-loading.u-loading-rotate.u-loading-rotate-sm > div > .uf {
-    font-size: 25px; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-primary > div > .uf {
-  color: #3f51b5; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-success > div > .uf {
-  color: #4caf50; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-warning > div > .uf {
-  color: #ff9800; }
-
-.u-loading-backdrop {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 1900;
-  opacity: .7;
-  filter: blur(0.5px);
-  background-color: #fff; }
-  .u-loading-backdrop.full-screen {
-    position: fixed; }
-
-@keyframes rotate {
-  0% {
-    -webkit-transform: rotate(0deg) scale(1);
-    transform: rotate(0deg) scale(1); }
-  50% {
-    -webkit-transform: rotate(180deg) scale(1);
-    transform: rotate(180deg) scale(1); }
-  100% {
-    -webkit-transform: rotate(360deg) scale(1);
-    transform: rotate(360deg) scale(1); } }
-
-.u-loading.u-loading-line {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  margin-top: -30px;
-  margin-left: -25px; }
-  .u-loading.u-loading-line > div {
-    background-color: #C2C3C5;
-    width: 6px;
-    height: 50px;
-    border-radius: 2px;
-    margin: 2px;
-    -webkit-animation-fill-mode: both;
-    animation-fill-mode: both;
-    display: inline-block; }
-  .u-loading.u-loading-line.u-loading-line-lg {
-    margin-top: -50px;
-    margin-left: -30px; }
-    .u-loading.u-loading-line.u-loading-line-lg > div {
-      width: 8px;
-      height: 90px; }
-  .u-loading.u-loading-line.u-loading-line-sm {
-    margin-top: -22px;
-    margin-left: -20px; }
-    .u-loading.u-loading-line.u-loading-line-sm > div {
-      width: 4px;
-      height: 35px; }
-  .u-loading.u-loading-line div:nth-child(1) {
-    -webkit-animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #F44336; }
-  .u-loading.u-loading-line div:nth-child(2) {
-    -webkit-animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #7ED321; }
-  .u-loading.u-loading-line div:nth-child(3) {
-    -webkit-animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #0084FF; }
-  .u-loading.u-loading-line div:nth-child(4) {
-    -webkit-animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #FF9800; }
-  .u-loading.u-loading-line div:nth-child(5) {
-    -webkit-animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #D0021B; }
-  .u-loading.u-loading-line.u-loading-line-primary > div {
-    background-color: #3f51b5; }
-  .u-loading.u-loading-line.u-loading-line-success > div {
-    background-color: #4caf50; }
-  .u-loading.u-loading-line.u-loading-line-warning > div {
-    background-color: #ff9800; }
-
-@keyframes line-scale {
-  0% {
-    -webkit-transform: scaley(1);
-    transform: scaley(1); }
-  50% {
-    -webkit-transform: scaley(0.4);
-    transform: scaley(0.4); }
-  100% {
-    -webkit-transform: scaley(1);
-    transform: scaley(1); } }
-
 .u-table {
   font-size: 12px;
-  color: #666;
+  color: #212121;
   position: relative;
   line-height: 1.5;
   overflow: hidden; }
@@ -179,7 +19,7 @@
     border-collapse: collapse;
     text-align: left; }
   .u-table th {
-    font-weight: bold;
+    font-weight: normal;
     text-align: left; }
     .u-table th[colspan] {
       text-align: center; }
@@ -231,8 +71,13 @@
     overflow: hidden; }
   .u-table-header {
     overflow: hidden;
+<<<<<<< HEAD
     background: rgb(223, 225, 230);
     color: rgb(102, 102, 102); }
+=======
+    background: rgb(241, 242, 245);
+    color: rgb(33, 33, 33); }
+>>>>>>> d22d3eedc74d2580946a0e615dff0a862b240889
   .u-table.fixed-height td {
     padding: 0px 8px; }
   .u-table-fixed-header .u-table-body {
@@ -356,8 +201,13 @@
     .u-table-thead .filter-wrap .filter-btns {
       min-width: 58px; }
   .u-table-thead th {
+<<<<<<< HEAD
     background: rgb(223, 225, 230);
     color: rgb(102, 102, 102);
+=======
+    background: rgb(241, 242, 245);
+    color: rgb(33, 33, 33);
+>>>>>>> d22d3eedc74d2580946a0e615dff0a862b240889
     background-clip: padding-box;
     -moz-user-select: -moz-none;
     -khtml-user-select: none;
@@ -453,7 +303,7 @@
     height: 25px;
     line-height: 25px;
     z-index: 2;
-    background: #f7f7f7; }
+    background: rgb(241, 242, 245); }
     .u-table-filter-column-filter-iconi.uf {
       padding: 0px; }
   .u-table-filter-column-pop-cont-item {

demo/demolist/Demo1.js

@@ -6,7 +6,7 @@
 */
 
 import React, { Component } from "react";
-import {Button,Tooltip} from "tinper-bee";
+import {Button,Tooltip,Popconfirm} from "tinper-bee";
 import Table from "../../src";
 
 const columns = [
@@ -37,15 +37,11 @@ const columns = [
     render(text, record, index) {
       return (
         <div style={{ position: 'relative' }} title={text} >
-          <a
+          <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-            href="javascript:;"
+            <a href="javascript:;" tooltip={text}>
-            tooltip={text}
-            onClick={() => {
-              alert('这是第' + index + '列，内容为:' + text);
-            }}
-          >
               一些操作
             </a>
+          </Popconfirm>
         </div>
       );
     }
@@ -75,8 +71,8 @@ class Demo1 extends Component {
           columns={columns}
           data={data}
           parentNodeId='parent'
-          height={43}
+          height={40}
-          headerHeight={42}
+          headerHeight={40}
           onRowClick={(record, index, indent) => {
             this.setState({
               selectedRowIndex: index

demo/demolist/Demo17.js

@@ -7,7 +7,7 @@
 
 import React, { Component } from "react";
 import Table from "../../src";
-import {Button} from "tinper-bee";
+import {Button,Popconfirm} from "tinper-bee";
 
 const columns17 = [
   { title: "用户名", dataIndex: "a", key: "a", width: 100 },
@@ -19,14 +19,11 @@ const columns17 = [
     key: "d",
     render(text, record, index) {
       return (
-        <a
+        <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-          href="#"
+          <a href="javascript:;">
-          onClick={() => {
-            alert('这是第'+index+'列，内容为:'+text);
-          }}
-        >
             一些操作
           </a>
+        </Popconfirm>
       );
     }
   }

demo/demolist/Demo28.js

@@ -6,6 +6,7 @@
 */
 
 import React, { Component } from "react";
+import {Popconfirm} from 'tinper-bee';
 import Table from "../../src";
 import BigData from "../../src/lib/bigData";
 const BigDataTable = BigData(Table);
@@ -17,14 +18,11 @@ const outColumns = [
     width:200,
     render(text, record, index) {
       return (
-        <a
+        <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-          href="#"
+          <a href="javascript:;">
-          onClick={() => {
-            alert("这是第" + index + "列，内容为:" + text);
-          }}
-        >
             一些操作
           </a>
+        </Popconfirm>
       );
     }
   },
@@ -41,14 +39,11 @@ const innerColumns = [
     width:200,
     render(text, record, index) {
       return (
-        <a
+        <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-          href="#"
+          <a href="javascript:;">
-          onClick={() => {
+            一些操作
-            alert("这是第" + index + "列，内容为:" + text);
-          }}
-        >
-          {'一些操作'+index}
           </a>
+        </Popconfirm>
       );
     }
   },

demo/demolist/Demo3.js

@@ -7,7 +7,7 @@
 
 
 import React, { Component } from 'react';
-import {Icon,Checkbox,Popover} from "tinper-bee";
+import {Icon,Checkbox,Popover,Popconfirm} from "tinper-bee";
 
 import Table from '../../src';
 import filterColumn from '../../src/lib/filterColumn';
@@ -63,19 +63,11 @@ class Demo21 extends Component {
                   render(text, record, index){
                     return (
                       <div  title={text} >
-                          <a href="#"
+                        <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-                              tooltip={text}
+                          <a href="javascript:;" tooltip={text} >
-                              onClick={() => {
-                                alert('这是第'+index+'列，内容为:'+text);
-                              }}
-                              // style={{
-                              //     position: 'absolute',
-                              //     top: 5,
-                              //     left: 0
-                              // }}
-                            >
                             一些操作
                           </a>
+                        </Popconfirm>
                       </div>
                     );
                   }

demo/demolist/Demo31.js

@@ -5,7 +5,7 @@
 */
 
 import React, { Component } from "react";
-import {Tooltip,Button} from "tinper-bee";
+import {Tooltip,Button,Popconfirm} from "tinper-bee";
 import Table from "../../src";
 
 const columns = [
@@ -36,15 +36,11 @@ const columns = [
     render(text, record, index) {
       return (
         <div style={{ position: 'relative' }} title={text} >
-          <a
+          <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-            href="javascript:;"
+            <a href="javascript:;" tooltip={text} >
-            tooltip={text}
-            onClick={() => {
-              alert('这是第' + index + '列，内容为:' + text);
-            }}
-          >
               一些操作
             </a>
+          </Popconfirm>
         </div>
       );
     }
@@ -89,8 +85,8 @@ class Demo35 extends Component {
           columns={columns}
           data={data}
           parentNodeId='parent'
-          height={43}
+          height={40}
-          headerHeight={42}
+          headerHeight={40}
           hoverContent={this.getHoverContent}
           onRowHover={this.onRowHover}
           onRowClick={(record, index, indent) => {

demo/demolist/Demo32.js

@@ -4,7 +4,7 @@
 */
 
 import React, { Component } from 'react';
-import {Icon,Checkbox,Popover} from "tinper-bee";
+import {Icon,Checkbox,Popover,Popconfirm} from "tinper-bee";
 
 import Table from '../../src';
 import multiSelect from '../../src/lib/multiSelect';
@@ -85,14 +85,11 @@ function getCloumns(){
           render(text, record, index) {
               return (
                   <div className='operation-btn'>
-                    <a href="#"
+                    <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-                      tooltip={text}
+                        <a href="javascript:;" tooltip={text} >
-                      onClick={() => {
-                        alert('这是第'+index+'列，内容为:'+text);
-                      }}
-                    >
                         一些操作
                         </a>
+                    </Popconfirm>
                   </div>
               )
           }

demo/demolist/Demo8.js

@@ -6,6 +6,7 @@
 */
 
 import React, { Component } from "react";
+import { Popconfirm } from 'tinper-bee';
 import Table from "../../src";
 import dragColumn from '../../src/lib/dragColumn';
 const DragColumnTable = dragColumn(Table);
@@ -17,14 +18,11 @@ const columns16 = [
     width:200,
     render(text, record, index) {
       return (
-        <a
+        <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-          href="#"
+          <a href="javascript:;" tooltip={text} >
-          onClick={() => {
-            alert("这是第" + index + "列，内容为:" + text);
-          }}
-        >
           一些操作
           </a>
+        </Popconfirm>
       );
     }
   },
@@ -41,14 +39,11 @@ const columns17 = [
     width:200,
     render(text, record, index) {
       return (
-        <a
+        <Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
-          href="#"
+          <a href="javascript:;" tooltip={text} >
-          onClick={() => {
-            alert("这是第" + index + "列，内容为:" + text);
-          }}
-        >
           一些操作
           </a>
+        </Popconfirm>
       );
     }
   },

dist/demo.css

@@ -1,154 +1,8 @@
-@charset "UTF-8";
 /* FormGroup */
 /*  Navlayout  */
-/* FormGroup */
-/*  Navlayout  */
-/**
-  * 加载背景
-  */
-/**
-  * 文字
-  */
-.u-loading-desc {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  font-size: 16px;
-  color: #000;
-  text-align: center; }
-
-/**
-  * default样式 单个圆圈加载
-  */
-.u-loading.u-loading-rotate > div {
-  position: absolute;
-  border-radius: 100%;
-  margin: 2px;
-  animation-fill-mode: both;
-  width: 40px;
-  height: 40px;
-  top: 50%;
-  left: 50%;
-  margin-left: -22px;
-  margin-top: -22px;
-  background: transparent !important;
-  display: inline-block;
-  animation: rotate 1.5s 0s linear infinite;
-  text-align: center;
-  line-height: 40px; }
-  .u-loading.u-loading-rotate > div > .uf {
-    color: #0084ff;
-    font-size: 40px;
-    padding: 0; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-lg > div {
-  margin-left: -35px;
-  margin-top: -35px;
-  width: 60px;
-  height: 60px;
-  line-height: 60px; }
-  .u-loading.u-loading-rotate.u-loading-rotate-lg > div > .uf {
-    font-size: 60px; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-sm > div {
-  margin-left: -15px;
-  margin-top: -15px;
-  width: 25px;
-  height: 25px;
-  line-height: 25px; }
-  .u-loading.u-loading-rotate.u-loading-rotate-sm > div > .uf {
-    font-size: 25px; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-primary > div > .uf {
-  color: #3f51b5; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-success > div > .uf {
-  color: #4caf50; }
-
-.u-loading.u-loading-rotate.u-loading-rotate-warning > div > .uf {
-  color: #ff9800; }
-
-.u-loading-backdrop {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 1900;
-  opacity: .7;
-  filter: blur(0.5px);
-  background-color: #fff; }
-  .u-loading-backdrop.full-screen {
-    position: fixed; }
-
-@keyframes rotate {
-  0% {
-    transform: rotate(0deg) scale(1); }
-  50% {
-    transform: rotate(180deg) scale(1); }
-  100% {
-    transform: rotate(360deg) scale(1); } }
-
-.u-loading.u-loading-line {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  margin-top: -30px;
-  margin-left: -25px; }
-  .u-loading.u-loading-line > div {
-    background-color: #C2C3C5;
-    width: 6px;
-    height: 50px;
-    border-radius: 2px;
-    margin: 2px;
-    animation-fill-mode: both;
-    display: inline-block; }
-  .u-loading.u-loading-line.u-loading-line-lg {
-    margin-top: -50px;
-    margin-left: -30px; }
-    .u-loading.u-loading-line.u-loading-line-lg > div {
-      width: 8px;
-      height: 90px; }
-  .u-loading.u-loading-line.u-loading-line-sm {
-    margin-top: -22px;
-    margin-left: -20px; }
-    .u-loading.u-loading-line.u-loading-line-sm > div {
-      width: 4px;
-      height: 35px; }
-  .u-loading.u-loading-line div:nth-child(1) {
-    animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #F44336; }
-  .u-loading.u-loading-line div:nth-child(2) {
-    animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #7ED321; }
-  .u-loading.u-loading-line div:nth-child(3) {
-    animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #0084FF; }
-  .u-loading.u-loading-line div:nth-child(4) {
-    animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #FF9800; }
-  .u-loading.u-loading-line div:nth-child(5) {
-    animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-    background-color: #D0021B; }
-  .u-loading.u-loading-line.u-loading-line-primary > div {
-    background-color: #3f51b5; }
-  .u-loading.u-loading-line.u-loading-line-success > div {
-    background-color: #4caf50; }
-  .u-loading.u-loading-line.u-loading-line-warning > div {
-    background-color: #ff9800; }
-
-@keyframes line-scale {
-  0% {
-    transform: scaley(1); }
-  50% {
-    transform: scaley(0.4); }
-  100% {
-    transform: scaley(1); } }
-
 .u-table {
   font-size: 12px;
-  color: #666;
+  color: #212121;
   position: relative;
   line-height: 1.5;
   overflow: hidden; }
@@ -165,7 +19,7 @@
     border-collapse: collapse;
     text-align: left; }
   .u-table th {
-    font-weight: bold;
+    font-weight: normal;
     text-align: left; }
     .u-table th[colspan] {
       text-align: center; }

package.json

@@ -1,6 +1,6 @@
 {
  "name": "bee-table",
- "version": "2.0.8",
+ "version": "2.0.9",
  "description": "Table ui component for react",
  "keywords": [
   "react",

src/Table.scss

@@ -1,8 +1,8 @@
 @import "../node_modules/tinper-bee-core/scss/minxin-variables";
 @import "../node_modules/tinper-bee-core/scss/minxin-mixins";
-@import "../node_modules/bee-loading/src/Loading";
+// @import "../node_modules/bee-loading/src/Loading";
 
-$text-color: #666;
+$text-color: $font-color-base;
 $font-size-base: 12px;
 $line-height: 1.5;
 // 主题定制border：
@@ -44,7 +44,7 @@ $checkbox-height:16px;
 
   th {
     // background: $table-head-background-color;
-    font-weight: bold;
+    font-weight: normal;
     text-align: left;
     // transition: background 0.3s ease;
     &[colspan] {