-
Notifications
You must be signed in to change notification settings - Fork 1
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
Add Site Footer #17
Conversation
Signed-off-by: Joe Fusco <[email protected]>
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Signed-off-by: Joe Fusco <[email protected]>
Check out the recent updates to your Atlas preview environment:
Learn more about preview environments in our documentation. |
Signed-off-by: Joe Fusco <[email protected]>
Check out the recent updates to your Atlas preview environment:
Learn more about preview environments in our documentation. |
.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"); | ||
} |
There was a problem hiding this comment.
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.
These changes introduce a simple site footer that is inspired by the footer used on wpgraphql.com
Screeenshots