Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 20s
Build & Deploy / 🧪 QA (push) Failing after 34s
Build & Deploy / 🏗️ Build (push) Has started running
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Smoke Test (push) Has been cancelled
Build & Deploy / ⚡ Lighthouse (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
41 lines
1.2 KiB
Plaintext
41 lines
1.2 KiB
Plaintext
import { containerBaseClass } from '../ModalContainer/index.js';
|
|
import { itemBaseClass } from '../asModal/index.js';
|
|
export const generateCSS = ({ classPrefix, zIndex, }) => {
|
|
const prefixToUse = classPrefix ? `${classPrefix}__` : '';
|
|
return (`
|
|
.${prefixToUse}${containerBaseClass} {
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
position: fixed;
|
|
pointer-events: none;
|
|
visibility: hidden;
|
|
z-index: -1;
|
|
}
|
|
|
|
.${prefixToUse}${containerBaseClass}--appear,
|
|
.${prefixToUse}${containerBaseClass}--appearDone,
|
|
.${prefixToUse}${containerBaseClass}--enter,
|
|
.${prefixToUse}${containerBaseClass}--enterDone,
|
|
.${prefixToUse}${containerBaseClass}--exit {
|
|
pointer-events: all;
|
|
visibility: visible;
|
|
z-index: ${zIndex};
|
|
}
|
|
|
|
.${prefixToUse}${itemBaseClass} {
|
|
position: absolute;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.${prefixToUse}${itemBaseClass}--appear,
|
|
.${prefixToUse}${itemBaseClass}--appearDone,
|
|
.${prefixToUse}${itemBaseClass}--enter,
|
|
.${prefixToUse}${itemBaseClass}--enterDone,
|
|
.${prefixToUse}${itemBaseClass}--exit {
|
|
visibility: visible;
|
|
}
|
|
`);
|
|
};
|
|
//# sourceMappingURL=generateCSS.js.map |