Skip to content

Instantly share code, notes, and snippets.

@dhananjay431
Created March 10, 2022 11:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dhananjay431/8cb52da7f3af8c7c3a6d849dae46eb99 to your computer and use it in GitHub Desktop.
Save dhananjay431/8cb52da7f3af8c7c3a6d849dae46eb99 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
$tbl_name:tbl_1;
$tbl_head_bg_color:#1b47c5;
$fix_length: 4;
.#{$tbl_name}_table .#{$tbl_name}_thead .#{$tbl_name}_th:nth-child(1) {
position: sticky;
left: 0;
z-index: 2;
background-color: $tbl_head_bg_color !important;
}
.#{$tbl_name}_table .#{$tbl_name}_thead .#{$tbl_name}_th:nth-child(2) {
position: sticky;
left: 303.02px;
z-index: 2;
background-color: $tbl_head_bg_color !important;
}
.#{$tbl_name}_table .#{$tbl_name}_tbody .#{$tbl_name}_th {
position: relative;
}
@for $i from 0 through $fix_length - 1 {
.#{$tbl_name}_table .#{$tbl_name}_thead .#{$tbl_name}_th:nth-child(#{$i + 1}) {
position: sticky;
left: $i*100;
background: white;
z-index: 1;
}
.#{$tbl_name}_table .#{$tbl_name}_tbody .#{$tbl_name}_th:nth-child(#{$i + 1}) {
position: sticky;
left: $i*100;
background: white;
z-index: 1;
}
.#{$tbl_name}_table .#{$tbl_name}_tfoot .#{$tbl_name}_th:nth-child(#{$i + 1}) {
position: sticky;
left: $i*100;
background-color: #1b47c5 !important;
z-index: 1;
}
}
.tbl_1_table .tbl_1_thead .tbl_1_th:nth-child(1) {
position: sticky;
left: 0;
z-index: 2;
background-color: #1b47c5 !important;
}
.tbl_1_table .tbl_1_thead .tbl_1_th:nth-child(2) {
position: sticky;
left: 303.02px;
z-index: 2;
background-color: #1b47c5 !important;
}
.tbl_1_table .tbl_1_tbody .tbl_1_th {
position: relative;
}
.tbl_1_table .tbl_1_thead .tbl_1_th:nth-child(1) {
position: sticky;
left: 0;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tbody .tbl_1_th:nth-child(1) {
position: sticky;
left: 0;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tfoot .tbl_1_th:nth-child(1) {
position: sticky;
left: 0;
background-color: #1b47c5 !important;
z-index: 1;
}
.tbl_1_table .tbl_1_thead .tbl_1_th:nth-child(2) {
position: sticky;
left: 100;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tbody .tbl_1_th:nth-child(2) {
position: sticky;
left: 100;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tfoot .tbl_1_th:nth-child(2) {
position: sticky;
left: 100;
background-color: #1b47c5 !important;
z-index: 1;
}
.tbl_1_table .tbl_1_thead .tbl_1_th:nth-child(3) {
position: sticky;
left: 200;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tbody .tbl_1_th:nth-child(3) {
position: sticky;
left: 200;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tfoot .tbl_1_th:nth-child(3) {
position: sticky;
left: 200;
background-color: #1b47c5 !important;
z-index: 1;
}
.tbl_1_table .tbl_1_thead .tbl_1_th:nth-child(4) {
position: sticky;
left: 300;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tbody .tbl_1_th:nth-child(4) {
position: sticky;
left: 300;
background: white;
z-index: 1;
}
.tbl_1_table .tbl_1_tfoot .tbl_1_th:nth-child(4) {
position: sticky;
left: 300;
background-color: #1b47c5 !important;
z-index: 1;
}
{
"sass": {
"compiler": "Ruby Sass/3.7.4",
"extensions": {},
"syntax": "SCSS",
"outputStyle": "expanded"
},
"autoprefixer": false
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment