diff --git a/src/css/style.css b/src/css/style.css index 4e9e91b..49bc620 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -71,6 +71,10 @@ section { text-align: center; } +section h2,p { + text-align: left; +} + figure { display: inline-block; width: 10em; diff --git a/src/index.md b/src/index.md index 4b7b4a1..9b8c0a7 100644 --- a/src/index.md +++ b/src/index.md @@ -19,6 +19,6 @@ Antonio](https://utsa.edu). * [style guide](/style-guide.html) - _Formatting rules for this site_ - + If you're not remembered, then you never existed diff --git a/src/js/components.js b/src/js/components.js index 80b399e..908f169 100644 --- a/src/js/components.js +++ b/src/js/components.js @@ -1,23 +1,23 @@ class JsonData extends HTMLElement { - static observedAttributes = ["src", "show"]; + static observedAttributes = ["src", "show", "alt"]; constructor() { super(); } - static grid(json) { + static grid(json, alt) { let html = ""; for (const headerName in json) { html = html.concat(` + ${headerName} ${json[headerName].desc || ""} - `); let entries = json[headerName].items || []; for (let i = 0; i < entries.length; i++) { let entry = entries[i]; html = html.concat( ` - + ${entry.main} ${entry.sub} @@ -62,7 +62,7 @@ class JsonData extends HTMLElement { const json = await response.json(); switch(this.show) { case "grid": - this.innerHTML = JsonData.grid(json); + this.innerHTML = JsonData.grid(json, this.alt); break; case "list": this.innerHTML = JsonData.list(json); @@ -73,10 +73,16 @@ class JsonData extends HTMLElement { } async attributeChangedCallback(name, oldValue, newValue) { - if (name == "src") { - this.src = newValue; - } else if (name == "show") { - this.show = newValue; + switch (name) { + case "src": + this.src = newValue; + break; + case "show": + this.show = newValue; + break; + case "alt": + this.alt = newValue; + break; } } } diff --git a/src/music/index.md b/src/music/index.md index c161cc5..d565775 100644 --- a/src/music/index.md +++ b/src/music/index.md @@ -3,4 +3,4 @@ Music is a huge passion of mine. I prefer listening to albums in full from start to finish in order. My favorite albums are usually experimental, unique, or have a particular theme they explore - +
${json[headerName].desc || ""}