diff --git a/src/display.js b/src/display.js index 670c519..98cba1e 100644 --- a/src/display.js +++ b/src/display.js @@ -143,12 +143,10 @@ export class Display { const img = '/img/gretchen.jpg' const text = '

Text

More text text text

' fullview.innerHTML = ` -

${name}

${desc}

-
-
${text}
+
Text text
` wrapper.appendChild(fullview) target.appendChild(wrapper) diff --git a/style.css b/style.css index 6adf7d9..408ae6b 100644 --- a/style.css +++ b/style.css @@ -75,6 +75,15 @@ body { box-sizing: border-box; cursor: default; } +.fullview > img { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + min-width: 40em; + min-height: 30em; + max-height: 100%; +} .fullview > div { position: fixed; top: 50%; @@ -84,13 +93,11 @@ body { min-height: 30em; max-height: 100%; background-color: #006680; - padding: 1em; + padding: 1.5em; color: white; border-radius: 20px; border: 5px solid #1a1c1c; box-sizing: border-box; - display: flex; - flex-direction: column; } .fullview > div img { float: right; @@ -102,14 +109,14 @@ body { h1, .desc { font-family: "Fell Sc"; - margin-left: 0.5rem; } .fulltext { - flex-grow: 1; + clear: both; background-color: #99d7e9; - border-radius: 20px; + border-radius: 80px; border: 3px solid #1a1c1c; color: #1a1c1c; - padding: 0 0.5em; + margin-left: -10px; + padding: 0.5em; }