Browse Source

Create 'table' shortcode

Create shortcode to allow pages to provide CSS classes to apply to the
HTML table generated from a Markdown table.

Add some basic CSS styling for the table, to provide padding to make the
data easier to read.

Add a 'table-bordered' style to add borders to the table rows/columns.
tags/v0.1.4^0
Kevin C. Coram 11 months ago
parent
commit
8c5110ddda
Signed by: kevin GPG Key ID: 0E64ECB9EDE572A3
2 changed files with 20 additions and 1 deletions
  1. +6
    -0
      layouts/shortcodes/table.html
  2. +14
    -1
      static/css/style.css

+ 6
- 0
layouts/shortcodes/table.html View File

@@ -0,0 +1,6 @@
{{ $htmlTable := .Inner | markdownify }}
{{ $class := .Get 0 }}
{{ $old := "<table>" }}
{{ $new := printf "<table class=\"%s\">" $class }}
{{ $htmlTable := replace $htmlTable $old $new }}
{{ $htmlTable | safeHTML }}

+ 14
- 1
static/css/style.css View File

@@ -99,4 +99,17 @@ figure img {
figure img {
max-width: calc(100vw - 510px);
}
}
}

/* Styes for tables */
table, th, td {
padding: 0.5rem;
}

table.table-bordered,
table.table-bordered td,
table.table-bordered th {
border: 1px solid #dee2e6;
border-spacing: 2px;
border-collapse: collapse;
}

Loading…
Cancel
Save