fix: incorrect selector for hiding tabpanel in init

This commit is contained in:
alistair3149 2024-05-25 03:07:49 -04:00
parent 8d410dfb49
commit 0a3b30504d
No known key found for this signature in database
2 changed files with 10 additions and 55 deletions

View file

@ -29,20 +29,20 @@
content: ''; content: '';
} }
} }
/**
* Hide all other panels
* All panels are stacked vertically initially
* then panels are stacked horizontally after Tabber is loaded
* Causing lots of layout shift
*/
.tabber__panel:not( :first-child ) {
display: none;
}
} }
/* Hide no script message */ /* Hide no script message */
.tabber__noscript { .tabber__noscript {
display: none; display: none;
} }
/**
* Hide all other panels
* All panels are stacked vertically initially
* then panels are stacked horizontally after Tabber is loaded
* Causing lots of layout shift
*/
.tabber__panel:not( :first-child ) {
display: none;
}
} }

View file

@ -1,45 +0,0 @@
/**
* Critial rendering styles
*
* Since ext.tabberNeue is loaded a while after page load,
* inline styles are needed to create an inital state and
* avoid potential layout shifts. This should be kept as
* small as possible.
*
* Used in Tabber.php and TabberTransclude.php
*/
/* stylelint-disable selector-class-pattern */
/* Skeleton UI */
.client-js .tabber__header {
height: 2.6em;
box-shadow: inset 0 -1px 0 0;
opacity: 0.1;
}
.client-js .tabber__header::after {
position: absolute;
width: 16ch;
height: 0.5em;
border-radius: 40px;
margin-top: 1em;
margin-left: 0.75em;
background: #000;
/* Use double quote in PHP */
content: '';
}
.client-js .tabber__noscript {
display: none;
}
/*
* Hide all other panels
* All panels are stacked vertically initially
* then panels are stacked horizontally after Tabber is loaded
* Causing lots of layout shift
*/
.client-js .tabber__panel:not( :first-child ) {
display: none;
}