diff --git a/README.md b/README.md
index fc36ec6..d2bdfba 100644
--- a/README.md
+++ b/README.md
@@ -9,6 +9,10 @@
> Includes bevy_dogoap which provides a neat Bevy integration of the dogoap library
+### [Live Demos](https://victorb.github.io/dogoap)
+
+[](https://victorb.github.io/dogoap)
+
## Documentation
- [`dogoap`](./crates/dogoap/README.md) docs - Standalone library for creation actions, states and goals to be used with the provided planner
diff --git a/docs/images/live_demo.png b/docs/images/live_demo.png
new file mode 100644
index 0000000..3deae84
Binary files /dev/null and b/docs/images/live_demo.png differ
diff --git a/web-src/index.html b/web-src/index.html
index 3a1463f..d382010 100644
--- a/web-src/index.html
+++ b/web-src/index.html
@@ -7,9 +7,13 @@
+
+
Dogoap - WASM Examples
+
diff --git a/web-src/style.css b/web-src/style.css
index 765e786..9733cf1 100644
--- a/web-src/style.css
+++ b/web-src/style.css
@@ -1,17 +1,15 @@
:root {
- --color1: rgba(0,0,0,0.9);
+ --color1: rgba(0, 0, 0, 0.9);
}
body {
- background: linear-gradient(
- 135deg,
- var(--color1) 0%,
- var(--color1) 49%,
- black 49%,
- black 51%,
- var(--color1) 51%,
- var(--color1) 100%
- ) repeat;
+ background: linear-gradient(135deg,
+ var(--color1) 0%,
+ var(--color1) 49%,
+ black 49%,
+ black 51%,
+ var(--color1) 51%,
+ var(--color1) 100%) repeat;
background-size: 20px 20px;
font-family: sans-serif;
}
@@ -47,6 +45,14 @@ canvas {
align-items: center;
}
+#title {
+ font-size: 26px;
+ margin-left: 10px;
+ font-family: monospace;
+ color: white;
+ text-align: center;
+}
+
#loading {
position: absolute;
z-index: 0;
@@ -54,21 +60,31 @@ canvas {
}
#menu {
- height: 30px;
+ height: 50px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: end;
+ padding-left: 10px;
}
-a {
- margin: 40px;
+#menu a {
font-size: 22px;
color: rgba(255, 255, 255, 0.8);
text-decoration: none;
+ margin-right: 50px;
}
-a.active, a:hover {
+#menu a.active,
+#menu a:hover {
color: rgba(255, 255, 255, 1.0);
text-decoration: underline;
}
+a.right-aligned {
+ margin-left: auto;
+ margin-right: 10px !important;
+}
+
[class*="shj-lang-"] {
margin: 0px;
padding: 0px;
@@ -78,9 +94,7 @@ a.active, a:hover {
font-size: 0.8em;
background-color: rgba(0, 0, 0, 0.3);
flex: 1;
- padding-top: 20px;
- padding-bottom: 20px;
max-height: 90vh;
overflow-y: scroll;
margin-left: 20px;
-}
+}
\ No newline at end of file