pytorch · cjyabraham · Jul 4, 2024 · Jul 4, 2024 · Sep 12, 2024
diff --git a/_includes/cookie_banner.html b/_includes/cookie_banner.html
diff --git a/_includes/footer.html b/_includes/footer.html
@@ -87,5 +87,3 @@ <h2>Resources</h2>
 {% include mobile_menu.html %}
 
 {% include footer_scripts.html %}
-
-{% include cookie_banner.html %}
diff --git a/_includes/footer_scripts.html b/_includes/footer_scripts.html
@@ -4,7 +4,6 @@
 {% if page.layout != "deep_learning" %}
   <script src="{{ site.baseurl }}/assets/search-bar.js"></script>
 {% endif %}
-<script src="{{ site.baseurl }}/assets/cookie-banner.js"></script>
 
 <script type="text/javascript">
   mobileMenu.bind();

diff --git a/_includes/head.html b/_includes/head.html
@@ -1,4 +1,5 @@
 <head>
+  <script src="https://cmp.osano.com/16A0DbT9yDNIaQkvZ/3057c14f-50c3-4c05-ab8c-c35876dd6415/osano.js"></script>
   <!-- Google Tag Manager -->
   <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
   new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],

diff --git a/_sass/cookie-banner.scss b/_sass/cookie-banner.scss
@@ -1,53 +1,190 @@
-.cookie-banner-wrapper {
-  display: none;
-
-  &.is-visible {
-    display: block;
-    position: fixed;
-    bottom: 0;
-    background-color: $light_grey;
-    min-height: 100px;
-    width: 100%;
-    z-index: 401;
-    border-top: 3px solid #ededee;
-  }
-
-  .gdpr-notice {
-    color: $dark_grey;
-    margin-top: rem(25px);
-    text-align: left;
-    max-width: 1440px;
-    @include desktop {
-      width: 77%;
-    }
-    @include small-desktop {
-      width: inherit;
-    }
-
-    .cookie-policy-link {
-      color: #343434;
-    }
-  }
-
-  .close-button {
-    appearance: none;
-    background: transparent;
-    border: 1px solid $light_grey;
-    height: rem(21px);
-    position: absolute;
-    bottom: 42px;
-    right: 0;
-    top: 0;
-    cursor: pointer;
-    outline: none;
-    @include desktop {
-      right: 20%;
-      top: inherit;
-    }
-
-    @include small-desktop {
-      right: 0;
-      top: 0;
-    }
-  }
+.osano-cm-window__dialog {
+	border-radius: 8px;
+	filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.05));
+	font-weight: 700;
+	line-height: 1.5;
+	letter-spacing: 0.02em;
+	font-size: 16px;
+	padding-top: 35px;
+	padding-left: 25px;
+	padding-right: 25px;
+	padding-bottom: 25px;
+}
+
+.osano-cm-dialog--type_box {
+	max-width: 27.5em;
+	@media (min-width: 1400px) {
+		max-width: 480px;
+	}
+}
+
+.osano-cm-buttons {
+	gap: 8px;
+}
+
+.osano-cm-button {
+	border: none;
+	border-radius: 5px;
+	text-transform: uppercase;
+	font-size: 14px;
+	line-height: 1;
+	padding: 9px 17px;
+	min-height: 38px;
+	&:focus-visible {
+		outline: -webkit-focus-ring-color auto 1px;
+	}
+}
+
+.osano-cm-header {
+	font-weight: 700;
+	font-size: 20px;
+	letter-spacing: 0.02em;
+	padding-top: 1.5em;
+}
+
+.osano-cm-description {
+	font-weight: 400;
+	font-size: 11px;
+	line-height: 170%;
+	letter-spacing: 0.02em;
+	@media (min-width: 600px) {
+		font-size: 10px;
+	}
+}
+
+.osano-cm-dialog__list {
+	margin: 0.87em 0px 1.7em;
+}
+
+.osano-cm-label {
+	font-weight: 700;
+	font-size: 13px;
+	line-height: 150%;
+	letter-spacing: 0.02em;
+	@media (min-width: 600px) {
+		font-size: 16px;
+	}
+}
+
+div.osano-cm-disclosure__toggle {
+	font-weight: 700;
+	font-size: 10px;
+	line-height: 150%;
+	letter-spacing: 0.02em;
+	text-decoration: underline;
+	margin-top: 0;
+	&:hover {
+		text-decoration: none;
+	}
+}
+
+.osano-cm-list-item__disclosure {
+	padding-bottom: 2em;
+}
+
+.osano-cm-toggle {
+	margin-top: 1em;
+}
+
+.osano-cm-link {
+	text-decoration: none;
+	font-size: 19px;
+	font-weight: 800;
+	color: $orange;
+	&:focus-visible {
+		font-weight: 800;
+		outline-offset: 1px;
+		outline: -webkit-focus-ring-color auto 1px;
+		color: $orange;
+	}
+	&:hover {
+		color: $orange;
+		text-decoration: underline;
+	}
+}
+
+.osano-cm-powered-by__link {
+	display: none;
+}
+
+.osano-cm-content__message {
+	margin-bottom: 0.7em;
+	padding-bottom: .7em;
+	margin-top: 10px;
+	@media (min-width: 1400px) {
+		max-width: 90%;
+	}
+}
+
+.osano-cm-view__button {
+	font-size: 1em;
+}
+
+.osano-cm-dialog__close,
+.osano-cm-info-dialog-header__close {
+	background-color: #000000;
+	border-color: #000000;
+	stroke: #fff;
+	&:hover,
+	&:focus,
+	&:focus:hover {
+		background-color: #000000;
+		border-color: #000000;
+		stroke: #fff;
+		transform: rotate(90deg);
+	}
+}
+
+.osano-cm-close,
+.osano-cm-close:focus,
+.osano-cm-close:hover {
+	stroke-width: 3px;
+	border-width: 4px;
+}
+
+// FYI 14px is the smallest it can go for the maths of the circle to work.
+.osano-cm-close {
+	min-height: 14px;
+	min-width: 14px;
+	height: 14px;
+	width: 14px;
+	margin: 15px 18px;
+	@media (min-width: 600px) {
+		margin: 15px 25px;
+		margin: 25px;
+	}
+	svg {
+		height: 14px;
+		width: 14px;
+	}
+}
+
+.osano-cm-widget {
+	&__outline {
+		fill: #fff;
+		stroke: #000;
+	}
+	&__dot {
+		fill: $orange;
+	}
+}
+
+.osano-cm-accept-all {
+	&:before {
+		content: '';
+		display: inline-block;
+		vertical-align: middle;
+		height: 20px;
+		width: 20px;
+		margin-right: 8px;
+		background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23fff'/%3E%3Cpath d='m5.709 10.443 2.565 2.565 6.016-6.016' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
+	}
+}
+
+[dir='ltr'] .osano-cm-dialog__list .osano-cm-label {
+	margin-left: 0.8em;
+}
+
+.osano-cm-toggle__switch {
+	border-width: 3px;
 }
diff --git a/assets/cookie-banner.js b/assets/cookie-banner.js
Original file line number	Diff line number	Diff line change
Expand Up		@@ -87,5 +87,3 @@ <h2>Resources</h2>
		{% include mobile_menu.html %}

		{% include footer_scripts.html %}

		{% include cookie_banner.html %}