From 04a05206ff197fef47a985a24dfde7ae9c405520 Mon Sep 17 00:00:00 2001
From: Jan Tuomi <jans.tuomi@gmail.com>
Date: Thu, 28 Dec 2017 15:07:01 +0200
Subject: Remake a lot of stuff

---
 src/api.js                    |   8 ++++++
 src/components/contact.tag    |  57 ------------------------------------------
 src/components/content.tag    |  11 --------
 src/components/header.tag     |  31 -----------------------
 src/components/list.tag       |   7 ------
 src/components/post/index.js  |   2 ++
 src/components/post/post.scss |   9 +++++++
 src/components/post/post.tag  |  12 +++++++++
 src/components/site.tag       |  20 +++++++++++++--
 src/components/subheading.tag |   3 ---
 src/index.ejs                 |  15 +++++++++++
 src/index.html                |  25 ------------------
 src/made-with.png             | Bin 4677 -> 0 bytes
 src/main.js                   |   6 +++++
 src/style.css                 |  39 -----------------------------
 src/style.scss                |  29 +++++++++++++++++++++
 16 files changed, 99 insertions(+), 175 deletions(-)
 create mode 100644 src/api.js
 delete mode 100644 src/components/contact.tag
 delete mode 100644 src/components/content.tag
 delete mode 100644 src/components/header.tag
 delete mode 100644 src/components/list.tag
 create mode 100644 src/components/post/index.js
 create mode 100644 src/components/post/post.scss
 create mode 100644 src/components/post/post.tag
 delete mode 100644 src/components/subheading.tag
 create mode 100644 src/index.ejs
 delete mode 100644 src/index.html
 delete mode 100644 src/made-with.png
 create mode 100644 src/main.js
 delete mode 100644 src/style.css
 create mode 100644 src/style.scss

(limited to 'src')

diff --git a/src/api.js b/src/api.js
new file mode 100644
index 0000000..c0c6204
--- /dev/null
+++ b/src/api.js
@@ -0,0 +1,8 @@
+const get = async path => {
+  const url = process.env.BACKEND_API_URL;
+
+  const resp = await fetch(`${url}${path}`);
+  return await resp.json();
+};
+
+export default get;
\ No newline at end of file
diff --git a/src/components/contact.tag b/src/components/contact.tag
deleted file mode 100644
index c4a2815..0000000
--- a/src/components/contact.tag
+++ /dev/null
@@ -1,57 +0,0 @@
-<contact>
-  <div>
-    <a href="https://www.linkedin.com/in/jantuomi/" alt="Linkedin">
-      <span class="icon"><i class="fa fa-linkedin fa-lg" aria-hidden="true" /></span>
-      <span class="url">linkedin.com/in/jantuomi</span>
-    </a>
-  </div>
-  <div>
-    <a href="https://t.me/jantuomi" alt="Telegram">
-      <span class="icon"><i class="fa fa-telegram fa-lg" aria-hidden="true" /></span>
-      <span class="url">t.me/jantuomi</span>
-    </a>
-  </div>
-  <div>
-    <a href="mailto:jans.tuomi@gmail.com" alt="Email">
-      <span class="icon"><i class="fa fa-envelope fa-lg" aria-hidden="true" /></span>
-      <span class="url">jans.tuomi@gmail.com</span>
-    </a>
-  </div>
-
-
-  <style>
-
-    a {
-      text-decoration: none;
-      white-space: nowrap;
-    }
-
-    div {
-      margin: 0.5rem;
-    }
-
-    span.icon {
-      text-align: center;
-    }
-
-    span.icon i {
-      width: 2rem;
-    }
-
-    span.url {
-      margin-left: 2rem;
-    }
-
-    @media screen and (max-width: 600px) {
-      span.url {
-        display: none;
-      }
-
-      span.icon i {
-        font-size: 2rem;
-        margin: 0.5rem;
-      }
-    }
-
-  </style>
-</contact>
\ No newline at end of file
diff --git a/src/components/content.tag b/src/components/content.tag
deleted file mode 100644
index 208f531..0000000
--- a/src/components/content.tag
+++ /dev/null
@@ -1,11 +0,0 @@
-<content>
-  <subheading text="Contact me" />
-  <contact />
-
-  <subheading text="Check out my..." />
-  <list items={ items } />
-
-  <script>
-    this.items = [{ title: '.vimrc', url: '/.vimrc'}];
-  </script>
-</content>
\ No newline at end of file
diff --git a/src/components/header.tag b/src/components/header.tag
deleted file mode 100644
index 13e37ae..0000000
--- a/src/components/header.tag
+++ /dev/null
@@ -1,31 +0,0 @@
-<header>
-  <h1>Hello, my name is Jan</h1>
-
-  <style>
-    header {
-      display: flex;
-    }
-
-    h1, a {
-      justify-content: space-between;
-      align-items: center;
-      flex-grow: 1;
-    }
-
-    img {
-      object-fit: contain;
-      max-width: 20%;
-    }
-
-    h1 {
-      font-size: 5rem;
-      font-weight: 300;
-    }
-
-    @media screen and (max-width: 600px) {
-      h1 {
-        font-size: 3rem;
-      }
-    }
-  </style>
-</header>
\ No newline at end of file
diff --git a/src/components/list.tag b/src/components/list.tag
deleted file mode 100644
index 600603f..0000000
--- a/src/components/list.tag
+++ /dev/null
@@ -1,7 +0,0 @@
-<list>
-  <ul>
-    <li each={ opts.items }>
-      <a href={ url }>{ title }</a>
-    </li>
-  </ul>
-</list>
\ No newline at end of file
diff --git a/src/components/post/index.js b/src/components/post/index.js
new file mode 100644
index 0000000..a3fac5e
--- /dev/null
+++ b/src/components/post/index.js
@@ -0,0 +1,2 @@
+import post from './post.tag';
+export default post;
\ No newline at end of file
diff --git a/src/components/post/post.scss b/src/components/post/post.scss
new file mode 100644
index 0000000..8732257
--- /dev/null
+++ b/src/components/post/post.scss
@@ -0,0 +1,9 @@
+.post {
+  margin: 1rem 0 1rem;
+  padding: 1rem;
+  border-style: solid;
+}
+
+.post:hover {
+  background-color: rgb(158, 222, 238);
+}
\ No newline at end of file
diff --git a/src/components/post/post.tag b/src/components/post/post.tag
new file mode 100644
index 0000000..ca6040e
--- /dev/null
+++ b/src/components/post/post.tag
@@ -0,0 +1,12 @@
+<post>
+  <div class="post">
+    <h2>{ opts.title }</h2>
+    <small>Author: { opts.author }</small>
+  </div>
+
+  <script type="es6">
+    import style from './post.scss';
+    
+  
+  </script>
+</post>
diff --git a/src/components/site.tag b/src/components/site.tag
index e703743..2ced590 100644
--- a/src/components/site.tag
+++ b/src/components/site.tag
@@ -1,4 +1,20 @@
 <site>
