Closed martinbianchi closed 2 years ago
This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.
🔍 Inspect: https://vercel.com/everydotorg/donate-button/CczE7dPgtYenMorRgM1V38s3VkJJ
✅ Preview: https://donate-button-git-button-specifity-everydotorg.vercel.app
closes #269
The problem was that when the host of the button doesn't provide a value for a prop and uses the default, we had a
specificity = 1
because we were applying the stlyes with a class.In https://www.diamondapproach.org/donate page, the CMS is applying a class to
.class <element>
which has a specificity = 2 and overrides our styles.Now we are assuring that those styles are applied inline on the element (
specifity = 1000
) so the styles shouldn't be overridden.It's very improbable that this issue occurs again, but a more reliable solution could be use the Shadow DOM to create the button and isolate the styles