diff --git a/scripts/zines.js b/scripts/zines.js index 209a94d..a4909cb 100644 --- a/scripts/zines.js +++ b/scripts/zines.js @@ -14,19 +14,17 @@ function makeZine({ name, blurb, format, site, title }) { let p = document.createElement("p"); if (title) { - p.innerHTML = " made a " + format + " zine called " + title + ""; + p.innerHTML = " made a " + format + " zine called

" + title + "

"; } else { p.innerHTML = " is making a " + format + " zine:"; let bq = document.createElement("blockquote"); - let bqP = document.createElement("p"); - bqP.innerHTML = blurb; - bq.append(bqP); - zine.append(bq); + let bqP = document.createElement("p"); + bqP.innerHTML = blurb; + bq.append(bqP); + zine.append(bq); } zine.append(p); - - return zine; } diff --git a/styles/zines.css b/styles/zines.css index 0f4d15f..40a7932 100644 --- a/styles/zines.css +++ b/styles/zines.css @@ -12,6 +12,7 @@ } #zine-container h2, +#zine-container h3 #zine-container p { border: none; display: inline; @@ -22,6 +23,14 @@ line-height: 135%; } +#zine-container h3 { + background-color: light-dark(var(--color-warn-light), var(--color-warn-dark)); + color: light-dark(var(--color-text-light), var(--color-text-dark)); + border-radius: 3px; + padding: 0 .2rem; + float: right; +} + blockquote { margin: 0; color: light-dark(var(--color-header-light), var(--color-header-dark));