Fix fieldset border in Firefox (but not supporting theme)

Cherry-picking this pull request: https://github.com/jdan/98.css/pull/117/files
main
Isaiah Odhner 2021-12-08 08:36:11 -05:00
parent 89def60105
commit 4332f6935d
4 changed files with 4 additions and 12 deletions

View File

@ -288,10 +288,7 @@ button:disabled,
*/
fieldset {
border: none;
/*rtl:ignore*/
box-shadow: inset -1px -1px var(--button-highlight), inset -2px 1px var(--button-shadow),
inset 1px -2px var(--button-shadow), inset 2px 2px var(--button-highlight);
border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' viewBox='0 0 5 5' fill='grey' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0H5V5H0V2H2V3H3V2H0' fill='white'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0H4V4H0V1H1V3H3V1H0' fill='%23808080'/%3E %3C/svg%3E") 2;
padding: calc(2 * var(--border-width) + var(--element-spacing));
padding-block-start: var(--element-spacing);
margin: 0;

File diff suppressed because one or more lines are too long

View File

@ -281,9 +281,7 @@ button:disabled,
*/
fieldset {
border: none;
box-shadow: inset -1px -1px var(--button-highlight), inset -2px 1px var(--button-shadow),
inset 1px -2px var(--button-shadow), inset 2px 2px var(--button-highlight);
border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' viewBox='0 0 5 5' fill='grey' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0H5V5H0V2H2V3H3V2H0' fill='white'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0H4V4H0V1H1V3H3V1H0' fill='%23808080'/%3E %3C/svg%3E") 2;
padding: calc(2 * var(--border-width) + var(--element-spacing));
padding-block-start: var(--element-spacing);
margin: 0;

View File

@ -287,10 +287,7 @@ button:disabled,
*/
fieldset {
border: none;
/*rtl:ignore*/
box-shadow: inset -1px -1px var(--button-highlight), inset -2px 1px var(--button-shadow),
inset 1px -2px var(--button-shadow), inset 2px 2px var(--button-highlight);
border-image: svg-load("./icon/groupbox-border.svg") 2;
padding: calc(2 * var(--border-width) + var(--element-spacing));
padding-block-start: var(--element-spacing);
margin: 0;