Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
95 lines
2.3 KiB
HTML
Executable file
95 lines
2.3 KiB
HTML
Executable file
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Object menu</title>
|
|
<meta name="description" content="Presenting a list of actions related to the App content">
|
|
|
|
<link rel="stylesheet" href="../object_menu.css">
|
|
<link rel="stylesheet" href="../input_areas.css">
|
|
<link rel="stylesheet" href="../../elements/gaia-icons/gaia-icons-embedded.css">
|
|
<!--
|
|
- These <style> and <script> elements are only used for the example code;
|
|
- they are not required for the real use case.
|
|
-->
|
|
<style type="text/css">
|
|
html, body {
|
|
font-family: sans-serif;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 10px;
|
|
background-color: #fff;
|
|
}
|
|
body {
|
|
background: none;
|
|
}
|
|
</style>
|
|
<script>
|
|
window.onkeypress = event => {
|
|
var dir = document.documentElement.dir;
|
|
document.documentElement.dir = (dir === 'ltr') ? 'rtl' : 'ltr';
|
|
};
|
|
</script>
|
|
</head>
|
|
<body role="application">
|
|
<p dir="ltr">
|
|
<label>
|
|
<input type="checkbox"
|
|
onchange="document.documentElement.dir = this.checked ? 'rtl' : 'ltr'">
|
|
RTL mode
|
|
</label>
|
|
</p>
|
|
|
|
<form role="dialog" data-type="object">
|
|
<header>Title</header> <!-- this header is optional -->
|
|
<section>
|
|
<ul>
|
|
<li>First item</li>
|
|
<li><p>One Paragraph</p></li>
|
|
<li>
|
|
<p>Two</p>
|
|
<p>Paragraphs</p>
|
|
</li>
|
|
<li>
|
|
<p dir="auto">Two Paragraphs (one empty)</p>
|
|
<p></p>
|
|
</li>
|
|
</ul>
|
|
<h2>Buttons</h2>
|
|
<ul>
|
|
<li><button>Button</button></li>
|
|
<li><a href="#">Anchor</a></li>
|
|
<li>
|
|
<a href="#">
|
|
<p>Paragrah inside anchor</p>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">
|
|
<p>Two Paragrahs</p>
|
|
<p>inside anchor</p>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<h2>inputs</h2>
|
|
<ul class="skin-dark">
|
|
<li class="input">
|
|
<p>
|
|
<input type="text" placeholder="Placeholder">
|
|
<button type="reset"></button>
|
|
</p>
|
|
|
|
<p>
|
|
<textarea placeholder="Placeholder in textarea"></textarea>
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<menu>
|
|
<button>Cancel</button>
|
|
</menu>
|
|
</form>
|
|
|
|
</body>
|
|
</html>
|
|
|