diff --git a/scripts/aem.js b/scripts/aem.js index ec711b7..4e135ca 100644 --- a/scripts/aem.js +++ b/scripts/aem.js @@ -718,7 +718,7 @@ function decorateSpaceshipFocusPageH1() { if (spaceshipFocusPageH1Element) { const innerText = spaceshipFocusPageH1Element.textContent.trim(); const arr = innerText.split(' '); - const result = `${arr.join(' ')}`; + const result = `${arr.join(' ')}`; spaceshipFocusPageH1Element.innerHTML = result; } diff --git a/styles/baseModel.css b/styles/baseModel.css index 32b9016..947834a 100644 --- a/styles/baseModel.css +++ b/styles/baseModel.css @@ -6,10 +6,6 @@ body.ship-focus .default-content-wrapper { max-width: 100%; } -/* body.ship-focus .default-content-wrapper p:not(p ~ p) { - margin: 0 -130px; -} */ - /* stylelint-disable-next-line no-descending-specificity */ body.ship-focus .default-content-wrapper h1 + p { max-height: 100vh; @@ -24,28 +20,25 @@ body.ship-focus .default-content-wrapper .main-group img { object-fit: cover; } - body.ship-focus .default-content-wrapper .main-group > h1:first-child { position: absolute; - right: 0; + left: 30%; margin: 64px auto 0; - word-break: keep-all; - word-spacing: 9999px; text-align: left; font-size: 150px; color: var(--dark-blue); text-transform: uppercase; - transform: skew(40deg); line-height: 150px; - width: 60%; + width: 55%; text-shadow: 0 0 64px white; } -body.ship-focus .default-content-wrapper .main-group > h1:first-child .rotate { - position: relative; - white-space: pre-wrap; - transform: skew(-40deg); - display: inline-block; +body.ship-focus .default-content-wrapper .main-group > h1:first-child .indent:nth-child(2) { + padding-left: 10%; +} + +body.ship-focus .default-content-wrapper .main-group > h1:first-child .indent:nth-child(3) { + padding-left: 20%; } body.ship-focus .default-content-wrapper .sub-group p, diff --git a/styles/styles.css b/styles/styles.css index eaed4ca..1dd8118 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -227,23 +227,6 @@ main .section.highlight { line-height: 27px; } -/* -.default-content-wrapper .blocks { - display: flex; - flex-wrap: wrap; - margin-top: 80px; - gap: 107px; -} - -.default-content-wrapper .block:first-child { - flex-basis: 55%; -} - -.default-content-wrapper .block:nth-child(2), -.default-content-wrapper .block:nth-child(3) { - flex-basis: 30%; -} */ - .default-content-wrapper .blocks { display: flex; flex-wrap: wrap; @@ -302,46 +285,6 @@ main .section.highlight { width: 100%; } -/* -.default-content-wrapper .block:nth-child(odd) h3 { - order: 1; - margin-bottom: 0; - margin-top: 24px; - font-size: var(--paragraph-font-size); -} - -.default-content-wrapper .block:nth-child(odd) h3 + p { - order: 3; - margin-top: 0; - margin-left: 106px; -} - -.default-content-wrapper .block:nth-child(odd) p:last-child { - order: 2; - margin-top: 10px; - width: 40%; -} - -.default-content-wrapper .block:nth-child(even) h3 { - order: 2; - margin-bottom: 0; - margin-top: 24px; - font-size: var(--paragraph-font-size); -} - -.default-content-wrapper .block:nth-child(even) h3 + p { - order: 1; - margin-top: 0; - width: 30%; - margin-right: 106px; -} - -.default-content-wrapper .block:nth-child(even) p:last-child { - order: 3; - margin-top: 10px; - width: 60%; -} */ - .default-content-wrapper .info-container { position: absolute; top: 550px; @@ -401,8 +344,8 @@ body.accessory-focus .section { body.engine-focus .default-content-wrapper, body.interior-focus .default-content-wrapper, -body.accessory-focus .default-content-wrapper { - display: flex; +body.accessory-focus .default-content-wrapper { + display: flex; height: 100%; max-width: 100%; flex-direction: row-reverse;