diff options
author | Sebastian <sebasjm@gmail.com> | 2022-06-05 23:10:51 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2022-06-05 23:11:38 -0300 |
commit | abb47b60ad6aa82f68c88c10b0fa614785cd123c (patch) | |
tree | 79fa39379ece376dd106c3865ca4b2f8531dc30d /packages/anastasis-webui/stories.html | |
parent | fee5de75624a1d8e42ac695876ab188ab2d92921 (diff) | |
download | wallet-core-abb47b60ad6aa82f68c88c10b0fa614785cd123c.tar.xz |
dev script without storybook
Diffstat (limited to 'packages/anastasis-webui/stories.html')
-rw-r--r-- | packages/anastasis-webui/stories.html | 72 |
1 files changed, 72 insertions, 0 deletions
diff --git a/packages/anastasis-webui/stories.html b/packages/anastasis-webui/stories.html new file mode 100644 index 000000000..9f41fdeaf --- /dev/null +++ b/packages/anastasis-webui/stories.html @@ -0,0 +1,72 @@ +<!DOCTYPE html> +<html> + <head> + <title>Stories</title> + <style> + /* page css */ + div.page { + margin: 0px; + padding: 0px; + font-size: 100%; + font-family: Arial, Helvetica, sans-serif; + } + div.page p:not([class]) { + margin-bottom: 1em; + margin-top: 1em; + } + div.page { + width: 100%; + display: flex; + flex-direction: row; + } + /* sidebar css */ + div.sidebar { + min-width: 200px; + height: calc(100vh - 20px); + overflow-y: visible; + overflow-x: hidden; + scroll-behavior: smooth; + } + div.sidebar > ol { + padding: 4px; + } + div.sidebar div:first-child { + background-color: lightcoral; + cursor: pointer; + } + div.sidebar div[data-hide="true"] { + display: none; + } + div.sidebar dd { + margin-left: 1em; + padding: 4px; + cursor: pointer; + border-radius: 4px; + margin-bottom: 4px; + } + div.sidebar dd:nth-child(even) { + background-color: lightgray; + } + div.sidebar dd:nth-child(odd) { + background-color: lightblue; + } + div.sidebar a { + color: black; + } + div.sidebar dd[data-selected] { + background-color: green; + } + + /* content css */ + div.content { + width: 100%; + padding: 20px; + } + </style> + <script src="./stories.js"></script> + <link rel="stylesheet" href="./main.css" /> + </head> + <body> + <taler-stories id="container"></taler-stories> + </body> +</html> |