mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-21 00:56:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Docs: separate pages

Browse source
This commit is contained in:
Lucas Larroche 2021-10-31 21:33:19 +07:00
parent cea5c8c04c
commit bbb53c7dd4
61 changed files with 2994 additions and 1498 deletions
Download patch file Download diff file Expand all files Collapse all files

43
docs/src/tooltips.html Normal file
View file

@ -0,0 +1,43 @@
<!doctype html>
<html lang="en">
<head>
${require('./_head.html')
title="Tooltips"
description="Enable tooltips everywhere in pure HTML, without JavaScript."
canonical="tooltips.html"
}
</head>
<body>
${require('./_nav.html')}
<main class="container" id="docs">
${require('./_sidebar.html') active="tooltips-link"}
<div role="document">
<section id="tooltips">
<hgroup>
<h2>Tooltips</h2>
<h3>Enable tooltips everywhere in pure HTML, without JavaScript.</h3>
</hgroup>
<article aria-label="Tooltips examples">
<p>Tooltip on a <a href="#" onclick="event.preventDefault()" data-tooltip="Tooltip">link</a></p>
<p>Tooltip on <em data-tooltip="Tooltip">inline element</em></p>
<p><button data-tooltip="Tooltip" aria-label="Example button">Tooltip on a button</button></p>
<footer class="code">
<pre><code>&lt;<b>p</b>&gt;Tooltip on a &lt;<b>a</b> <i>href</i>=<u>"#"</u> <i>data-tooltip</i>=<u>"Tooltip"</u>&gt;link&lt;/<b>a</b>&gt;&lt;/<b>p</b>&gt;
&lt;<b>p</b>&gt;Tooltip on &lt;<b>em</b> <i>data-tooltip</i>=<u>"Tooltip"</u>&gt;inline element&lt;/<b>em</b>&gt;&lt;/<b>p</b>&gt;
&lt;<b>p</b>&gt;&lt;<b>button</b> <i>data-tooltip</i>=<u>"Tooltip"</u>&gt;Tooltip on a button&lt;/<b>button</b>&gt;&lt;/<b>p</b>&gt;</code></pre>
</footer>
</article>
</section>
${require('./_footer.html')}
</div>
</main>
<script src="js/commons.min.js"></script>
</body>
</html>