diff options
author | Adam T. Carpenter <atc@53hor.net> | 2021-04-09 18:50:55 -0400 |
---|---|---|
committer | Adam T. Carpenter <atc@53hor.net> | 2021-04-09 18:50:55 -0400 |
commit | 201a37e8d3d0ef4c59b184c0707ec8ddd301a25a (patch) | |
tree | 1aae6c03bfb9f694adea81510dacf586311fcc12 /src/templates/base.hbs | |
parent | 881e4bf3c9141b4bebaefaf6385652ed46d9a9fe (diff) | |
download | twinh-201a37e8d3d0ef4c59b184c0707ec8ddd301a25a.tar.xz twinh-201a37e8d3d0ef4c59b184c0707ec8ddd301a25a.zip |
spruced up templates, some repo impl
Diffstat (limited to 'src/templates/base.hbs')
-rw-r--r-- | src/templates/base.hbs | 155 |
1 files changed, 155 insertions, 0 deletions
diff --git a/src/templates/base.hbs b/src/templates/base.hbs new file mode 100644 index 0000000..df3ba9d --- /dev/null +++ b/src/templates/base.hbs @@ -0,0 +1,155 @@ +<!DOCTYPE html> +<html> + +<head> + <style> + :root { + --balboa: #195970; + } + + body { + margin: 0; + padding: 0; + font-size: 1em; + } + + .model::before { + content: "⤷"; + } + + .topbar { + background-color: var(--balboa); + box-shadow: 0 0 0.5em black; + position: relative; + height: 3em; + z-index: 2; + } + + .topbar ul { + margin: 0; + padding: 0; + overflow: hidden; + } + + .topbar li { + float: left; + display: block; + padding: 14px 14px; + } + + .topbar li.right { + float: right; + } + + .topbar li a { + color: white; + text-decoration: none; + } + + .sidebar { + background-color: var(--balboa); + box-shadow: inset -0.5em 0 0.5em -0.5em black; + z-index: 1; + position: fixed; + top: 3em; + left: 0; + width: 20%; + height: 100%; + transition: 0.25s; + } + + .sidebar form { + padding: 10px 10px; + } + + .sidebar button { + font-size: 1em; + display: block; + background: none; + border: 0 none; + cursor: pointer; + color: white; + } + + .model { + margin-left: 20px; + } + + #hidden:target .sidebar { + left: -20%; + } + + .menuToggle a.openMenu { + display: none; + } + + #hidden:target .menuToggle a.closeMenu { + display: none; + } + + #hidden:target .menuToggle a.openMenu { + display: block; + } + + #hidden:target section { + margin-left: 0; + } + + .catalogTable { + width: 100%; + border-collapse: collapse; + } + + .catalogTable td, + .catalogTable th { + padding: 0.5em; + } + + .catalogTable tr:nth-child(even) { + background-color: #f2f2f2; + } + + .catalogTable tr:hover { + background-color: #ddd; + } + + .catalogTable th { + padding-top: 12px; + padding-bottom: 12px; + text-align: left; + background-color: var(--balboa); + color: white; + } + + input[type="search"] { + width: 100%; + } + + section { + /* TODO: need to make this not applicable to other templates that don't have sidebar */ + margin-left: 20%; + transition: margin-left 0.25s; + padding-top: 2em; + padding-left: 2em; + padding-right: 2em; + } + </style> +</head> + +<body id="hidden"> + <nav class="topbar"> + <ul> + {{~> navItem}} + <li><a href="/">Index</a></li> + <li><a href="#">Parts</a></li> + <li><a href="#">Cars</a></li> + <li><a href="#">Suggestions</a></li> + <li><a href="#">About</a></li> + <li class="right"><a href="/login">Login</a></li> + </ul> + </nav> + + {{~> body}} +</body> + +</html> |