summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--artifacts/layout.html28
-rw-r--r--artifacts/ui-demo.html117
2 files changed, 145 insertions, 0 deletions
diff --git a/artifacts/layout.html b/artifacts/layout.html
new file mode 100644
index 0000000..a06d6d0
--- /dev/null
+++ b/artifacts/layout.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <ul>
+ <li>/: root, filter, search</li>
+ <li>/parts: raw parts table</li>
+ <li>/parts.csv: CSV download of parts table</li>
+ <li>/cars: raw cars table</li>
+ <li>/cars.csv: CSV download of cars table</li>
+ <li>/suggestions: suggestion input form and appoval list</li>
+ <li>
+ /login: all the logins
+ <ul>
+ <li>/login/facebook</li>
+ <li>/login/google</li>
+ <li>/login/microsoft</li>
+ <li>/login/gitea</li>
+ </ul>
+ </li>
+ <li>/api/v1: JSON API</li>
+ <ul>
+ <li>/api/v1/parts</li>
+ <li>/api/v1/cars</li>
+ <li>/api/v1/suggestions</li>
+ </ul>
+ </ul>
+ </body>
+</html>
diff --git a/artifacts/ui-demo.html b/artifacts/ui-demo.html
new file mode 100644
index 0000000..1f85f8f
--- /dev/null
+++ b/artifacts/ui-demo.html
@@ -0,0 +1,117 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ body {
+ margin: 0;
+ padding: 0;
+ }
+ nav {
+ background-color: cadetblue;
+ margin: 0;
+ padding: 0;
+ height: 3em;
+ }
+ nav ul {
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ overflow: hidden;
+ }
+ .navItem {
+ float: left;
+ display: block;
+ padding: 14px 14px;
+ }
+ .navItem a {
+ color: white;
+ }
+ nav input {
+ right: 100%;
+ }
+
+ .sidebar {
+ background-color: cadetblue;
+ position: fixed;
+ top: 3em;
+ left: -250px;
+ width: 250px;
+ height: 100%;
+ transition: 0.25s;
+ }
+ #menu:target .sidebar {
+ left: 0;
+ }
+
+ .menuTogglePrimary a.closeMenu {
+ display: none;
+ }
+ #menu:target .menuTogglePrimary a.closeMenu {
+ display: block;
+ }
+
+ #menu:target .menuTogglePrimary a.openMenu {
+ display: none;
+ }
+
+ .content {
+ transition: margin-left 0.25s;
+ }
+ #menu:target .content {
+ margin-left: 250px;
+ }
+ </style>
+ </head>
+ <body id="menu">
+ <nav>
+ <div class="menuContainer">
+ <ul>
+ <li class="navItem">
+ <div class="menuTogglePrimary">
+ <a class="openMenu" href="#menu"
+ ><span
+ ><svg style="width: 24px; height: 24px" viewBox="0 0 24 24">
+ <path
+ fill="currentColor"
+ d="M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z"
+ /></svg></span
+ ></a>
+ <a class="closeMenu" href="#"
+ ><span
+ ><svg style="width: 24px; height: 24px" viewBox="0 0 24 24">
+ <path
+ fill="currentColor"
+ d="M21,15.61L19.59,17L14.58,12L19.59,7L21,8.39L17.44,12L21,15.61M3,6H16V8H3V6M3,13V11H13V13H3M3,18V16H16V18H3Z"
+ /></svg></span
+ ></a>
+ </div>
+
+ <div class="sidebar">
+ <ul>
+ <li>
+ <a href="#menu">Hudson</a>
+ <ul>
+ <li><a href="#menu">Hornet</a></li>
+ </ul>
+ </li>
+ <li><a href="#menu">Essex</a></li>
+ <li><a href="#menu">Terraplane</a></li>
+ </ul>
+ </div>
+ </li>
+ <li class="navItem"><a href="#">Catalog</a></li>
+ <li class="navItem"><a href="#">Parts List</a></li>
+ <li class="navItem"><a href="#">Cars List</a></li>
+ <li class="navItem"><a href="#">Suggestions</a></li>
+ <li class="navItem"><a href="#">About</a></li>
+ <li class="navItem"><a href="#">Login</a></li>
+ </ul>
+ </div>
+ </nav>
+
+ <div class="content">
+ <input type="search" placeholder="search" />
+ <p>this is the datas</p>
+ </div>
+ </body>
+</html>