Improve CSS for Custom Page handling

This commit is contained in:
HighImKevin committed 2026-09-25 05:00:10 -04:00
1 parent 82c23b2a8c
commit dd041f9acb
1 file changed
+42 -12
+42 -12
View File
@@ -1687,25 +1687,22 @@ window.KefinTweaksConfig = ${JSON.stringify(config, null, 2)};`;
function injectCustomPageStyles(config) { function injectCustomPageStyles(config) {
if (!shouldInjectCustomPageStyles(config)) return; if (!shouldInjectCustomPageStyles(config)) return;
if (document.getElementById('kefin-custom-page-styles')) return;
const style = document.createElement('style'); const css = `
style.id = 'kefin-custom-page-styles'; #reactRoot.kefin-custom-page-active .skinBody #fallbackPage {
style.textContent = `
#reactRoot .skinBody:has(.customPage:not(.hide)) #fallbackPage {
display: none; display: none;
} }
#reactRoot:not(:has(.skinBody .customPage:not(.hide))) .pageTitle { #reactRoot:not(.kefin-custom-page-active) .pageTitle {
display: none !important; display: none !important;
} }
#reactRoot .skinBody:not(:has(.customPage:not(.hide))) #fallbackPage > * { #reactRoot:not(.kefin-custom-page-active) .skinBody #fallbackPage > * {
display: none; display: none;
} }
#reactRoot:not(:has(.skinBody .customPage:not(.hide))) #fallbackPage::after { #reactRoot:not(.kefin-custom-page-active) #fallbackPage::after {
content:''; content: '';
display: inline-block; display: inline-block;
width: 20px; width: 20px;
height: 20px; height: 20px;
@@ -1718,8 +1715,41 @@ window.KefinTweaksConfig = ${JSON.stringify(config, null, 2)};`;
transform: translateX(-50%); transform: translateX(-50%);
top: 1em; top: 1em;
} }
#reactRoot.kefin-custom-page-active .backdropImage {
background: none !important;
}
header.MuiPaper-root + main.MuiBox-root .customPage {
margin-top: 3rem;
}
.layout-mobile .kefin-custom-page-active .MuiToolbar-root > .MuiStack-root > :nth-child(n+2),
.layout-mobile .kefin-custom-page-active .MuiToolbar-root > .MuiStack-root > :first-child .MuiButton-icon img {
display: none;
}
.layout-mobile .kefin-custom-page-active .MuiToolbar-root > .MuiStack-root > :first-child .MuiButton-icon::after {
content: '\\e88a';
font-family: 'Material Icons';
font-size: 1.2rem;
}
.layout-mobile .kefin-custom-page-active .MuiToolbar-root > .MuiStack-root > :first-child {
font-size: 0px;
}
main.MuiBox-root .customPage.libraryPage:not(.noSecondaryNavPage)[data-kefin-custom-page] {
padding-top: 1rem !important;
}
.layout-mobile :not(main.MuiBox-root) .customPage.libraryPage:not(.noSecondaryNavPage)[data-kefin-custom-page] {
padding-top: 5rem !important;
}
`; `;
(document.head || document.documentElement).appendChild(style); let style = document.getElementById('kefin-custom-page-styles');
if (!style) {
style = document.createElement('style');
style.id = 'kefin-custom-page-styles';
(document.head || document.documentElement).appendChild(style);
}
style.textContent = css;
} }
// Initialize the installer (no login/admin gate — admin is checked when rendering the card) // Initialize the installer (no login/admin gate — admin is checked when rendering the card)