update README
This commit is contained in:
Talon Poole
parent
18b8c73ce3
commit
1baa403227
46
README.md
46
README.md
|
|
@ -1,4 +1,4 @@
|
||||||
This project is home to a [gmi-to-html reference](#gmi-to-html), the [gmi-web(1) ](#gmi-web-1) command-line tool and a [gmi.css](#gmi-css) stylesheet.
|
This project is home to a [gmi-to-html reference](#gmi-to-html), a [gmi.css](#gmi-css) stylesheet and the [gmi-web(1) ](#gmi-web-1) command-line tool.
|
||||||
|
|
||||||
# gmi-to-html
|
# gmi-to-html
|
||||||
|
|
||||||
|
|
@ -16,13 +16,13 @@ The converted Gemini document should exist inside the `<body>`. Consider if shar
|
||||||
`<li>` must be wrapped with a `<ul>` tag. Take care to render `<pre>` blocks with their original formatting, DO NOT indent the generated
|
`<li>` must be wrapped with a `<ul>` tag. Take care to render `<pre>` blocks with their original formatting, DO NOT indent the generated
|
||||||
HTML for these tags.
|
HTML for these tags.
|
||||||
|
|
||||||
`<a>` tags are categorized as [inline](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow#elements_participating_in_an_inline_formatting_context) which CSS 2.1's [Normal Flow](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow) presents _vertically_—Gemini only deals with _horizontally_ flowing content, this can be addressed by using [`display: block;` at the CSS level.](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow#changing_the_formatting_context_an_element_participates_in)
|
`<a>` tags are categorized as [inline](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow#elements_participating_in_an_inline_formatting_context) which CSS [Normal Flow](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow) presents _vertically_—Gemini only deals with _horizontally_ flowing content, this can be addressed by using [`display: block;` at the CSS level.](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow#changing_the_formatting_context_an_element_participates_in)
|
||||||
|
|
||||||
## optional: inline media
|
## optional: inline media
|
||||||
|
|
||||||
If a link is consumable by `<img>`, `<audio>` or `<video>` you may insert the respective tag inline, instead of an `<a>`. It's a good idea to also include the `controls`, `currentTime` and `duration` attributes.
|
If a link is consumable by `<img>`, `<audio>` or `<video>` you may insert the respective tag inline, instead of an `<a>`. It's a good idea to also include the `controls` property.
|
||||||
|
|
||||||
These are categorized as inline just like `<a>` and will need `display: block;` styling. Images and video should also have `max-width: 100%;` so they don't overflow the body.
|
These are categorized as inline just like `<a>` and will need `display: block;` styling. Images and video should also have `max-width: 100%;` so they don't overflow the body.
|
||||||
|
|
||||||
## `<html>` and `<head>`
|
## `<html>` and `<head>`
|
||||||
|
|
||||||
|
|
@ -45,6 +45,25 @@ These may also be nice to have:
|
||||||
<meta name="color-scheme" content="dark light" />
|
<meta name="color-scheme" content="dark light" />
|
||||||
```
|
```
|
||||||
|
|
||||||
|
# gmi.css
|
||||||
|
|
||||||
|
[core.css](./core.css) is a maximally miniminal stylesheet that overrides the default CSS Normal Flow to render content horizontally in a Gemini way. [gmi.css](./gmi.css) extends upon that slightly with font and color options. The default values are optimized for readability and mobile-friendliness and may be customized by adding a style property to `<html>`.
|
||||||
|
|
||||||
|
```html
|
||||||
|
<head>
|
||||||
|
<!-- assuming you wanna host a copy and link to it... -->
|
||||||
|
<link rel="stylesheet" type="text/css" href="gmi.css" />
|
||||||
|
<meta name="color-scheme" content="dark light" />
|
||||||
|
<!-- ... -->
|
||||||
|
</head>
|
||||||
|
<html style="--foreground:#555555; --background:#9EEBCF;">
|
||||||
|
<!-- ... -->
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
The `--foreground` and `--background` variables will be inverted when
|
||||||
|
[prefers-color-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) is "dark".
|
||||||
|
|
||||||
# gmi-web(1)
|
# gmi-web(1)
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
|
|
@ -142,25 +161,6 @@ A JSON file can be passed to `--config` for conveniently applying any option wit
|
||||||
gmi-web --config web.json $(find ~/gmi/dst -name '*.gmi')
|
gmi-web --config web.json $(find ~/gmi/dst -name '*.gmi')
|
||||||
```
|
```
|
||||||
|
|
||||||
# gmi.css
|
|
||||||
|
|
||||||
[core.css](./core.css) is a maximally miniminal stylesheet that overrides the default CSS Normal Flow to render content horizontally in a Gemini way. [gmi.css](./gmi.css) extends upon that slightly with font and color options. The default values are optimized for readability and mobile-friendliness and may be customized by adding a style property to `<html>`.
|
|
||||||
|
|
||||||
```html
|
|
||||||
<head>
|
|
||||||
<!-- assuming you wanna host a copy and link to it... -->
|
|
||||||
<link rel="stylesheet" type="text/css" href="gmi.css" />
|
|
||||||
<meta name="color-scheme" content="dark light" />
|
|
||||||
<!-- ... -->
|
|
||||||
</head>
|
|
||||||
<html style="--foreground:#555555; --background:#9EEBCF;">
|
|
||||||
<!-- ... -->
|
|
||||||
</html>
|
|
||||||
```
|
|
||||||
|
|
||||||
The `--foreground` and `--background` variables will be inverted when
|
|
||||||
[prefers-color-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) is "dark".
|
|
||||||
|
|
||||||
# license
|
# license
|
||||||
|
|
||||||
gmi-web is free and unencumbered public domain software. For more information, see http://unlicense.org/ or the accompanying UNLICENSE file.
|
gmi-web is free and unencumbered public domain software. For more information, see http://unlicense.org/ or the accompanying UNLICENSE file.
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
gmi-web(1) "1.0.11-rc.2"
|
gmi-web(1) "1.0.0-rc.3"
|
||||||
|
|
||||||
# NAME
|
# NAME
|
||||||
|
|
||||||
|
|
|
||||||
2
package-lock.json
generated
2
package-lock.json
generated
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "gmi-web-cli",
|
"name": "gmi-web-cli",
|
||||||
"version": "1.0.10-rc.2",
|
"version": "1.0.11-rc.2",
|
||||||
"lockfileVersion": 1,
|
"lockfileVersion": 1,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "gmi-web-cli",
|
"name": "gmi-web-cli",
|
||||||
"version": "1.0.11-rc.2",
|
"version": "1.0.0-rc.3",
|
||||||
"description": "A bridge between HTML and Gemini",
|
"description": "A bridge between HTML and Gemini",
|
||||||
"main": "html.js",
|
"main": "html.js",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
|
|
@ -14,6 +14,7 @@
|
||||||
"UNLICENSE",
|
"UNLICENSE",
|
||||||
"README.md",
|
"README.md",
|
||||||
"gmi-web.1",
|
"gmi-web.1",
|
||||||
|
"core.css",
|
||||||
"gmi.css",
|
"gmi.css",
|
||||||
"html.js",
|
"html.js",
|
||||||
"css.js",
|
"css.js",
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue