asandikci.com/web
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

Fix the position of the table scroll bar

Browse source
This commit is contained in:
Cotes Chung 2020-12-25 00:22:21 +08:00
parent dfba411d61
commit 505da84a26
2 changed files with 7 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
_includes/refactor-content.html
View file

@ -4,7 +4,10 @@
{% assign _content = include.content %} {% assign _content = include.content %}
<!-- Suroundding the markdown table with '<div class="table-wrapper">. and '</div>' --> <!--
In order to allow a wide table to scroll horizontally,
we suround the markdown table with `<div class="table-wrapper">` and `</div>`
-->
{% if _content contains '<table>' %} {% if _content contains '<table>' %}
{% assign _content = _content {% assign _content = _content
| replace: '<table>', '<div class="table-wrapper"><table>' | replace: '<table>', '<div class="table-wrapper"><table>'

5
assets/css/_addon/main.scss
View file

@ -771,14 +771,15 @@ img {
/*--- Begin of Markdown table style ---*/ /*--- Begin of Markdown table style ---*/
div.post-content .table-wrapper {
.table-wrapper { // it will be created by Liquid
overflow-x: auto; overflow-x: auto;
margin-bottom: 1.5rem;
> table { > table {
min-width: 100%; min-width: 100%;
overflow-x: auto; overflow-x: auto;
border-spacing: 0; border-spacing: 0;
margin-bottom: 1.5rem;
thead { thead {
border-bottom: solid 2px rgba(210, 215, 217, 0.75); border-bottom: solid 2px rgba(210, 215, 217, 0.75);