Make tables responsive

This commit is contained in:
Jan-Lukas Else 2021-04-29 07:38:11 +02:00
parent e15d33b0dd
commit 60295a597d
3 changed files with 7 additions and 2 deletions

View File

@ -137,8 +137,11 @@ code {
} }
table { table {
@extend .p;
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
white-space: nowrap;
overflow-x: auto;
} }
tr, td, th { tr, td, th {

View File

@ -100,6 +100,8 @@ code {
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
white-space: nowrap;
overflow-x: auto;
} }
tr, td, th { tr, td, th {
@ -126,7 +128,7 @@ footer * {
border-bottom: 1px solid var(--primary, #000); border-bottom: 1px solid var(--primary, #000);
} }
.p { .p, table {
display: block; display: block;
margin-top: 1em; margin-top: 1em;
margin-bottom: 1em; margin-bottom: 1em;

View File

@ -6,7 +6,7 @@
<main> <main>
{{ with .Blog.BlogStats.Title }}<h1>{{ . }}</h1>{{ end }} {{ with .Blog.BlogStats.Title }}<h1>{{ . }}</h1>{{ end }}
{{ with .Blog.BlogStats.Description }}{{ md . }}{{ end }} {{ with .Blog.BlogStats.Description }}{{ md . }}{{ end }}
<table class="p"> <table>
<thead> <thead>
<tr> <tr>
<th class="tal">{{ string .Blog.Lang "year" }}</th> <th class="tal">{{ string .Blog.Lang "year" }}</th>