diff options
Diffstat (limited to 'css')
-rw-r--r-- | css/footer.scss | 34 | ||||
-rw-r--r-- | css/page.scss | 25 |
2 files changed, 36 insertions, 23 deletions
diff --git a/css/footer.scss b/css/footer.scss index a8a389f..890bd82 100644 --- a/css/footer.scss +++ b/css/footer.scss @@ -7,27 +7,33 @@ margin-top: 1rem; padding: 1rem; - .separator { + #emailAddress { background-color: var(--textColour); - border-radius: 0.125rem; - height: 0.25rem; - margin: 1rem auto; - width: 100%; + display: inline-block; + height: 1em; + image-rendering: pixelated; + mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALcAAAAICAYAAAC78m4/AAAA/UlEQVRYw+1XQQ7EIAiExv9/2T01IQQJDNZ0rdyEFmEcBJmIqPfe6ciRzYRvYjMzS4Mk/Mim9RXbbY/YkGLM5BDdI4PZKAe5zuJi+fDWmTPK5F3hS2RPNPdLK/RHnk1ulLFJnbWWOsuGEhuNJetT27I5eP95WFskqJ5fJM4oX1Cso3FqXUNvrZHTWSNO5Zb+i5bpkGhmh/rMCGJwsEWJ6oEmq4mZefRftkpXEmq1T3Q0QPGMFNNul8kVBRYdD9CW94TMGHFW+ETx9OLw4nzTGVVw0cXa5INlxq2APEisNow8cN8EtMYzE2clP+9humIUqHKpwjOd+9Zz7ZFvyw87v+eHE6E5DAAAAABJRU5ErkJggg"); + mask-position: center; + mask-repeat: no-repeat; + mask-size: cover; + vertical-align: middle; + width: calc(183em / 8); } #footerHeading { font-size: 2em; font-weight: bold; - } - .obfuscatedText { - background-color: var(--textColour); - height: 1rem; - image-rendering: pixelated; - mask-position: center; - mask-repeat: no-repeat; - mask-size: contain; - width: 100%; + &::after { + background-color: var(--textColour); + border-radius: 0.25rem; + content: ""; + display: block; + height: 0.25rem; + margin-bottom: 1rem; + margin-top: 0.25rem; + width: 100%; + } } img { diff --git a/css/page.scss b/css/page.scss index 5017dcc..82ce4cc 100644 --- a/css/page.scss +++ b/css/page.scss @@ -4,7 +4,7 @@ padding: 1rem; padding-top: calc($headerHeight + 1rem); - p:not(.heading, #contentHeading, #cloneNotice p) { + p:not(.heading, #pageHeading, #footer p) { line-height: 2em; } @@ -34,11 +34,11 @@ } } - p.heading, #contentHeading { + p.heading, #pageHeading { font-family: "Martian Mono", "monospace"; } - #contentHeading { + #pageHeading { background-color: var(--foregroundColour); border-radius: 1rem; display: block; @@ -65,17 +65,17 @@ } p.heading { - font-size: 2em; - font-weight: bold; - margin-bottom: 1rem; - width: 100%; + font-size: 2em; + font-weight: bold; + width: 100%; &::after { background-color: var(--textColour); - border-radius: 0.125rem; + border-radius: 0.25rem; content: ""; display: block; height: 0.25rem; + margin-bottom: 1rem; margin-top: 0.25rem; width: 100%; } @@ -111,7 +111,14 @@ border-radius: 1rem; display: block; image-rendering: pixelated; - width: 100%; + + &.fullheight { + height: 12rem; + } + + &.fullwidth { + width: 100%; + } } } } |