diff --git a/src/collections/blog/2023/08-21-layer5-badge-program/blog.style.js b/src/collections/blog/2023/08-21-layer5-badge-program/blog.style.js index c10b2c767c10..b63e502b8d1b 100644 --- a/src/collections/blog/2023/08-21-layer5-badge-program/blog.style.js +++ b/src/collections/blog/2023/08-21-layer5-badge-program/blog.style.js @@ -48,5 +48,8 @@ export const Blog = styled.div` div.badge-grid > div { max-width: 95%; } + img.badge-modal{ + max-width: 95%; + } } `; diff --git a/src/collections/blog/2023/08-21-layer5-badge-program/index.mdx b/src/collections/blog/2023/08-21-layer5-badge-program/index.mdx index f783a2532dc6..994f9acd2903 100644 --- a/src/collections/blog/2023/08-21-layer5-badge-program/index.mdx +++ b/src/collections/blog/2023/08-21-layer5-badge-program/index.mdx @@ -74,7 +74,7 @@ Earning Layer5 Badges is both exciting and achievable. As you continue to contri

To share your badges on other social profiles, utilize the provided embedded code and direct share functionality. Access your badges from the Layer5 Cloud profile badges section, and then use it to post your achievements on social media platforms seamlessly. This enables you to showcase your Layer5 contributions and milestones to a wider audience.

-

Layer5 Badges

+

Layer5 Badges

Achievement Badges

diff --git a/src/components/Call-To-Actions/CTA_Bottom/index.js b/src/components/Call-To-Actions/CTA_Bottom/index.js index d4e250e19ace..cdee882dd2d9 100644 --- a/src/components/Call-To-Actions/CTA_Bottom/index.js +++ b/src/components/Call-To-Actions/CTA_Bottom/index.js @@ -44,6 +44,19 @@ const CTA_BottomWrapper = styled.div` button { width: fit-content; } + + @media(max-width: 600px){ + flex-direction: column-reverse; + height: auto; + + img{ + max-width: 95%; + } + + .cta-content{ + max-width: none; + } + } `; const defaultHeading = "Layer5 Community"; diff --git a/src/sections/app.style.js b/src/sections/app.style.js index 12cec3163611..d7d924e703d2 100644 --- a/src/sections/app.style.js +++ b/src/sections/app.style.js @@ -105,6 +105,7 @@ h3 { font-weight: 500; @media (max-width: 62rem) { font-size: 1.5rem; + text-align: center; } }