-
-
Notifications
You must be signed in to change notification settings - Fork 185
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add table-center to center small tables
- Loading branch information
Showing
10 changed files
with
182 additions
and
143 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,50 +1,51 @@ | ||
--- | ||
permalink: tables | ||
cssclasses: | ||
- table-col-1-150 | ||
--- | ||
|
||
#blocks | ||
|
||
Tables can be created using Markdown, or automatically generated with [[Dataview]]. Tables in Minimal follow your [[Block width]] settings. | ||
|
||
## Dataview Settings | ||
|
||
Use [[Minimal Theme Settings]] to define the following settings: | ||
|
||
- **Trim Dataview columns** disables text wrapping in [[Dataview]] cells, equivalent of globally setting `table-nowrap` for Dataview only | ||
- **Dataview maximum column width** sets the width before trimming occurs | ||
|
||
## Hotkeys | ||
|
||
You can use [[Hotkeys]] to adjust tables globally: | ||
|
||
- Cycle between global table width options | ||
|
||
## Style Settings | ||
|
||
Use [[Style Settings]] plugin to control table styles at the global level | ||
|
||
![](https://kep-log.s3-us-west-2.amazonaws.com/minimal-table-styles.png#interface) | ||
|
||
## Helper classes | ||
|
||
Use [[Helper classes]] to control table styles at the individual note level | ||
|
||
| Class | Description | | ||
|:--------------- |:--------------------------------------------------- | | ||
| `table-100` | Table block fills 100% of the pane width | | ||
| `table-max` | Table block fills the max line width | | ||
| `table-wide` | Table block fills the wide line width | | ||
| `table-nowrap` | Disable line wrapping in table cells | | ||
| `table-wrap` | Force line wrapping in table cells | | ||
| `table-numbers` | Add row numbers to tables | | ||
| `table-tabular` | Use tabular figures in tables | | ||
| `table-small` | Use small font size in tables | | ||
| `table-tiny` | Use tiny font size in tables | | ||
| `table-lines` | Add borders around all table cells | | ||
| `row-lines` | Add borders between table rows | | ||
| `col-lines` | Add borders between table columns | | ||
| `row-alt` | Add striped background to alternating table rows | | ||
| `col-alt` | Add striped background to alternating table columns | | ||
| `row-hover` | Highlight rows on hover | | ||
--- | ||
permalink: tables | ||
cssclasses: | ||
- table-col-1-150 | ||
--- | ||
|
||
#blocks | ||
|
||
Tables can be created using Markdown, or automatically generated with [[Dataview]]. Tables in Minimal follow your [[Block width]] settings. | ||
|
||
## Dataview Settings | ||
|
||
Use [[Minimal Theme Settings]] to define the following settings: | ||
|
||
- **Trim Dataview columns** disables text wrapping in [[Dataview]] cells, equivalent of globally setting `table-nowrap` for Dataview only | ||
- **Dataview maximum column width** sets the width before trimming occurs | ||
|
||
## Hotkeys | ||
|
||
You can use [[Hotkeys]] to adjust tables globally: | ||
|
||
- Cycle between global table width options | ||
|
||
## Style Settings | ||
|
||
Use [[Style Settings]] plugin to control table styles at the global level | ||
|
||
![](https://kep-log.s3-us-west-2.amazonaws.com/minimal-table-styles.png#interface) | ||
|
||
## Helper classes | ||
|
||
Use [[Helper classes]] to control table styles at the individual note level | ||
|
||
| Class | Description | | ||
|:--------------- |:--------------------------------------------------- | | ||
| `table-100` | Table block fills 100% of the pane width | | ||
| `table-max` | Table block fills the max line width | | ||
| `table-wide` | Table block fills the wide line width | | ||
| `table-nowrap` | Disable line wrapping in table cells | | ||
| `table-wrap` | Force line wrapping in table cells | | ||
| `table-center` | Center small tables narrower than line width | | ||
| `table-numbers` | Add row numbers to tables | | ||
| `table-tabular` | Use tabular figures in tables | | ||
| `table-small` | Use small font size in tables | | ||
| `table-tiny` | Use tiny font size in tables | | ||
| `table-lines` | Add borders around all table cells | | ||
| `row-lines` | Add borders between table rows | | ||
| `col-lines` | Add borders between table columns | | ||
| `row-alt` | Add striped background to alternating table rows | | ||
| `col-alt` | Add striped background to alternating table columns | | ||
| `row-hover` | Highlight rows on hover | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,89 +1,90 @@ | ||
--- | ||
permalink: features/helper-classes | ||
cssclasses: | ||
- table-col-1-150 | ||
- table-full | ||
--- | ||
## How to use helper classes | ||
|
||
Helper classes are added using the special `cssclasses` [property](https://help.obsidian.md/Editing+and+formatting/Properties). In source mode it should look like this: | ||
|
||
``` | ||
--- | ||
cssclasses: | ||
- img-grid | ||
--- | ||
``` | ||
|
||
To use multiple classes use the following syntax: | ||
|
||
``` | ||
--- | ||
cssclasses: | ||
- cards | ||
- cards-1-1 | ||
--- | ||
``` | ||
|
||
## Image grids | ||
|
||
Helper class for [[Image grids]] feature | ||
|
||
| Class | Description | | ||
| -------------- | --------------------------------------------------- | | ||
| `img-grid` | Turns consecutive images into columns. To make a new row, add an extra line break between images. | | ||
|
||
## Block widths | ||
|
||
Enable [[Block width]] features on per-file basis, for [[Tables]], [[Image grids]] and [[Iframes]] | ||
|
||
| Class | Description | | ||
| --------------------------------------- | -------------------------------------- | | ||
| `wide` | Entire note uses wide line width | | ||
| `max` | Entire note uses max line width | | ||
| `table-wide`, `img-wide`, `iframe-wide` | Block type uses wide line width | | ||
| `table-max`, `img-max`, `iframe-max` | Block type uses max line width | | ||
| `table-100`, `img-100`, `iframe-100` | Block type uses 100% of the pane width | | ||
|
||
## Embeds and transclusions | ||
|
||
Controls the styling of [[embeds]] | ||
|
||
| Class | Description | | ||
| -------------- | --------------------------------------------------- | | ||
| `embed-strict` | Transclusions appear seamlessly in the flow of text | | ||
|
||
## Tables | ||
|
||
Controls the row and column styling of [[tables]] | ||
|
||
| Class | Description | | ||
| :-------------- | :-------------------------------------------------- | | ||
| `table-nowrap` | Disable line wrapping in table cells | | ||
| `table-wrap` | Force wrapping in table cells | | ||
| `table-numbers` | Add row numbers to tables | | ||
| `table-tabular` | Use tabular figures in tables | | ||
| `table-small` | Use small font size in tables | | ||
| `table-tiny` | Use tiny font size in tables | | ||
| `table-lines` | Add borders around all table cells | | ||
| `row-lines` | Add borders between table rows | | ||
| `col-lines` | Add borders between table columns | | ||
| `row-alt` | Add striped background to alternating table rows | | ||
| `col-alt` | Add striped background to alternating table columns | | ||
| `row-highlight` | Highlight rows on hover | | ||
|
||
## Cards | ||
|
||
Helper class for [[Cards]] feature | ||
|
||
| Class | Description | | ||
| :-------------------- | :----------------------------------------------- | | ||
| `cards` (required) | Set all Dataview tables to card layout | | ||
| `list-cards` | Set all bullet lists to card layout | | ||
| `cards-align-bottom` | Align the last element of a card to the bottom | | ||
| `cards-cover` | Images are resized to fill the defined space | | ||
| `cards-16-9` | Fit images in cards to 16:9 ratio | | ||
| `cards-1-1` | Fit images in cards to 1:1 ratio (square) | | ||
| `cards-2-1` | Fit images in cards to 2:1 ratio | | ||
| `cards-2-3` | Fit images in cards to 2:3 ratio | | ||
| `cards-cols-1` to `8` | Force a specific number of columns (from 1 to 8) | | ||
--- | ||
permalink: features/helper-classes | ||
cssclasses: | ||
- table-col-1-150 | ||
- table-full | ||
--- | ||
## How to use helper classes | ||
|
||
Helper classes are added using the special `cssclasses` [property](https://help.obsidian.md/Editing+and+formatting/Properties). In source mode it should look like this: | ||
|
||
``` | ||
--- | ||
cssclasses: | ||
- img-grid | ||
--- | ||
``` | ||
|
||
To use multiple classes use the following syntax: | ||
|
||
``` | ||
--- | ||
cssclasses: | ||
- cards | ||
- cards-1-1 | ||
--- | ||
``` | ||
|
||
## Image grids | ||
|
||
Helper class for [[Image grids]] feature | ||
|
||
| Class | Description | | ||
| -------------- | --------------------------------------------------- | | ||
| `img-grid` | Turns consecutive images into columns. To make a new row, add an extra line break between images. | | ||
|
||
## Block widths | ||
|
||
Enable [[Block width]] features on per-file basis, for [[Tables]], [[Image grids]] and [[Iframes]] | ||
|
||
| Class | Description | | ||
| --------------------------------------- | -------------------------------------- | | ||
| `wide` | Entire note uses wide line width | | ||
| `max` | Entire note uses max line width | | ||
| `table-wide`, `img-wide`, `iframe-wide` | Block type uses wide line width | | ||
| `table-max`, `img-max`, `iframe-max` | Block type uses max line width | | ||
| `table-100`, `img-100`, `iframe-100` | Block type uses 100% of the pane width | | ||
|
||
## Embeds and transclusions | ||
|
||
Controls the styling of [[embeds]] | ||
|
||
| Class | Description | | ||
| -------------- | --------------------------------------------------- | | ||
| `embed-strict` | Transclusions appear seamlessly in the flow of text | | ||
|
||
## Tables | ||
|
||
Controls the row and column styling of [[tables]] | ||
|
||
| Class | Description | | ||
| :-------------- | :-------------------------------------------------- | | ||
| `table-nowrap` | Disable line wrapping in table cells | | ||
| `table-wrap` | Force wrapping in table cells | | ||
| `table-center` | Center small tables narrower than line width | | ||
| `table-numbers` | Add row numbers to tables | | ||
| `table-tabular` | Use tabular figures in tables | | ||
| `table-small` | Use small font size in tables | | ||
| `table-tiny` | Use tiny font size in tables | | ||
| `table-lines` | Add borders around all table cells | | ||
| `row-lines` | Add borders between table rows | | ||
| `col-lines` | Add borders between table columns | | ||
| `row-alt` | Add striped background to alternating table rows | | ||
| `col-alt` | Add striped background to alternating table columns | | ||
| `row-highlight` | Highlight rows on hover | | ||
|
||
## Cards | ||
|
||
Helper class for [[Cards]] feature | ||
|
||
| Class | Description | | ||
| :-------------------- | :----------------------------------------------- | | ||
| `cards` (required) | Set all Dataview tables to card layout | | ||
| `list-cards` | Set all bullet lists to card layout | | ||
| `cards-align-bottom` | Align the last element of a card to the bottom | | ||
| `cards-cover` | Images are resized to fill the defined space | | ||
| `cards-16-9` | Fit images in cards to 16:9 ratio | | ||
| `cards-1-1` | Fit images in cards to 1:1 ratio (square) | | ||
| `cards-2-1` | Fit images in cards to 2:1 ratio | | ||
| `cards-2-3` | Fit images in cards to 2:3 ratio | | ||
| `cards-cols-1` to `8` | Force a specific number of columns (from 1 to 8) | |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters