Fix the figure styles in Firefox (#17)

This commit is contained in:
Alessandro Jean 2023-09-05 02:54:06 -03:00 committed by GitHub
parent af01a3cdd1
commit 20f818dec1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -132,35 +132,40 @@ html:not(.dark) {
// Shitty method to give elevation to image - TO BE REPLACED // Shitty method to give elevation to image - TO BE REPLACED
main > div > div > figure:has(img) img { main figure {
box-shadow: 2px 2px 8px 4px var(--vp-c-bg-alt) margin: 2rem 0
}
figure {
&:has(img) {
position: relative
display: flex
flex-direction: column
width: auto
text-align: center
transition: transform var(--vp-tt) transition: transform var(--vp-tt)
img { img {
overflow: hidden
margin: 0 auto margin: 0 auto
border-radius: 8px border-radius: 12px
box-shadow: 2px 2px 8px 4px var(--vp-c-bg-alt)
} }
figcaption { figcaption {
display: inline-block text-align: center
margin: 6px auto margin-top: 1.25rem
font-size: 0.8rem font-size: 0.875rem
color: var(--vp-c-text-2)
} }
& > a .external-link-icon { & > a .external-link-icon {
display: none display: none
} }
} }
main :where(h1, h2, h3, h4, h5, h6) + figure {
margin-top: 1.5rem
}
.custom-block {
figure figcaption {
color: inherit
}
&.tip figure img {
--vp-c-bg-alt: var(--vp-custom-block-tip-bg)
}
} }
/** /**