+
+
\ No newline at end of file
diff --git a/src/js/forms/apps.riot b/src/js/forms/apps.riot
new file mode 100644
index 0000000..603433d
--- /dev/null
+++ b/src/js/forms/apps.riot
@@ -0,0 +1,239 @@
+
+
+
+
+
+ { handleClose(event) }}>
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/js/forms/footer.riot b/src/js/forms/footer.riot
new file mode 100644
index 0000000..1edf02b
--- /dev/null
+++ b/src/js/forms/footer.riot
@@ -0,0 +1,16 @@
+
+
+
\ No newline at end of file
diff --git a/src/js/forms/header.riot b/src/js/forms/header.riot
new file mode 100644
index 0000000..0f7cf53
--- /dev/null
+++ b/src/js/forms/header.riot
@@ -0,0 +1,14 @@
+
+
+
+ { props.title }
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/js/mixins/sidebarForm.js b/src/js/mixins/sidebarForm.js
new file mode 100644
index 0000000..f899ae7
--- /dev/null
+++ b/src/js/mixins/sidebarForm.js
@@ -0,0 +1,60 @@
+/**
+ * Mixin to Extend a Sidebar
+ *
+ * @author Björn Hase
+ * @license http://opensource.org/licenses/MIT The MIT License
+ * @link https://gitea.node001.net/tiny-components/sidebar-form
+ *
+ */
+
+export default {
+
+ state: {
+ open: false, // if sidebar is open
+ loading: false, // if loading is shown
+ current: { // current data of form
+
+ }
+ },
+
+ /**
+ * close current sidebar
+ *
+ */
+ handleClose() {
+ this.state.open = false
+ this.reset()
+
+ this.update()
+ },
+
+ /**
+ * getting css classes for sidebar
+ *
+ *
+ * @return {String}
+ */
+ getCssClasses() {
+ const classes = [
+ 'sidebar'
+ ]
+
+ if (this.state.open === true) {
+ classes.push('sidebar--open')
+ }
+
+ return classes.join(' ')
+ },
+
+ /**
+ *
+ *
+ */
+ onBeforeMount() {
+ if (!this.hasOwnProperty('reset')) {
+ throw new Error('reset-Function in Form is missing')
+ }
+
+ this.reset()
+ }
+}
\ No newline at end of file
diff --git a/src/js/stores/apps.js b/src/js/stores/apps.js
new file mode 100644
index 0000000..b4fca7d
--- /dev/null
+++ b/src/js/stores/apps.js
@@ -0,0 +1,14 @@
+/**
+ * example store for trigger open
+ *
+ * @author Björn Hase
+ * @license http://opensource.org/licenses/MIT The MIT License
+ * @link https://gitea.node001.net/tiny-components/sidebar-form
+ *
+ */
+
+ import observable from '@riotjs/observable'
+
+ export default observable({
+
+ })
\ No newline at end of file
diff --git a/src/js/stores/form.js b/src/js/stores/form.js
new file mode 100644
index 0000000..121b418
--- /dev/null
+++ b/src/js/stores/form.js
@@ -0,0 +1,22 @@
+/**
+ * example store for trigger open
+ *
+ * @author Björn Hase
+ * @license http://opensource.org/licenses/MIT The MIT License
+ * @link https://gitea.node001.net/tiny-components/sidebar-form
+ *
+ */
+
+ import observable from '@riotjs/observable'
+
+ export default observable({
+
+ /**
+ *
+ * @param {object} data
+ *
+ */
+ open() {
+ this.trigger('open')
+ }
+ })
\ No newline at end of file
diff --git a/src/js/views/apps.riot b/src/js/views/apps.riot
new file mode 100644
index 0000000..b694bf5
--- /dev/null
+++ b/src/js/views/apps.riot
@@ -0,0 +1,143 @@
+
+