Skip to content

Commit

Permalink
add support for changing table layout
Browse files Browse the repository at this point in the history
- documentation on how to center a table
- new class to make tables full-width
  • Loading branch information
jothepro committed Feb 15, 2023
1 parent d84dabd commit 7b9598a
Show file tree
Hide file tree
Showing 2 changed files with 70 additions and 0 deletions.
61 changes: 61 additions & 0 deletions docs/tricks.md
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,67 @@ The chosen width should also be set in the Doxyfile:
TREEVIEW_WIDTH = 335
```

## Formatting Tables

By default tables in this theme are left aligned and as wide as required to fit their content.
Those properties can be changed for individual tables.

### Centering

Tables can be centered by wrapping them in the `<center>` HTML-tag.

**Example:**

```md
<center>

| This table | is centered |
|------------|----------------------|
| test 1 | test 2 |

</center>
```

**Result:**

<center>

| This table | is centered |
|------------|----------------------|
| test 1 | test 2 |

</center>

### Full Width

To make tables span the full width of the page, no matter how wide the content is, wrap the table in the `full_width_table` CSS class.

@warning Apply with caution! This breaks the overflow scrolling on small screens!

**Example:**

```md
<div class="full_width_table">

| This table | fills the full width |
|------------|----------------------|
| test 1 | test 2 |

</div>
```

**Result:**

<div class="full_width_table">

| This table | fills the full width |
|------------|----------------------|
| test 1 | test 2 |

</div>



<span class="next_section_button">

Read Next: [Example](https://jothepro.github.io/doxygen-awesome-css/class_my_library_1_1_example.html)
Expand Down
9 changes: 9 additions & 0 deletions doxygen-awesome.css
Original file line number Diff line number Diff line change
Expand Up @@ -1711,6 +1711,15 @@ table.markdownTable tr:last-child, table.doxtable tr:last-child {
border-bottom: none;
}

.full_width_table table:not(.memberdecls):not(.mlabels):not(.fieldtable):not(.memname) {
display: block;
}

.full_width_table table:not(.memberdecls):not(.mlabels):not(.fieldtable):not(.memname) tbody {
display: table;
width: 100%;
}

table.fieldtable th {
font-size: var(--page-font-size);
font-weight: 600;
Expand Down

0 comments on commit 7b9598a

Please sign in to comment.