diff options
| -rw-r--r-- | _posts/processPosts.js | 14 | ||||
| -rw-r--r-- | posts.css | 18 | ||||
| -rw-r--r-- | posts.html | 9 | ||||
| -rw-r--r-- | posts/tag_books.html | 34 | ||||
| -rw-r--r-- | posts/tag_food.html | 34 | ||||
| -rw-r--r-- | posts/tag_programming.html | 34 |
6 files changed, 136 insertions, 7 deletions
diff --git a/_posts/processPosts.js b/_posts/processPosts.js index d4b2a2e..15cf4e5 100644 --- a/_posts/processPosts.js +++ b/_posts/processPosts.js @@ -7,6 +7,18 @@ const tags = [ { id: 'personal', title: 'Personal 👨' + }, + { + id: 'programming', + title: 'Programming 💻' + }, + { + id: 'books', + title: 'Books 📖' + }, + { + id: 'food', + title: 'Food 🍲' } ] @@ -119,7 +131,7 @@ function createPostPage(outputFile, postFilter) { <h2>Tags</h2> <div id='tag_list'> - ${tags.map(createTag)} + ${tags.map(createTag).join('\n')} </div> </section`} @@ -1,14 +1,20 @@ #tag_list { width: 100%; - display: flex; - flex-direction: row; - align-items: center; - column-gap: 4px; + display: grid; + grid-template-columns: repeat(3, 1fr); + column-gap: 8px; + row-gap: 8px } -#tag_list > button { - padding: 8px; +#tag_list button { + padding: 16px; cursor: pointer; + border: 1px solid transparent; + border-radius: 3px; + font-family: inherit; + font-size: 16px; + width: 100%; + height: 100%; } #post_list { @@ -29,6 +29,15 @@ <a href="/posts/tag_personal.html"><button id="personal">Personal 👨</button></a> + + <a href="/posts/tag_programming.html"><button id="programming">Programming 💻</button></a> + + + <a href="/posts/tag_books.html"><button id="books">Books 📖</button></a> + + + <a href="/posts/tag_food.html"><button id="food">Food 🍲</button></a> + </div> </section diff --git a/posts/tag_books.html b/posts/tag_books.html new file mode 100644 index 0000000..332900c --- /dev/null +++ b/posts/tag_books.html @@ -0,0 +1,34 @@ + +<!DOCTYPE html> +<html lang="en"> + <head> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta charset="utf-8"> + <link rel="stylesheet" href="/index.css"> + <link rel="stylesheet" href="/posts.css"> + <title>Matthew Kosarek</title> + <link rel="shortcut icon" href="/favicon/favicon.ico" type="image/x-icon"> + </head> + <body> + <header> + <h1>Matthew Kosarek</h1> + <nav> + <ul> + <li><a href='/'>🏡 Home</a></li> + <li><a href='/resume.html'>📘 CV</a></li> + <li><a href="https://www.linkedin.com/in/matthew-kosarek/">🏢 LinkedIn</a></li> + <li><a href='/posts.html'>📝 Posts</a></li> + </ul> + </nav> + </header> + + + + <section> + <h2>Posts</h2> + <ul id='post_list'> + + </ul> + </section> + </body> +</html> diff --git a/posts/tag_food.html b/posts/tag_food.html new file mode 100644 index 0000000..332900c --- /dev/null +++ b/posts/tag_food.html @@ -0,0 +1,34 @@ + +<!DOCTYPE html> +<html lang="en"> + <head> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta charset="utf-8"> + <link rel="stylesheet" href="/index.css"> + <link rel="stylesheet" href="/posts.css"> + <title>Matthew Kosarek</title> + <link rel="shortcut icon" href="/favicon/favicon.ico" type="image/x-icon"> + </head> + <body> + <header> + <h1>Matthew Kosarek</h1> + <nav> + <ul> + <li><a href='/'>🏡 Home</a></li> + <li><a href='/resume.html'>📘 CV</a></li> + <li><a href="https://www.linkedin.com/in/matthew-kosarek/">🏢 LinkedIn</a></li> + <li><a href='/posts.html'>📝 Posts</a></li> + </ul> + </nav> + </header> + + + + <section> + <h2>Posts</h2> + <ul id='post_list'> + + </ul> + </section> + </body> +</html> diff --git a/posts/tag_programming.html b/posts/tag_programming.html new file mode 100644 index 0000000..332900c --- /dev/null +++ b/posts/tag_programming.html @@ -0,0 +1,34 @@ + +<!DOCTYPE html> +<html lang="en"> + <head> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta charset="utf-8"> + <link rel="stylesheet" href="/index.css"> + <link rel="stylesheet" href="/posts.css"> + <title>Matthew Kosarek</title> + <link rel="shortcut icon" href="/favicon/favicon.ico" type="image/x-icon"> + </head> + <body> + <header> + <h1>Matthew Kosarek</h1> + <nav> + <ul> + <li><a href='/'>🏡 Home</a></li> + <li><a href='/resume.html'>📘 CV</a></li> + <li><a href="https://www.linkedin.com/in/matthew-kosarek/">🏢 LinkedIn</a></li> + <li><a href='/posts.html'>📝 Posts</a></li> + </ul> + </nav> + </header> + + + + <section> + <h2>Posts</h2> + <ul id='post_list'> + + </ul> + </section> + </body> +</html> |