60 lines
2.5 KiB
HTML
60 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<meta name="color-scheme" content="dark light">
|
|
<link rel="stylesheet" href="gmi.min.css">
|
|
</head>
|
|
<body contenteditable="false">
|
|
<h1>gmi-web</h1>
|
|
<h2>example.html</h2>
|
|
<h3>a reference</h3>
|
|
<!--
|
|
Presenting an empty line this way enables flipping contenteditable="true"
|
|
to possibly add content to it. This is not true for a regular <br>.
|
|
-->
|
|
<p><br></p>
|
|
<p>While not strictly necessary I'd recommend keeping lines on the same line in the markup unless it's a preformatted (or you're rendering the newlines as contenteditable might which is NOT recommended.)</p>
|
|
<p><br></p>
|
|
<a href="https://codeberg.org/talon/gmi-web">gmi-web on codeberg.org</a>
|
|
<blockquote>DO NOT wrap "a" tags in anything. Use "display: block;" to fix layout issues (gmi.css does this)</blockquote>
|
|
<p><br></p>
|
|
<pre>
|
|
be sure to render preformatted text as is
|
|
including newlines
|
|
and leading spaces!
|
|
(rendering the html sans indention is recommended)
|
|
</pre>
|
|
<p><br></p>
|
|
<ul>
|
|
<li>milk</li>
|
|
<li></li> <!-- empty list item -->
|
|
<li>bread</li>
|
|
</ul>
|
|
<p><br></p>
|
|
<p>Optionally, if a link is consumable by "img", "audio" or "video" you may insert the media inline. Images and video should be styled to have "max-width: 100%;" so they don't overflow the body. It's a good idea to also include the "controls" attribute for videos and audio. "audio" tags require "display: block;" just like "a".</p>
|
|
<img src="https://www.learningcontainer.com/wp-content/uploads/2020/08/Large-Sample-png-Image-download-for-Testing.png"/>
|
|
<video controls src="https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4"></video>
|
|
<audio controls src="https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3"></audio>
|
|
<p><br></p>
|
|
<h3>in the browser:</h3>
|
|
<p>
|
|
While Gemini does not support newlines on a regular text line when editing a "p" tag in the browser
|
|
the default behavior for "enter" will create a "br" and not a new "p".
|
|
</p>
|
|
<p><br></p>
|
|
<blockquote>
|
|
<div>The same is also true for ">" lines except in the browser with "blockquote" tags</div>
|
|
<div>the default behavior for "enter" will create a "div" and not a new "p".</div>
|
|
</blockquote>
|
|
<p><br></p>
|
|
<pre>
|
|
Newlines are respected by "pre" tags however also when you are editing one in a brower
|
|
<br>
|
|
the default behavior for "enter" will create a "br".
|
|
</pre>
|
|
</body>
|
|
<!-- <script src="gmi.min.js></script> -->
|
|
</html>
|