Initial commit

8 files changed, 62 insertions, 0 deletions

diff --git a/src/components/content/content.tag b/src/components/content/content.tag
new file mode 100644
index 0000000..5cd08a6
--- /dev/null
+++ b/src/components/content/content.tag
@@ -0,0 +1,3 @@
+<content>
+  <counter />
+</content>
\ No newline at end of file
diff --git a/src/components/counter/counter.tag b/src/components/counter/counter.tag
new file mode 100644
index 0000000..d558e8e
--- /dev/null
+++ b/src/components/counter/counter.tag
@@ -0,0 +1,13 @@
+<counter>
+  <h3>Times clicked: { count }</h3>
+  <push-button />
+  <script>
+    this.count = 0;
+    const counter = this;
+
+    clicker.on('click', () => {
+      counter.count += 1;
+      counter.update();
+    });
+  </script>
+</counter>
\ No newline at end of file
diff --git a/src/components/header/header.less b/src/components/header/header.less
new file mode 100644
index 0000000..13ac353
--- /dev/null
+++ b/src/components/header/header.less
@@ -0,0 +1,9 @@
+@import "../../style.less";
+
+header h1 {
+  font-size: 5rem;
+  font-weight: 300;
+  @media screen and (max-width: @mobile-width) {
+    font-size: 3rem;
+  }
+}
\ No newline at end of file
diff --git a/src/components/header/header.tag b/src/components/header/header.tag
new file mode 100644
index 0000000..d0ebe95
--- /dev/null
+++ b/src/components/header/header.tag
@@ -0,0 +1,8 @@
+<header>
+  <h1>Riot + Parcel example</h1>
+  <subheading>A sample project using riot.js, less and parcel.</subheading>
+
+  <style type="less">
+    @import "header.less";
+  </style>
+</header>
\ No newline at end of file
diff --git a/src/components/push-button/push-button.less b/src/components/push-button/push-button.less
new file mode 100644
index 0000000..488fc37
--- /dev/null
+++ b/src/components/push-button/push-button.less
@@ -0,0 +1 @@
+@import "../../style.less";
\ No newline at end of file
diff --git a/src/components/push-button/push-button.tag b/src/components/push-button/push-button.tag
new file mode 100644
index 0000000..2d24c88
--- /dev/null
+++ b/src/components/push-button/push-button.tag
@@ -0,0 +1,13 @@
+<push-button>
+  <button onclick={ click }>Click me!</button>
+
+  <style type="less">
+    @import "./push-button";
+  </style>
+
+  <script>
+    click() {
+      clicker.trigger('click');
+    }
+  </script>
+</push-button>
\ No newline at end of file
diff --git a/src/components/site/site.tag b/src/components/site/site.tag
new file mode 100644
index 0000000..c5e8706
--- /dev/null
+++ b/src/components/site/site.tag
@@ -0,0 +1,10 @@
+<site>
+  <header />
+  <content />
+
+  <script>
+  /* Import everything that you want to have in scope in your tags here */
+  import riot from 'riot';
+  import { clicker } from './observables';
+  </script>
+</site>
\ No newline at end of file
diff --git a/src/components/subheading/subheading.tag b/src/components/subheading/subheading.tag
new file mode 100644
index 0000000..4266a7b
--- /dev/null
+++ b/src/components/subheading/subheading.tag
@@ -0,0 +1,5 @@
+<subheading>
+  <h2>
+    <yield />
+  </h2>
+</subheading>
\ No newline at end of file