lxm_front/vxe-table
1
0
Fork 0
mirror of synced 2025-11-06 11:20:40 +08:00
Code Issues Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
xuliangzhan
2019-05-14 22:46:55 +08:00
parent 52262e8286
commit 884b811974
21 changed files with 80 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
README.md
View File

@@ -92,7 +92,6 @@ Vue.use(VXETable, {
},
// 优化配置项
optimized: {
showOverflow: 'tooltip',
scrollX: {
gt: 60,
oSize: 5,
@@ -208,6 +207,7 @@ new Vue({ i18n }).$mount('#app')
| footer-method | 表尾合计的计算方法 Function({columns, data}) | Function | — | — |
| span-method | 合并行或列，该函数 Function({row, rowIndex, column, columnIndex, data}) 返回计算后的值 | Object | — | { rowspan: 1, colspan: 1} |
| tooltipTheme | 列 tooltip 的主题，可选值为 dark 或 light | String | — | dark |
| showOverflow | 设置所有行不允许换行（如果是固定列建议设置该值） | String | ellipsis / title / tooltip | — |
| row-key | 行数据的 Key | String | — | — |
| auto-resize | 是否自动根据父容器大小调整表格宽度 | Boolean | — | false |
| auto-width | 是否自动计算列宽（如果关闭了需要手动调用 recalculate 函数） | Boolean | — | true |
@@ -241,7 +241,6 @@ new Vue({ i18n }).$mount('#app')
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|------|------|-----|-----|-----|
| animat | 表格动画效果开关（关闭后视觉效果更快） | Boolean | — | true |
| showOverflow | 设置所有行不允许换行（设置后对于固定列能大幅提升性能） | String | ellipsis / title / tooltip | — |
| scrollX | 横向 X 滚动渲染配置 | Object | — | [{gt: 60, oSize: 5, rSize: 16}](#scrollXY-滚动渲染配置项说明) |
| scrollY | 纵向 Y 滚动渲染配置 | Object | — | [{gt: 500, oSize: 30, rSize: 100}](#scrollXY-滚动渲染配置项说明) |

2
docs/index.html
View File

@@ -1 +1 @@
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/vxe-table/favicon.ico><title>vxe-table 表格</title><link href=/vxe-table/static/css/chunk-vendors.94d9aa44.css rel=preload as=style><link href=/vxe-table/static/css/index.3c49881b.css rel=preload as=style><link href=/vxe-table/static/js/chunk-vendors.04c0d2a6.js rel=preload as=script><link href=/vxe-table/static/js/index.88b2ee18.js rel=preload as=script><link href=/vxe-table/static/css/chunk-vendors.94d9aa44.css rel=stylesheet><link href=/vxe-table/static/css/index.3c49881b.css rel=stylesheet></head><body><noscript><strong>We're sorry but vxe-table doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/vxe-table/static/js/chunk-vendors.04c0d2a6.js></script><script src=/vxe-table/static/js/index.88b2ee18.js></script></body></html>
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/vxe-table/favicon.ico><title>vxe-table 表格</title><link href=/vxe-table/static/css/chunk-vendors.94d9aa44.css rel=preload as=style><link href=/vxe-table/static/css/index.adfd682d.css rel=preload as=style><link href=/vxe-table/static/js/chunk-vendors.04c0d2a6.js rel=preload as=script><link href=/vxe-table/static/js/index.5e765a53.js rel=preload as=script><link href=/vxe-table/static/css/chunk-vendors.94d9aa44.css rel=stylesheet><link href=/vxe-table/static/css/index.adfd682d.css rel=stylesheet></head><body><noscript><strong>We're sorry but vxe-table doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/vxe-table/static/js/chunk-vendors.04c0d2a6.js></script><script src=/vxe-table/static/js/index.5e765a53.js></script></body></html>

1
docs/static/css/index.3c49881b.css vendored
View File

File diff suppressed because one or more lines are too long

1
docs/static/css/index.adfd682d.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
docs/static/js/index.5e765a53.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
docs/static/js/index.88b2ee18.js vendored
View File

File diff suppressed because one or more lines are too long

8
examples/views/table/advanced/Export.vue
View File

@@ -6,7 +6,7 @@
<vxe-table
ref="xTable1"
highlight-hover-row
height="300"
height="400"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>
<vxe-table-column prop="name" label="Name"></vxe-table-column>
@@ -21,7 +21,7 @@
<vxe-table
ref="xTable2"
highlight-hover-row
height="300"
height="400"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>
<vxe-table-column prop="name" label="Name"></vxe-table-column>
@@ -36,7 +36,7 @@
<vxe-table
ref="xTable3"
highlight-hover-row
height="300"
height="400"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>
<vxe-table-column prop="name" label="Name"></vxe-table-column>
@@ -51,7 +51,7 @@
<vxe-table
ref="xTable4"
highlight-hover-row
height="300"
height="400"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>
<vxe-table-column prop="name" label="Name"></vxe-table-column>

9
examples/views/table/advanced/Footer.vue
View File

@@ -7,7 +7,7 @@
border
highlight-hover-row
show-footer
height="300"
height="400"
:footer-method="footerMethod"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>
@@ -23,7 +23,7 @@
class="mytable-footer"
border
show-footer
height="300"
height="400"
:footer-method="footerMethod"
:footer-cell-class-name="footerCellClassName"
:data.sync="tableData">
@@ -40,7 +40,8 @@
class="mytable-footer"
border
show-footer
height="300"
height="400"
show-overflow="tooltip"
:footer-method="footerMethod"
:footer-cell-class-name="footerCellClassName"
:data.sync="tableData">
@@ -63,7 +64,7 @@ export default {
}
},
created () {
let list = window.MOCK_DATA_LIST.slice(0, 6)
let list = window.MOCK_DATA_LIST.slice(0, 50)
this.tableData = list
},
methods: {

4
examples/views/table/advanced/Span.vue
View File

@@ -4,7 +4,7 @@
<vxe-table
border
max-height="300"
max-height="400"
:span-method="colspanMethod"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>
@@ -19,7 +19,7 @@
<vxe-table
ref="xTable"
border
max-height="300"
max-height="400"
:span-method="rowspanMethod"
:data.sync="tableData">
<vxe-table-column type="index" width="60"></vxe-table-column>

6
examples/views/table/base/Fixed.vue
View File

@@ -4,26 +4,28 @@
<vxe-table
border
show-overflow="tooltip"
:data.sync="tableData">
<vxe-table-column type="index" width="60" fixed="left"></vxe-table-column>
<vxe-table-column prop="name" label="Name" width="300"></vxe-table-column>
<vxe-table-column prop="role" label="Role" width="300"></vxe-table-column>
<vxe-table-column prop="sex" label="Sex" width="300"></vxe-table-column>
<vxe-table-column prop="date" label="Date" width="300"></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300" show-overflow-tooltip></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300"></vxe-table-column>
</vxe-table>
<p>如果列宽足够的情况下，固定列不会浮动</p>
<vxe-table
border
show-overflow="tooltip"
:data.sync="tableData">
<vxe-table-column type="index" width="60" fixed="left"></vxe-table-column>
<vxe-table-column prop="name" label="Name"></vxe-table-column>
<vxe-table-column prop="role" label="Role"></vxe-table-column>
<vxe-table-column prop="sex" label="Sex"></vxe-table-column>
<vxe-table-column prop="age" label="Age"></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300" show-overflow-tooltip></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300"></vxe-table-column>
</vxe-table>
</div>
</template>

8
examples/views/table/base/FixedFull.vue
View File

@@ -5,28 +5,30 @@
<vxe-table
border
height="300"
show-overflow="tooltip"
:data.sync="tableData">
<vxe-table-column type="index" width="60" fixed="left"></vxe-table-column>
<vxe-table-column prop="name" label="Name" width="300"></vxe-table-column>
<vxe-table-column prop="role" label="Role" width="300"></vxe-table-column>
<vxe-table-column prop="sex" label="Sex" width="300"></vxe-table-column>
<vxe-table-column prop="date" label="Date" width="300"></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300" show-overflow-tooltip></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300"></vxe-table-column>
</vxe-table>
<p>使用 optimized 参数可以使固定列的节点减到最少，并将所有单元格设置为禁止换行</p>
<p>固定列建议设置 showOverflow 该值，禁用自动换行，大幅提升渲染速度</p>
<vxe-table
border
optimized
height="300"
show-overflow="tooltip"
:data.sync="tableData">
<vxe-table-column type="index" width="60" fixed="left"></vxe-table-column>
<vxe-table-column prop="name" label="Name" width="300"></vxe-table-column>
<vxe-table-column prop="role" label="Role" width="300"></vxe-table-column>
<vxe-table-column prop="sex" label="Sex" width="300"></vxe-table-column>
<vxe-table-column prop="date" label="Date" width="300"></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300" show-overflow-tooltip></vxe-table-column>
<vxe-table-column prop="address" label="Address" fixed="right" width="300"></vxe-table-column>
</vxe-table>
</div>
</template>

29
lib/index.common.js
View File

@@ -5308,9 +5308,9 @@ function renderColumn(h, _vm, $table, fixedType, row, rowIndex, column, columnIn
scrollYLoad = $table.scrollYLoad,
border = $table.border,
highlightCurrentRow = $table.highlightCurrentRow,
showOverflow = $table.showOverflow,
cellClassName = $table.cellClassName,
spanMethod = $table.spanMethod,
optimizeConfig = $table.optimizeConfig,
keyboardConfig = $table.keyboardConfig,
mouseConfig = $table.mouseConfig,
editConfig = $table.editConfig,
@@ -5327,7 +5327,6 @@ function renderColumn(h, _vm, $table, fixedType, row, rowIndex, column, columnIn
selected = editStore.selected,
actived = editStore.actived,
copyed = editStore.copyed;
var showOverflow = optimizeConfig.showOverflow;
var isMouseSelected = mouseConfig && mouseConfig.selected;
var isMouseChecked = mouseConfig && mouseConfig.checked;
var isKeyboardCut = keyboardConfig && keyboardConfig.isCut;
@@ -5642,6 +5641,7 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
tableColumn = $table.tableColumn,
headerHeight = $table.headerHeight,
showFooter = $table.showFooter,
showOverflow = $table.showOverflow,
footerHeight = $table.footerHeight,
tableHeight = $table.tableHeight,
tableWidth = $table.tableWidth,
@@ -5649,9 +5649,7 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
scrollXLoad = $table.scrollXLoad,
scrollYStore = $table.scrollYStore,
scrollYLoad = $table.scrollYLoad,
scrollXHeight = $table.scrollXHeight,
optimizeConfig = $table.optimizeConfig;
var showOverflow = optimizeConfig.showOverflow;
scrollXHeight = $table.scrollXHeight;
var customHeight = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default.a.toNumber(height);
var style = {};
@@ -5801,6 +5799,7 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
footerCellClassName = $table.footerCellClassName,
tableWidth = $table.tableWidth,
scrollYWidth = $table.scrollYWidth,
scrollXHeight = $table.scrollXHeight,
scrollXLoad = $table.scrollXLoad,
scrollXStore = $table.scrollXStore,
optimizeConfig = $table.optimizeConfig;
@@ -5823,6 +5822,9 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
return h('div', {
class: ['vxe-table--footer-wrapper', fixedType ? "fixed--".concat(fixedType, "-wrapper") : 'footer--wrapper'],
style: {
'margin-top': "".concat(-scrollXHeight - 1, "px")
},
on: {
scroll: this.scrollEvent
}
@@ -6260,6 +6262,7 @@ var renderer_renderMap = {
var GlobalConfig = {
size: null,
optimized: false,
showOverflow: null,
contextMenu: null,
tooltipTheme: 'dark',
renderMap: renderer,
@@ -6341,6 +6344,13 @@ var GlobalConfig = {
return conf.tooltipTheme;
}
},
// 设置所有行不允许换行（如果是固定列建议设置该值）
showOverflow: {
type: String,
default: function _default() {
return conf.showOverflow;
}
},
/** 高级属性 */
// 行数据的 Key
@@ -10460,11 +10470,11 @@ function excel_buildColumns(h, columns) {
function buildProps(h, _vm) {
var props = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var editConfig = props.editConfig,
contextMenu = props.contextMenu,
optimized = props.optimized;
contextMenu = props.contextMenu;
return assign_default()({}, props, {
border: true,
resizable: true,
showOverflow: false,
headerCellClassName: _vm.handleHeaderCellClassName,
cellClassName: _vm.handleCellClassName,
contextMenu: assign_default()({}, contextMenu, excelContextMenu),
@@ -10478,10 +10488,7 @@ function buildProps(h, _vm) {
isCut: true,
isEdit: true
},
editConfig: editConfig ? assign_default()({}, excelEditConfig, editConfig) : excelEditConfig,
optimized: assign_default()({
showOverflow: null
}, optimized)
editConfig: editConfig ? assign_default()({}, excelEditConfig, editConfig) : excelEditConfig
});
}

2
lib/index.css
View File

File diff suppressed because one or more lines are too long

29
lib/index.umd.js
View File

@@ -5317,9 +5317,9 @@ function renderColumn(h, _vm, $table, fixedType, row, rowIndex, column, columnIn
scrollYLoad = $table.scrollYLoad,
border = $table.border,
highlightCurrentRow = $table.highlightCurrentRow,
showOverflow = $table.showOverflow,
cellClassName = $table.cellClassName,
spanMethod = $table.spanMethod,
optimizeConfig = $table.optimizeConfig,
keyboardConfig = $table.keyboardConfig,
mouseConfig = $table.mouseConfig,
editConfig = $table.editConfig,
@@ -5336,7 +5336,6 @@ function renderColumn(h, _vm, $table, fixedType, row, rowIndex, column, columnIn
selected = editStore.selected,
actived = editStore.actived,
copyed = editStore.copyed;
var showOverflow = optimizeConfig.showOverflow;
var isMouseSelected = mouseConfig && mouseConfig.selected;
var isMouseChecked = mouseConfig && mouseConfig.checked;
var isKeyboardCut = keyboardConfig && keyboardConfig.isCut;
@@ -5651,6 +5650,7 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
tableColumn = $table.tableColumn,
headerHeight = $table.headerHeight,
showFooter = $table.showFooter,
showOverflow = $table.showOverflow,
footerHeight = $table.footerHeight,
tableHeight = $table.tableHeight,
tableWidth = $table.tableWidth,
@@ -5658,9 +5658,7 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
scrollXLoad = $table.scrollXLoad,
scrollYStore = $table.scrollYStore,
scrollYLoad = $table.scrollYLoad,
scrollXHeight = $table.scrollXHeight,
optimizeConfig = $table.optimizeConfig;
var showOverflow = optimizeConfig.showOverflow;
scrollXHeight = $table.scrollXHeight;
var customHeight = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default.a.toNumber(height);
var style = {};
@@ -5810,6 +5808,7 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
footerCellClassName = $table.footerCellClassName,
tableWidth = $table.tableWidth,
scrollYWidth = $table.scrollYWidth,
scrollXHeight = $table.scrollXHeight,
scrollXLoad = $table.scrollXLoad,
scrollXStore = $table.scrollXStore,
optimizeConfig = $table.optimizeConfig;
@@ -5832,6 +5831,9 @@ function syncBodyScroll(scrollTop, elem1, elem2) {
return h('div', {
class: ['vxe-table--footer-wrapper', fixedType ? "fixed--".concat(fixedType, "-wrapper") : 'footer--wrapper'],
style: {
'margin-top': "".concat(-scrollXHeight - 1, "px")
},
on: {
scroll: this.scrollEvent
}
@@ -6269,6 +6271,7 @@ var renderer_renderMap = {
var GlobalConfig = {
size: null,
optimized: false,
showOverflow: null,
contextMenu: null,
tooltipTheme: 'dark',
renderMap: renderer,
@@ -6350,6 +6353,13 @@ var GlobalConfig = {
return conf.tooltipTheme;
}
},
// 设置所有行不允许换行（如果是固定列建议设置该值）
showOverflow: {
type: String,
default: function _default() {
return conf.showOverflow;
}
},
/** 高级属性 */
// 行数据的 Key
@@ -10469,11 +10479,11 @@ function excel_buildColumns(h, columns) {
function buildProps(h, _vm) {
var props = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var editConfig = props.editConfig,
contextMenu = props.contextMenu,
optimized = props.optimized;
contextMenu = props.contextMenu;
return assign_default()({}, props, {
border: true,
resizable: true,
showOverflow: false,
headerCellClassName: _vm.handleHeaderCellClassName,
cellClassName: _vm.handleCellClassName,
contextMenu: assign_default()({}, contextMenu, excelContextMenu),
@@ -10487,10 +10497,7 @@ function buildProps(h, _vm) {
isCut: true,
isEdit: true
},
editConfig: editConfig ? assign_default()({}, excelEditConfig, editConfig) : excelEditConfig,
optimized: assign_default()({
showOverflow: null
}, optimized)
editConfig: editConfig ? assign_default()({}, excelEditConfig, editConfig) : excelEditConfig
});
}

2
lib/index.umd.min.js vendored
View File

File diff suppressed because one or more lines are too long

6
src/components/table/src/body.js
View File

@@ -16,10 +16,9 @@ function handleLocation (obj, rows, columns, row, column) {
* 渲染列
*/
function renderColumn (h, _vm, $table, fixedType, row, rowIndex, column, columnIndex) {
let { $listeners: tableListeners, tableData, scrollYLoad, border, highlightCurrentRow, cellClassName, spanMethod, optimizeConfig, keyboardConfig, mouseConfig, editConfig, editStore, validStore } = $table
let { $listeners: tableListeners, tableData, scrollYLoad, border, highlightCurrentRow, showOverflow, cellClassName, spanMethod, keyboardConfig, mouseConfig, editConfig, editStore, validStore } = $table
let { editRender, align, ellipsis, showTitle, showTooltip, renderWidth, columnKey } = column
let { checked, selected, actived, copyed } = editStore
let { showOverflow } = optimizeConfig
let isMouseSelected = mouseConfig && mouseConfig.selected
let isMouseChecked = mouseConfig && mouseConfig.checked
let isKeyboardCut = keyboardConfig && keyboardConfig.isCut
@@ -253,8 +252,7 @@ export default {
},
render (h) {
let { $parent: $table, fixedColumn, fixedType } = this
let { maxHeight, height, tableColumn, headerHeight, showFooter, footerHeight, tableHeight, tableWidth, scrollXStore, scrollXLoad, scrollYStore, scrollYLoad, scrollXHeight, optimizeConfig } = $table
let { showOverflow } = optimizeConfig
let { maxHeight, height, tableColumn, headerHeight, showFooter, showOverflow, footerHeight, tableHeight, tableWidth, scrollXStore, scrollXLoad, scrollYStore, scrollYLoad, scrollXHeight } = $table
let customHeight = XEUtils.toNumber(height)
let style = {}
if (customHeight) {

6
src/components/table/src/excel.js
View File

@@ -106,17 +106,17 @@ function buildColumns (h, columns) {
}
function buildProps (h, _vm, props = {}) {
let { editConfig, contextMenu, optimized } = props
let { editConfig, contextMenu } = props
return Object.assign({}, props, {
border: true,
resizable: true,
showOverflow: false,
headerCellClassName: _vm.handleHeaderCellClassName,
cellClassName: _vm.handleCellClassName,
contextMenu: Object.assign({}, contextMenu, excelContextMenu),
mouseConfig: { selected: true, checked: true },
keyboardConfig: { isArray: true, isTab: true, isCut: true, isEdit: true },
editConfig: editConfig ? Object.assign({}, excelEditConfig, editConfig) : excelEditConfig,
optimized: Object.assign({ showOverflow: null }, optimized)
editConfig: editConfig ? Object.assign({}, excelEditConfig, editConfig) : excelEditConfig
})
}

5
src/components/table/src/footer.js
View File

@@ -10,7 +10,7 @@ export default {
},
render (h) {
let { $parent: $table, fixedType, fixedColumn, tableColumn, footerData } = this
let { footerRowClassName, footerCellClassName, tableWidth, scrollYWidth, scrollXLoad, scrollXStore, optimizeConfig } = $table
let { footerRowClassName, footerCellClassName, tableWidth, scrollYWidth, scrollXHeight, scrollXLoad, scrollXStore, optimizeConfig } = $table
let { overflow } = optimizeConfig
// 如果是使用优化模式
if (fixedType && overflow) {
@@ -24,6 +24,9 @@ export default {
}
return h('div', {
class: ['vxe-table--footer-wrapper', fixedType ? `fixed--${fixedType}-wrapper` : 'footer--wrapper'],
style: {
'margin-top': `${-scrollXHeight - 1}px`
},
on: {
scroll: this.scrollEvent
}

2
src/components/table/src/props.js
View File

@@ -48,6 +48,8 @@ export default {
spanMethod: Function,
// 列 tooltip 的主题，可选值为 dark 或 light
tooltipTheme: { type: String, default: () => GlobalConfig.tooltipTheme },
// 设置所有行不允许换行（如果是固定列建议设置该值）
showOverflow: { type: String, default: () => GlobalConfig.showOverflow },
/** 高级属性 */
// 行数据的 Key

1
src/conf.js
View File

@@ -5,6 +5,7 @@ import renderMap from './components/table/src/renderer'
const GlobalConfig = {
size: null,
optimized: false,
showOverflow: null,
contextMenu: null,
tooltipTheme: 'dark',
renderMap,

10
src/style/table.scss
View File

@@ -102,8 +102,10 @@
margin-top: -1px;
}
&.show--foot {
.vxe-table--body-wrapper {
overflow-x: hidden;
&.scroll--x {
.vxe-table--body-wrapper {
overflow-x: scroll;
}
}
}
.vxe-body--row,
@@ -113,7 +115,8 @@
.vxe-table--body-wrapper,
.vxe-table--fixed-left-body-wrapper,
.vxe-table--fixed-right-body-wrapper {
overflow: auto;
overflow-y: auto;
overflow-x: auto;
}
.vxe-body--row {
&.row--hover {
@@ -317,7 +320,6 @@
&.fixed--right-wrapper {
position: absolute;
top: 0;
overflow-x: hidden;
}
&.fixed--left-wrapper {
left: 0;