fix brand color and image compression artifacts

This commit is contained in:
Daniel Helm 2022-01-12 09:48:09 -06:00
parent 27c033a831
commit 0c5e42d8c3
No known key found for this signature in database
GPG Key ID: 5C3D26DA012EFA1B
2 changed files with 14 additions and 8 deletions

View File

@ -2,7 +2,7 @@
<defs> <defs>
<style>.cls-1,.cls-2{fill:#0071bc;}.cls-1{fill-rule:evenodd;}.cls-2{font-size:87px;font-family:Karbon-Light, Karbon;font-weight:300;letter-spacing:-0.05em;}.cls-3{letter-spacing:-0.05em;}.cls-4{letter-spacing:-0.05em;}</style> <style>.cls-1,.cls-2{fill:#0071bc;}.cls-1{fill-rule:evenodd;}.cls-2{font-size:87px;font-family:Karbon-Light, Karbon;font-weight:300;letter-spacing:-0.05em;}.cls-3{letter-spacing:-0.05em;}.cls-4{letter-spacing:-0.05em;}</style>
</defs> </defs>
<path class="cls-1" d="M 116.388 139.371 C 92.969 148.816 66.759 134.5 62.048 109.691 L 46.308 98.821 C 43.843 141.32 88.308 170.55 126.346 151.435 C 130.805 149.195 134.94 146.361 138.638 143.011 L 138.698 143.011 C 141.248 140.637 140.685 136.456 137.598 134.841 L 19.888 72.671 Z" style="fill: rgb(88, 181, 96);"></path> <path class="cls-1" d="M 116.388 139.371 C 92.969 148.816 66.759 134.5 62.048 109.691 L 46.308 98.821 C 43.843 141.32 88.308 170.55 126.346 151.435 C 130.805 149.195 134.94 146.361 138.638 143.011 L 138.698 143.011 C 141.248 140.637 140.685 136.456 137.598 134.841 L 19.888 72.671 Z" style="fill: rgb(0, 198, 94);"></path>
<path class="cls-1" d="M 149.398 127.121 L 149.398 127.021 C 150.067 124.651 148.83 122.161 146.538 121.261 L 67.478 90.011 L 142.478 130.011 C 145.178 131.489 148.552 130.08 149.398 127.121 Z" style="fill: rgb(88, 181, 96);"></path> <path class="cls-1" d="M 149.398 127.121 L 149.398 127.021 C 150.067 124.651 148.83 122.161 146.538 121.261 L 67.478 90.011 L 142.478 130.011 C 145.178 131.489 148.552 130.08 149.398 127.121 Z" style="fill: rgb(0, 198, 94);"></path>
<path class="cls-1" d="M 151.848 109.801 C 152.508 94.561 150.578 79.801 141.228 67.721 C 130.128 53.411 111.498 47.801 96.588 49.081 C 95.428 49.181 94.268 49.351 93.108 49.451 C 77.448 50.901 62.598 59.941 53.728 75.301 C 52.968 76.621 52.278 77.971 51.638 79.301 C 51.238 79.841 50.838 80.371 50.458 80.931 L 63.838 88.061 C 64.463 86.395 65.194 84.772 66.028 83.201 C 80.584 55.935 119.197 54.651 135.532 80.889 C 140.199 88.386 142.264 97.212 141.408 106.001 L 91.518 92.621 L 145.258 113.861 C 148.274 115.053 151.585 112.994 151.848 109.761 Z" style="fill: rgb(88, 181, 96);"></path> <path class="cls-1" d="M 151.848 109.801 C 152.508 94.561 150.578 79.801 141.228 67.721 C 130.128 53.411 111.498 47.801 96.588 49.081 C 95.428 49.181 94.268 49.351 93.108 49.451 C 77.448 50.901 62.598 59.941 53.728 75.301 C 52.968 76.621 52.278 77.971 51.638 79.301 C 51.238 79.841 50.838 80.371 50.458 80.931 L 63.838 88.061 C 64.463 86.395 65.194 84.772 66.028 83.201 C 80.584 55.935 119.197 54.651 135.532 80.889 C 140.199 88.386 142.264 97.212 141.408 106.001 L 91.518 92.621 L 145.258 113.861 C 148.274 115.053 151.585 112.994 151.848 109.761 Z" style="fill: rgb(0, 198, 94);"></path>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -24,12 +24,12 @@ const NewsCard = ({ frontmatter, fields }) => {
</div> </div>
)} )}
<Link {...link} className="text-xl mt-6"> <Link {...link} className="mt-6 text-xl">
{title} {title}
</Link> </Link>
{description && ( {description && (
<Link {...link} className="font-content text-palette-400 mt-4"> <Link {...link} className="mt-4 font-content text-palette-400">
{description} {description}
</Link> </Link>
)} )}
@ -49,7 +49,7 @@ const NewsPage = ({ data }) => {
<Section className="bg-white" first={true}> <Section className="bg-white" first={true}>
{/* this is the gray box in the top left corner, 400px height is totally arbitrary but it works */} {/* this is the gray box in the top left corner, 400px height is totally arbitrary but it works */}
<div <div
className="hidden desktop:block bg-white bg-column absolute top-0 left-0 right-0" className="absolute top-0 left-0 right-0 hidden bg-white desktop:block bg-column"
style={{ height: "400px" }} style={{ height: "400px" }}
/> />
@ -81,12 +81,18 @@ export const query = graphql`
external external
thumbnail { thumbnail {
childImageSharp { childImageSharp {
gatsbyImageData(width: 320, height: 170, placeholder: BLURRED, transformOptions: { cropFocus: CENTER }) gatsbyImageData(
width: 320
height: 170
placeholder: BLURRED
formats: [AUTO, AVIF, WEBP]
transformOptions: { fit: COVER, cropFocus: CENTER }
)
} }
} }
avatar { avatar {
childImageSharp { childImageSharp {
gatsbyImageData(width: 40, placeholder: BLURRED, transformOptions: { cropFocus: CENTER }) gatsbyImageData(width: 40, placeholder: BLURRED, transformOptions: { fit: COVER, cropFocus: CENTER })
} }
} }
} }