diff --git a/web/styles/components/cookieBot.ts b/web/styles/components/cookieBot.ts index 74b75c60b..7e5e86345 100644 --- a/web/styles/components/cookieBot.ts +++ b/web/styles/components/cookieBot.ts @@ -8,236 +8,20 @@ export const cookieBot = css` font-family: Equinor !important; } - #CybotCookiebotDialog { - padding-bottom: 0.5rem !important; - box-shadow: $black_normal 2px 2px 6px 2px !important; - border: 18px solid #fff !important; - border-radius: 4px !important; - } - - #CybotCookiebotDialogBody { - max-width: none !important; - } - - .bottom-dialog { - #CybotCookiebotDialog { - border: 0px solid #fff !important; - border-radius: 0px !important; - } - - #CybotCookiebotDialogBody { - //Responsive properties - margin-left: var(--space-4xLarge) !important; - margin-right: var(--space-4xLarge) !important; - } - .CybotCookiebotDialogBodyButton { - display: block; - } - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelectionWrapper { - padding-bottom: var(--space-xSmall) !important; - padding-top: 0px !important; - } - } - - .CybotCookiebotDialogBodyButton { - @media (min-width: 375px) and (max-width: 599px) { - display: block; - } - @media (min-width: 600px) { - display: inline; - } - } - - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelectionWrapper { - padding-bottom: var(--space-small) !important; - padding-top: var(--space-small); - } - - #CybotCookiebotDialogBodyContentTitle { - font-size: var(--typeScale-2) !important; - font-weight: 500 !important; - } - - #CybotCookiebotDialogBodyContentText { - font-size: var(--typeScale-1) !important; - line-height: var(--lineHeight-3) !important; - p { - padding: 0; - } - } - - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection, - #CybotCookiebotDialogBodyLevelButtonLevelOptinDeclineAll { - height: auto !important; - line-height: var(--lineHeight-3) !important; - border-radius: 4px !important; - padding: var(--space-xSmall) var(--space-small) !important; - background-color: white !important; - color: var(--black-100) !important; - border-color: var(--moss-green-95) !important; - width: auto !important; - transition: border-color 0.4s, color 0.4s, background-color 0.2s; - } - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection:hover, #CybotCookiebotDialogBodyLevelButtonLevelOptinDeclineAll:hover { background-color: var(--moss-green-60) !important; } - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll { - height: auto !important; - line-height: var(--lineHeight-3) !important; - border-radius: 4px !important; - padding: var(--space-xSmall) var(--space-small) !important; - border-color: var(--moss-green-95) !important; - background-color: var(--moss-green-95) !important; - color: white !important; - width: auto !important; - transition: border-color 0.4s, color 0.4s, background-color 0.2s; - } - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll:hover { background: var(--moss-green-100) !important; } - #CybotCookiebotDialogBodyButtonAccept { - font-size: var(--typeScale-1) !important; - height: auto !important; - line-height: var(--lineHeight-1) !important; - border-radius: 4px !important; - padding: var(--space-medium) var(--space-medium) !important; - border-color: var(--moss-green-95) !important; - background-color: var(--moss-green-95) !important; - color: white !important; - transition: border-color 0.4s, color 0.4s, background-color 0.2s; - } - #CybotCookiebotDialogBodyButtonAccept:hover { background: var(--moss-green-60) !important; } - #CybotCookiebotDialogBodyButtonDetails { - font-size: var(--typeScale-0) !important; - padding: var(--space-xSmall) var(--space-small) 0 0 !important; - color: var(--moss-green-95) !important; - } - - #CybotCookiebotDialogDetail { - #CybotCookiebotDialogDetailBody { - max-width: 1040px; - margin-top: 15px; - - #CybotCookiebotDialogDetailBodyContentTabs { - a { - font-size: var(--typeScale-1); - } - } - - #CybotCookiebotDialogDetailBodyContent { - height: 211px; - - a { - font-size: var(--typeScale-0); - } - - #CybotCookiebotDialogDetailBodyContentTextOverview { - #CybotCookiebotDialogDetailBodyContentCookieContainer { - #CybotCookiebotDialogDetailBodyContentCookieContainerTypes { - a { - padding: 10px 8px !important; - - label { - margin-right: 0.2rem; - background-position-y: 0 !important; - } - } - } - - #CybotCookiebotDialogDetailBodyContentCookieContainerTypeDetails { - font-size: 14px; - height: 187px; - max-height: 187px; - } - } - } - - #CybotCookiebotDialogDetailBodyContentTextAbout, - .CybotCookiebotDialogDetailBodyContentCookieTypeIntro { - p, - a { - font-size: var(--typeScale-1); - line-height: var(--lineHeight-2); - } - p { - padding-bottom: 10px; - } - } - } - } - } - - .CybotCookiebotDialogDetailBodyContentCookieTypeTable { - thead { - tr { - font-size: 16px !important; - } - th { - padding: 8px 2px !important; - } - } - } - - #CybotCookiebotDialogBodyLevelButtonsTable { - #CybotCookiebotDialogBodyLevelButtonsSelectPane { - padding: 0 var(--space-small) !important; - .CybotCookiebotDialogBodyLevelButtonWrapper { - padding: var(--space-small) 0; - } - } - #CybotCookiebotDialogBodyLevelDetailsWrapper { - padding: var(--space-small) !important; - text-align: center !important; - .CybotCookiebotDialogBodyLink { - font-size: var(--typeScale-0) !important; - } - } - } - // Checkbox customization - input[type='checkbox'].CybotCookiebotDialogBodyLevelButton:checked + label { - background-image: url('data:image/svg+xml;utf8,') !important; - } - - input[type='checkbox'].CybotCookiebotDialogBodyLevelButton.CybotCookiebotDialogBodyLevelButtonDisabled + label { - background-image: url('data:image/svg+xml;utf8,') !important; - } - - input[type='checkbox'].CybotCookiebotDialogBodyLevelButton + label { - background-image: url('data:image/svg+xml;utf8,') !important; - padding: 2px 0 0 20px !important; - } - - // Cookie declaration customization - .CookieDeclarationType { - border: none !important; - } - - #CookieDeclarationUserStatusLabelMulti, - #CookieDeclarationUserStatusLabelOn, - #CookieDeclarationUserStatusLabelOff, - #CookieDeclarationChangeConsent, - td.CookieDeclarationTableCell { - font-size: var(--typeScale-1); - line-height: var(--lineHeight-2); - margin-bottom: var(--space-xSmall); - } - - @media (min-width: $screen-xs) and (max-width: 599px) { - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelectionWrapper { - width: 100%; - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection, - #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll { - display: block; - } - } + #CybotCookiebotDialogHeader { + display: 'none' !important; } `