From 206168059337df24d2aa0593cecd67f6219265a9 Mon Sep 17 00:00:00 2001 From: jultty Date: Wed, 5 Jun 2024 14:28:29 -0300 Subject: [PATCH] Prototype links page --- .gitignore | 1 + assets/css/style.css | 11 +++++++++++ assets/js/data.js | 18 +++++++++++------- assets/js/links.js | 18 ++++++++++++++++++ assets/js/main.js | 2 +- index.html | 1 + pages/links.html | 18 ++++++++++++++++++ 7 files changed, 61 insertions(+), 8 deletions(-) create mode 100644 assets/js/links.js create mode 100644 pages/links.html diff --git a/.gitignore b/.gitignore index e69de29..68452cd 100644 --- a/.gitignore +++ b/.gitignore @@ -0,0 +1 @@ +ideas diff --git a/assets/css/style.css b/assets/css/style.css index 498a7bf..9b291c0 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -103,6 +103,17 @@ footer { /* widescreen */ @media (min-width: 1000px) { + .article { + margin: 0 20%; + } + + h1 { + margin-left: 45px; + } +} + +/* fullscreen */ +@media (min-width: 1500px) { .article { margin: 0 30%; } diff --git a/assets/js/data.js b/assets/js/data.js index 50c246a..3505086 100644 --- a/assets/js/data.js +++ b/assets/js/data.js @@ -1,22 +1,26 @@ function get_data() { return { - "pt": { - "posts": [ + "posts": { + "pt": [ { "title": "Scripts em OCaml", "slug": "scripts-em-ocaml", "date": "23/03/2024" } - ] - }, - "en": { - "posts": [ + ], + "en": [ { "title": "Meeting the BSD Family", "slug": "meeting-the-bsd-family", "date": "May 20, 2024" } ] - } + }, + "links": [ + { + "title": "Capital Offense How to Handle Abbreviations in CamelCase - Approxion", + "url": "https://www.approxion.com/capital-offenses-how-to-handle-abbreviations-in-camelcase/" + } + ] } } diff --git a/assets/js/links.js b/assets/js/links.js new file mode 100644 index 0000000..03562e3 --- /dev/null +++ b/assets/js/links.js @@ -0,0 +1,18 @@ +const data = get_data() + +function populate_links() { + data.links.forEach(link => { + const links = document.getElementById('links') + links.innerHTML = '' + const item = document.createElement('li') + const anchor = document.createElement('a') + anchor.innerText = link.title + anchor.href = link.url + item.appendChild(anchor) + links.appendChild(item) + }) +} + +document.addEventListener('DOMContentLoaded', () => { + populate_links() +}) diff --git a/assets/js/main.js b/assets/js/main.js index 88a404b..55c8680 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -4,7 +4,7 @@ const userLang = navigator.language || navigator.userLanguage let lang = userLang.includes('pt') ? 'pt' : 'en' function populate_posts() { - data[lang].posts.forEach(post => { + data.posts[lang].forEach(post => { const posts = document.getElementById('nav-posts') posts.innerHTML = '' const item = document.createElement('li') diff --git a/index.html b/index.html index c31784b..56487a5 100644 --- a/index.html +++ b/index.html @@ -35,6 +35,7 @@
  • Home
  • English
  • Português
    • +
  • RSS
  • Mastodon
    • diff --git a/pages/links.html b/pages/links.html new file mode 100644 index 0000000..28073c8 --- /dev/null +++ b/pages/links.html @@ -0,0 +1,18 @@ + + + + + + links • jutty.dev + + + + + + + +
    + +
    + +