fix(WEB-233): make cookiebot more resilient

2024-06-24 14:06:15 +02:00
parent 3b54aea6d7
commit 6b39f2d990
5 changed files with 125 additions and 122 deletions
--- a/public/_static/css/cookie-bot.css
+++ b/public/_static/css/cookie-bot.css
@@ -0,0 +1,213 @@
+body #CybotCookiebotDialog * {
+  font-family: Helvetica, Arial, sans-serif !important
+}
+
+body #CybotCookiebotDialog,
+body #CybotCookiebotDialog * {
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box
+}
+
+body #CybotCookiebotDialog {
+  border-radius: 0;
+  border: 0;
+  -webkit-box-shadow: 0 0 transparent;
+  box-shadow: 0 0 transparent;
+  top: 50%;
+  left: 50%;
+  -webkit-transform: translate(-50%, -50%) !important;
+  transform: translate(-50%, -50%) !important;
+  margin: 0 !important;
+  padding: 15px;
+  max-height: 90%;
+  -webkit-transform-origin: unset !important;
+  transform-origin: unset !important;
+  overflow-y: auto
+}
+
+body #CybotCookiebotDialog div,
+body #CybotCookiebotDialog h2 {
+  color: #333
+}
+
+body #CybotCookiebotDialogBodyContent {
+  padding: 0 !important
+}
+
+body #CybotCookiebotDialogBodyContentTitle {
+  font-size: 1.375rem;
+  font-family: BrandonText-Black, Arial, Helvetica, sans-serif !important
+}
+
+body div#CybotCookiebotDialogBodyContentText {
+  font-size: 1rem;
+  line-height: 1.4rem;
+  margin: 15px 0
+}
+
+body #CybotCookiebotDialogDetailBody {
+  max-width: 100%;
+  padding: 0
+}
+
+body #CybotCookiebotDialogDetailBodyContent {
+  height: 160px
+}
+
+body #CybotCookiebotDialogDetailBodyContentTextOverview {
+  max-width: 100%
+}
+
+body #CybotCookiebotDialogDetailBodyContentCookieContainerTypeDetails {
+  height: 155px;
+  max-height: 155px
+}
+
+body #CybotCookiebotDialogBodyLevelButtonsSelectPane {
+  border: none;
+  padding: 0 0 30px
+}
+
+body .CybotCookiebotDialogBodyLevelButtonWrapper {
+  margin: 20px 0 0 !important;
+  padding-right: 25px
+}
+
+body .CybotCookiebotDialogBodyLevelButtonWrapper label {
+  font-size: 13px !important;
+  padding-left: 20px !important;
+  background: url(/_static/img/icons/shared/checkbox_unselected.svg) no-repeat left 0 !important
+}
+
+body input[type=checkbox].CybotCookiebotDialogBodyLevelButton:checked+label {
+  background: url(/_static/img/icons/shared/checkbox_selected.svg) no-repeat left 0 !important
+}
+
+body input[type=checkbox].CybotCookiebotDialogBodyLevelButton.CybotCookiebotDialogBodyLevelButtonDisabled+label {
+  background: url(/_static/img/icons/shared/checkbox_disabled.svg) no-repeat left 0 !important
+}
+
+body #CybotCookiebotDialogBodyLevelWrapper {
+  display: -ms-flexbox !important;
+  display: flex !important;
+  -ms-flex-direction: column-reverse;
+  flex-direction: column-reverse;
+  text-align: left;
+  padding: 0 0 5px
+}
+
+body #CybotCookiebotDialogBodyLevelWrapper>div {
+  padding: 0
+}
+
+body #CybotCookiebotDialogBodyLevelButtons {
+  margin: 0 0 20px !important
+}
+
+body #CybotCookiebotDialogBodyLevelButtonsTable {
+  width: auto !important;
+  margin: 0 !important
+}
+
+body #CybotCookiebotDialogBodyLevelDetailsWrapper {
+  background: none;
+  border: 0;
+  width: auto;
+  display: inline-block;
+  padding: 0 20px 0 0;
+  height: auto
+}
+
+body a#CybotCookiebotDialogBodyLevelDetailsButton {
+  background: none !important;
+  outline: 0 none;
+  padding: 0 10px 0 0;
+  color: #00838e;
+  font-size: 1rem;
+  line-height: 1.4rem;
+  height: auto
+}
+
+body a#CybotCookiebotDialogBodyLevelDetailsButton:focus,
+body a#CybotCookiebotDialogBodyLevelDetailsButton:hover {
+  text-decoration: none;
+  color: #00838e
+}
+
+body #CybotCookiebotDialogBodyLevelDetailsWrapper:after {
+  margin-top: -7px;
+  background-position: 50%;
+  height: 14px
+}
+
+body #CybotCookiebotDialogBodyLevelDetailsWrapper.active:after {
+  -webkit-transform: rotate(180deg);
+  transform: rotate(180deg)
+}
+
+body a.CybotCookiebotDialogBodyButton {
+  width: auto !important;
+  padding: 5px 15px !important;
+  border-radius: 25px;
+  height: auto !important;
+  font-weight: 400 !important;
+  font-size: 1rem !important;
+  margin: 0 !important;
+  border: 0 !important;
+  line-height: 1.375rem !important
+}
+
+body #CybotCookiebotDialogBodyUnderlay {
+  position: fixed;
+  bottom: 0;
+  top: 0;
+  left: 0;
+  right: 0;
+  opacity: .4 !important
+}
+
+@media(max-width: 739px) {
+  body #CybotCookiebotDialog {
+    width: 90% !important
+  }
+
+  body a.CybotCookiebotDialogBodyButton {
+    width: 100% !important
+  }
+}
+
+@media(min-width: 740px) {
+  body #CybotCookiebotDialogBody {
+    padding: 15px;
+    min-width: 560px
+  }
+
+  body #CybotCookiebotDialogBodyContentTitle {
+    font-size: 1.625rem
+  }
+
+  body #CybotCookiebotDialogBodyLevelDetailsButton {
+    font-size: 1rem
+  }
+
+  body #CybotCookiebotDialogBodyLevelWrapper {
+    -ms-flex-direction: row-reverse;
+    flex-direction: row-reverse;
+    -ms-flex-pack: justify;
+    justify-content: space-between;
+    -ms-flex-align: center;
+    align-items: center;
+    padding: 0
+  }
+
+  body #CybotCookiebotDialogBodyLevelButtons {
+    margin: 0 !important
+  }
+}
+
+@media(min-width: 940px) {
+  body #CybotCookiebotDialog {
+    max-width: 810px;
+    width: 810px !important
+  }
+}