-  <header />
-  <content />
+  <h1>List of posts</h1>
+  <div each={ posts }>
+    <post title={title} author={author} />
+  </div>
+
+  <script type="es6">
+    import get from '../api';
+    import post from './post';
+    this.posts = [];
+
+    const updatePosts = async () => {
+      const posts = await get('/posts');
+      this.update({posts});
+    };
+
+    updatePosts();
+
+  </script>
 </site>
\ No newline at end of file
diff --git a/src/components/subheading.tag b/src/components/subheading.tag
deleted file mode 100644
index fda52e4..0000000
--- a/src/components/subheading.tag
+++ /dev/null
@@ -1,3 +0,0 @@
-<subheading>
-  <h2>{ opts.text }</h2>
-</subheading>
\ No newline at end of file
diff --git a/src/index.ejs b/src/index.ejs
new file mode 100644
index 0000000..51bffc0
--- /dev/null
+++ b/src/index.ejs
@@ -0,0 +1,15 @@
+<!doctype html>
+<html lang="en">
+
+  <head>
+    <title>Jan Tuomi</title>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="https://fonts.googleapis.com/css?family=Lato:400,400i,700" rel="stylesheet">
+    <script src="https://use.fontawesome.com/eaed73f4f5.js"></script>
+  </head>
+
+  <body>
+    <site></site>
+  </body>
+</html>
diff --git a/src/index.html b/src/index.html
deleted file mode 100644
index 0a8fd59..0000000
--- a/src/index.html
+++ /dev/null
@@ -1,25 +0,0 @@
-<!doctype html>
-<html lang="en">
-
-  <head>
-    <title>Jan Tuomi</title>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link href="https://fonts.googleapis.com/css?family=Lato:400,400i,700" rel="stylesheet">
-    <script src="https://use.fontawesome.com/eaed73f4f5.js"></script>
-    <link rel="stylesheet" href="style.css">    
-  </head>
-
-  <body>
-    <site></site>
-    
-    <!-- scripts we need -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/riot/3.7.4/riot.min.js"></script>
-
-    <!-- riot tags -->
-    <script src="bundle.js"></script>
-
-    <!-- mount this app -->
-    <script> riot.mount('*') </script>
-  </body>
-</html>
diff --git a/src/made-with.png b/src/made-with.png
deleted file mode 100644
index 2f1854c..0000000
Binary files a/src/made-with.png and /dev/null differ
diff --git a/src/main.js b/src/main.js
new file mode 100644
index 0000000..9ce067c
--- /dev/null
+++ b/src/main.js
@@ -0,0 +1,6 @@
+import riot from 'riot'
+import 'riot-hot-reload'
+import './components/site.tag';
+import style from './style.scss';
+
+riot.mount('site');
\ No newline at end of file
diff --git a/src/style.css b/src/style.css
deleted file mode 100644
index 4c1d58a..0000000
--- a/src/style.css
+++ /dev/null
@@ -1,39 +0,0 @@
-*, *:before, *:after {
-  box-sizing: inherit;
-}
-
-html {
-  font-family: 'Lato', sans-serif;
-  font-size: 20px;
-  
-  background-color: #affbff78;
-  box-sizing: border-box;
-}
-
-body {
-  border: 0;
-
-  max-width: 600px;
-  margin-left: auto;
-  margin-right: auto;
-
-  padding: 1rem;
-}
-
-@media screen and (max-width: 600px) {
-  body {
-    text-align: center;
-  }
-
-  ul {
-    padding: 0;
-  }
-
-  li {
-    list-style: none;
-  }
-}
-
-a {
-  color: #570C3D;
-}
\ No newline at end of file
diff --git a/src/style.scss b/src/style.scss
new file mode 100644
index 0000000..7869783
--- /dev/null
+++ b/src/style.scss
@@ -0,0 +1,29 @@
+*, *:before, *:after {
+  box-sizing: inherit;
+}
+
+html {
+  font-family: 'Lato', sans-serif;
+  font-size: 20px;
+  
+  background-color: #affbff78;
+  box-sizing: border-box;
+}
+
+body {
+  border: 0;
+
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
+
+  padding: 1rem;
+}
+
+h1, h2 {
+  margin: 0;
+}
+
+a {
+  color: #570C3D;
+}
\ No newline at end of file
-- 
cgit v1.3