Commit b6a0485e authored by Mike Herchel's avatar Mike Herchel Committed by Sven Berg Ryen
Browse files

Issue #3303612 by mherchel, svenryen: Make an Olivero style close button for the banner

parent be410ab9

css/eu_cookie_compliance_olivero.css

+45 −0
Original line number Diff line number Diff line
@@ -60,6 +60,7 @@ div#sliding-popup .eu-cookie-withdraw-banner, 
}



.eu-cookie-compliance-content {

  position: relative; /* Anchor possible "close" button. */

  max-height: calc(100vh - 54px);

  max-height: calc(100vh - 2 * var(--sp1-5, 27px) - var(--drupal-displace-offset-top, 0px));

  overflow: auto;
@@ -213,3 +214,47 @@ div#sliding-popup .eu-cookie-withdraw-banner, 
  appearance: none;

  cursor: pointer;

}



/* Close button. This can be seen if you enable the option for "Opt-in with categories",

 * and then check the box for "Close button/box enabled" button". */

.eu-cookie-compliance-close-button {

  position: absolute;

  top: 0;

  right: 0; /* LTR */

  display: block;

  width: 50px;

  height: 50px;

  text-indent: -9999px;

  color: var(--color--blue-10, #0f6292);

  overflow: hidden;

  appearance: none;

  border: 0;

  background: transparent;

  cursor: pointer;

}



.eu-cookie-compliance-close-button:focus {

  outline: solid 2px currentColor;

  outline-offset: -4px;

}



[dir="rtl"] .eu-cookie-compliance-close-button {

  left: 0;

  right: auto;

}



.eu-cookie-compliance-close-button:before,

.eu-cookie-compliance-close-button:after {

  position: absolute;

  top: calc(50% + 1px);

  left: 20%;

  width: 60%;

  height: 0;

  content: "";

  border-top: solid 2px currentColor;

  transform: rotate(45deg);

}



.eu-cookie-compliance-close-button:after {

  transform: rotate(-45deg);

}

eu_cookie_compliance.module

+1 −1
Original line number Diff line number Diff line
@@ -424,7 +424,7 @@ function eu_cookie_compliance_build_data() { 
      $secondary_button_label = $config->get('withdraw_action_button_label');

      $secondary_button_class = 'eu-cookie-withdraw-button visually-hidden' . $conditional_olivero_button_secondary_classes;

      $tertiary_button_label = $config->get('reject_button_label');

      $tertiary_button_class = 'eu-cookie-compliance-default-button eu-cookie-compliance-reject-button';

      $tertiary_button_class = 'eu-cookie-compliance-default-button eu-cookie-compliance-reject-button' . $conditional_olivero_button_secondary_classes;

      $close_button_enabled = ($config->get('close_button_enabled')) ?: FALSE;

      $privacy_settings_tab_label = ($withdraw_button_on_info_popup || $settings_tab_enabled) ? $config->get('withdraw_tab_button_label') : FALSE;

      break;