diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/contact.tag | 57 | ||||
| -rw-r--r-- | src/components/content.tag | 11 | ||||
| -rw-r--r-- | src/components/header.tag | 31 | ||||
| -rw-r--r-- | src/components/list.tag | 7 | ||||
| -rw-r--r-- | src/components/post/index.js | 2 | ||||
| -rw-r--r-- | src/components/post/post.scss | 9 | ||||
| -rw-r--r-- | src/components/post/post.tag | 12 | ||||
| -rw-r--r-- | src/components/site.tag | 20 | ||||
| -rw-r--r-- | src/components/subheading.tag | 3 |
9 files changed, 41 insertions, 111 deletions
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 |
