/* # ----------------------------------------------------------------------------- # ~/assets/themes/j1/modules/mmenu_light/css/theme/uno.js # Tablesaw v3.1.2 Theme for J1 Template # # Product/Info: # https://jekyll.one # https://github.com/filamentgroup/tablesaw # # Copyright (C) 2021 Juergen Adams # Copyright (c) 2013 Filament Group # # J1 Template is licensed under the MIT License. # See: https://github.com/jekyll-one-org/J1 Template/blob/master/LICENSE # Tablesaw is licensed under the MIT License. # See: https://github.com/filamentgroup/tablesaw/blob/master/LICENSE # ----------------------------------------------------------------------------- */ /* // BS4 media breakpoints // ----------------------------------------------------------------------------- $breakpoint-xl: 1200px; $breakpoint-lg: 992px; $breakpoint-md: 768px; $breakpoint-sm: 576px; $breakpoint-xs: 575px; */ .tablesaw { width: 100%; max-width: 100%; empty-cells: show; border-collapse: collapse; /* border: 0; */ /* padding: 0; */ } .tablesaw * { box-sizing: border-box; } .tablesaw-stack td .tablesaw-cell-label, .tablesaw-stack th .tablesaw-cell-label { display: none; } /* Mobile first styles: Begin with the stacked presentation at narrow widths */ /* Support note IE9+: @media only all */ /* Media query to show as a standard table at 560px (35em x 16px) or wider */ /* All Media screens -------------------------------------------------------------------------------- */ @media all { /* Show the table cells as a block level element */ .tablesaw-stack { clear: both; } .tablesaw-stack td, .tablesaw-stack th { text-align: left; display: block; } .tablesaw-stack tr { clear: both; display: table-row; } /* Make the label elements a percentage width */ .tablesaw-stack td .tablesaw-cell-label, .tablesaw-stack th .tablesaw-cell-label { display: inline-block; /* padding: 0 .6em 0 0; */ /* width: 30%; */ width: 20%; } /* For grouped headers, have a different style to visually separate the levels by classing the first label in each col group */ .tablesaw-stack th .tablesaw-cell-label-top, .tablesaw-stack td .tablesaw-cell-label-top { display: block; padding: .4em 0; margin: .4em 0; } .tablesaw-cell-label { display: block; } /* Avoid double strokes when stacked */ .tablesaw-stack tbody th.group { margin-top: -1px; } /* Avoid double strokes when stacked */ .tablesaw-stack th.group b.tablesaw-cell-label { display: none !important; } } /* Desktop @media (min-width: 40em) $grid-breakpoint-lg -------------------------------------------------------------------------------- */ @media screen and (min-width: 992px) { .tablesaw-stack tr { display: table-row; } /* Show the table header rows */ .tablesaw-stack td, .tablesaw-stack th, .tablesaw-stack thead td, .tablesaw-stack thead th { display: table-cell; margin: 0; } /* Hide the labels in each cell */ .tablesaw-stack td .tablesaw-cell-label, .tablesaw-stack th .tablesaw-cell-label { display: none !important; } } /* Mobile @media (max-width: 39.9375em) { -------------------------------------------------------------------------------- */ @media screen and (max-width: 992px) { /* Table rows have a gray bottom stroke by default */ .tablesaw-stack tbody tr { display: block; width: 100%; /* border-bottom: 1px solid #dfdfdf; */ } .tablesaw-stack thead td, .tablesaw-stack thead th { display: none; } .tablesaw-stack tbody td, .tablesaw-stack tbody th { display: block; /* float: left; */ /* clear: left; */ width: 100%; } /* jadams, 2020-09-15: */ .tablesaw-cell-label { vertical-align: top; font-weight: 700 !important; } /* jadams, 2020-09-65: changed max-width: 67% */ .tablesaw-cell-content { display: inline-block; margin-left: .5rem; max-width: 100%; min-width: 100%; /* is to calculated for firefox */ } .tablesaw-stack .tablesaw-stack-block .tablesaw-cell-label, .tablesaw-stack .tablesaw-stack-block .tablesaw-cell-content { display: block; width: 100%; max-width: 100%; padding: 0; } .tablesaw-stack td:empty, .tablesaw-stack th:empty { display: none; } }