Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Site Footer #17

Merged
merged 3 commits into from
Oct 19, 2023
Merged

Add Site Footer #17

merged 3 commits into from
Oct 19, 2023

Conversation

josephfusco
Copy link
Member

These changes introduce a simple site footer that is inspired by the footer used on wpgraphql.com

Screeenshots

Screenshot 2023-10-19 at 10 04 32 AM Screenshot 2023-10-19 at 10 54 34 AM

Signed-off-by: Joe Fusco <[email protected]>
@vercel
Copy link

vercel bot commented Oct 19, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
acf-wpgraphql-com ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 19, 2023 3:00pm

Signed-off-by: Joe Fusco <[email protected]>
@headless-platform-by-wp-engine

Check out the recent updates to your Atlas preview environment:

App Environment URL Build
acf.wpgraphql.com preview-env-site-footer N/A ❌ (logs)

Learn more about preview environments in our documentation.

Signed-off-by: Joe Fusco <[email protected]>
@headless-platform-by-wp-engine

Check out the recent updates to your Atlas preview environment:

App Environment URL Build
acf.wpgraphql.com preview-env-site-footer https://h5…wered.com ✅ (logs)

Learn more about preview environments in our documentation.

Comment on lines +31 to +50
.socialIconLink[href*="github.com"]::after {
mask: url("/social-icons/github.svg");
}

.socialIconLink[href*="slack.com"]::after {
mask: url("/social-icons/slack.svg");
}

.socialIconLink[href*="twitter.com"]::after,
.socialIconLink[href*="x.com"]::after {
mask: url("/social-icons/twitter.svg");
}

.socialIconLink[href*="wordpress.org"]::after {
mask: url("/social-icons/wordpress.svg");
}

.socialIconLink[href*="youtube.com"]::after {
mask: url("/social-icons/youtube.svg");
}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using CSS attribute selectors and the ::after pseudo-element to dynamically set the mask for social media icons based on the URL in the href attribute.

@josephfusco josephfusco merged commit bb1b03f into main Oct 19, 2023
4 of 5 checks passed
@josephfusco josephfusco deleted the site-footer branch October 20, 2023 16:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant