Skip to content

Instantly share code, notes, and snippets.

@famzah
Created November 22, 2025 08:13
Show Gist options
  • Select an option

  • Save famzah/c9f6d58256c6c5ddf8fdb88ac59cb963 to your computer and use it in GitHub Desktop.

Select an option

Save famzah/c9f6d58256c6c5ddf8fdb88ac59cb963 to your computer and use it in GitHub Desktop.
Fix LCP Performance Issues with Cookiebot
/* ======================================
Cookiebot: global tweaks
====================================== */
/* Hide “powered by” bits + logos wrapper + header */
a#CybotCookiebotDialogPoweredbyCybot,
div#CybotCookiebotDialogPoweredByText,
div#CybotCookiebotDialogHeaderLogosWrapper,
div#CybotCookiebotDialogHeader {
display: none !important;
}
/* Tighter buttons by default */
#CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton {
padding: 0.7rem 1.2rem !important;
}
/* ======================================
"Mobile / mid" (< 1280px):
- 1.2rem
- bottom-right
- 50% width
- 35% viewport height
====================================== */
@media screen and (max-width: 1279px) {
#CybotCookiebotDialog *,
#CybotCookiebotDialogBodyUnderlay * {
font-size: 1.2rem !important;
}
/* Bottom-right, 50% width, kill centering transform */
#CybotCookiebotDialog {
position: fixed !important;
right: 0 !important;
bottom: 0 !important;
left: auto !important;
top: auto !important;
width: 50% !important;
max-width: 50% !important;
min-width: 0 !important;
transform: none !important;
margin: 0 !important;
}
/* Smaller buttons */
#CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton {
padding: 0.5rem 0.8rem !important;
}
/* Limit overall banner height to 35% of viewport */
#CybotCookiebotDialog.CybotEdge {
max-height: 35vh !important;
}
/* Scroll the text area inside */
#CybotCookiebotDialogBodyContent {
max-height: 30vh !important;
overflow: auto !important;
}
}
/* ======================================
Large screens (≥ 1280px): desktop / full-width edge bar
====================================== */
@media screen and (min-width: 1280px) {
/* Larger text on big screens */
#CybotCookiebotDialog *,
#CybotCookiebotDialogBodyUnderlay * {
font-size: 1.4rem !important;
}
#CybotCookiebotDialog.CybotEdge {
width: 100vw !important;
max-width: 100vw !important;
min-width: 100vw !important;
padding: 1.2rem 1.6rem !important;
}
#CybotCookiebotDialog.CybotEdge .CybotCookiebotDialogContentWrapper {
max-width: 100% !important;
}
/* Keep buttons from stretching too much */
#CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtons {
max-width: 200px !important;
}
#CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogFooter
.CybotCookiebotDialogBodyButton {
width: 200px !important;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment