make wide code blocks/tables responsive

This commit is contained in:
kentnek 2020-07-14 22:47:38 +08:00
parent 1304113842
commit ef92641d29
4 changed files with 22 additions and 4 deletions

View File

@ -11,6 +11,7 @@ $tocBreakpoint: 1024px;
.post__container {
flex-grow: 1;
min-width: 0;
}
.post {

View File

@ -58,16 +58,19 @@ Tables aren't part of the core Markdown spec, but Hugo supports supports them ou
#### Inline Markdown within tables
<div style="overflow-x: auto">
| Inline&nbsp;&nbsp;&nbsp; | Markdown&nbsp;&nbsp;&nbsp; | In&nbsp;&nbsp;&nbsp; | Table |
| ---------- | --------- | ----------------- | ---------- |
| *italics* | **bold** | ~~strikethrough~~&nbsp;&nbsp;&nbsp; | `code` |
</div>
## Code Blocks
#### Code block with backticks
```
html
```html
<!DOCTYPE html>
<html lang="en">
<head>
@ -106,6 +109,20 @@ html
</html>
```
#### Wide code block
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</body>
</html>
```
## List Types
#### Ordered List

View File

@ -1 +1 @@
{"Target":"css/post.min.3b28d14676e4769849164baf362f2b0aa069ab25702fef98f0c4227cb68d74cd.css","MediaType":"text/css","Data":{"Integrity":"sha256-OyjRRnbkdphJFkuvNi8rCqBpqyVwL++Y8MQifLaNdM0="}}
{"Target":"css/post.min.679ea46872c2b319c5ae942c601a7330924fd57451c89d621d6cb129c870c2a8.css","MediaType":"text/css","Data":{"Integrity":"sha256-Z56kaHLCsxnFrpQsYBpzMJJP1XRRyJ1iHWyxKchwwqg="}}