Last active
November 20, 2022 06:10
-
-
Save dieseltravis/77c99bef0312486639d5aad46139eb22 to your computer and use it in GitHub Desktop.
replace "publish" buttons on some mastodon domains with "ππ¨"
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
https://userstyles.world/style/7330/default-slug | |
https://gist.github.com/dieseltravis/77c99bef0312486639d5aad46139eb22 | |
*/ | |
a.button[href='/publish'], | |
.compose-form__publish-button-wrapper button.button.button--block { | |
display: flex; | |
align-items: center; | |
justify-content: center; | |
width: 5rem; | |
font-size: 0; | |
} | |
a.button[href='/publish']::after, | |
.compose-form__publish-button-wrapper button::after { | |
content: 'ππ¨'; | |
font-size: 1.333rem; | |
} | |
/* add a lil tootin animation when hover/active/focus */ | |
a.button[href='/publish']:hover::after, | |
a.button[href='/publish']:active::after, | |
a.button[href='/publish']:focus::after, | |
.compose-form__publish-button-wrapper button:hover::after, | |
.compose-form__publish-button-wrapper button:active::after, | |
.compose-form__publish-button-wrapper button:focus::after { | |
animation: 444ms infinite alternate tootin ease-out; | |
} | |
@keyframes tootin { | |
to { | |
letter-spacing: 0.25rem; | |
/*font-stretch: 125%;*/ | |
transform: translateX(0.125rem); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment