Skip to content

Commit

Permalink
[bug-fix] Add padding to default markdown table cells (#2617)
Browse files Browse the repository at this point in the history
Default, meaning `pretty_table: false`

## Sample code

```md
|   First Column   |  Second Column  |  Third Column  |
|------------------|-----------------|----------------|
| Sed in.          | Sed non.        | Morbi egestas. |
| Donec facilisis. | Suspendisse eu. | Nulla porta.   |
| Praesent a.      | Interdum et.    | Sed nec.       |
```

### Current result 

<img width="369" alt="current-default"
src="https://github.com/user-attachments/assets/7dc74cfd-ed60-46eb-a1c1-bf3df74bac59">

### Proposed result

<img width="378" alt="updated-default"
src="https://github.com/user-attachments/assets/2bf83fb5-f7b1-4d4b-88aa-e55d3420aeaf">
  • Loading branch information
rstein66 authored Aug 4, 2024
1 parent e46a794 commit 1d4ce5a
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 2 deletions.
18 changes: 16 additions & 2 deletions _posts/2023-03-21-tables.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,17 @@ related_posts: true
pretty_table: true
---

Using markdown to display tables is easy. Just use the following syntax:
Using markdown to display tables is easy.

## Simple Example

First, add the following to the post's front matter

```yml
pretty_table: true
```
Then, the following syntax
```markdown
| Left aligned | Center aligned | Right aligned |
Expand All @@ -20,7 +30,7 @@ Using markdown to display tables is easy. Just use the following syntax:
| Left 3 | center 3 | right 3 |
```

That will generate:
will generate

| Left aligned | Center aligned | Right aligned |
| :----------- | :------------: | ------------: |
Expand All @@ -30,6 +40,8 @@ That will generate:

<p></p>

## HTML Example

It is also possible to use HTML to display tables. For example, the following HTML code will display a table with [Bootstrap Table](https://bootstrap-table.com/), loaded from a JSON file:

{% raw %}
Expand Down Expand Up @@ -62,6 +74,8 @@ It is also possible to use HTML to display tables. For example, the following HT

<p></p>

## More Complex Example

By using [Bootstrap Table](https://bootstrap-table.com/) it is possible to create pretty complex tables, with pagination, search, and more. For example, the following HTML code will display a table, loaded from a JSON file, with pagination, search, checkboxes, and header/content alignment. For more information, check the [documentation](https://examples.bootstrap-table.com/index.html).

{% raw %}
Expand Down
1 change: 1 addition & 0 deletions _sass/_base.scss
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ table {
td,
th {
font-size: 1rem;
padding: 1px 1rem 1px 0;
}

th {
Expand Down

0 comments on commit 1d4ce5a

Please sign in to comment.