From ab71bff5ed102be66d80d659653869271fd58105 Mon Sep 17 00:00:00 2001
From: gravel <gravel@noreply.codeberg.org>
Date: Tue, 7 Nov 2023 09:23:09 +0000
Subject: [PATCH] Update WEI banner

---
 sites/+components/banner-wei.php   | 260 -----------------------------
 sites/+components/issue-banner.php |  21 +++
 sites/index.php                    |   2 +-
 3 files changed, 22 insertions(+), 261 deletions(-)
 delete mode 100644 sites/+components/banner-wei.php
 create mode 100644 sites/+components/issue-banner.php

diff --git a/sites/+components/banner-wei.php b/sites/+components/banner-wei.php
deleted file mode 100644
index 54c81c0..0000000
--- a/sites/+components/banner-wei.php
+++ /dev/null
@@ -1,260 +0,0 @@
-<?php
-	function quote(string $quote, string $author, string $href) {
-		ob_start();
-		?>
-		<a class="quote" target="_blank" href="<?=$href?>">
-			<q class="quote-text">
-				<?=$quote?>
-			</q>
-			<div class="quote-author">— <?=$author?></div>
-		</a>
-		<?php
-		return ob_get_clean();
-	}
-
-	class CarouselItems {
-		private function __construct() {}
-
-		private static int $carousel_id = 0;
-
-		/**
-		 * @param string[] $items
-		 */
-		static function fromItems(array $items): string {
-			$count = 0;
-			$carousel_id = CarouselItems::$carousel_id++;
-			return implode(PHP_EOL, array_map(function ($item) use (&$count, $items, $carousel_id) {
-				ob_start();
-				?>
-					<div id="carousel-<?=$carousel_id?>-item-<?=$count?>" class="carousel-item" style="left: <?=$count * 100?>%">
-						<div class="carousel-item-inner">
-							<?=$item?>
-							<div class="carousel-nav-container">
-								<a href="#carousel-<?=$carousel_id?>-item-<?=$count - 1?>" class="carousel-nav carousel-nav-previous" title="Previous"></a>
-								<div class="carousel-item-count">
-									<?=$count + 1?>/<?=count($items)?>
-								</div>
-								<a href="#carousel-<?=$carousel_id?>-item-<?=$count + 1?>" class="carousel-nav carousel-nav-next" title="Next"></a>
-							</div>
-						</div>
-					</div>
-				<?php
-				$count++;
-				return ob_get_clean();
-			}, $items));
-		}
-	}
-?>
-<style>
-.banner {
-	margin: 0 1rem 1rem;
-	border-left: var(--primary-color) 1rem solid;
-	padding: 1rem;
-	text-align: center;
-}
-
-.banner-title {
-	font-size: 2rem;
-}
-
-.banner-subtitle {
-	font-size: 1.5rem;
-}
-
-.banner-title, .banner-subtitle {
-	margin-block: 0.5em;
-}
-
-.banner-subtitle a {
-	text-underline-offset: 0.25rem;
-}
-
-.carousel-window {
-	overscroll-behavior: contain;
-}
-
-.horizontal-carousel.carousel-window {
-	width: 100%;
-	overflow-x: hidden;
-}
-
-.carousel-tape {
-	position: relative;
-}
-
-.horizontal-carousel .carousel-tape {
-	overflow-x: auto;
-	scroll-snap-type: x mandatory;
-  	scroll-behavior: smooth;
-  	-webkit-overflow-scrolling: touch;
-	height: 100%;
-	overflow-y: hidden;
-}
-
-.carousel-item {
-	position: absolute;
-	display: flex;
-	flex-direction: column;
-	justify-content: flex-end;
-	bottom: 0;
-	left: 0;
-	width: 100%;
-	/*
-		Hack. Makes carousel jump links jump to the top of the page instead of aligning to the carousel to top.
-	*/
-	height: 100vh;
-	scroll-snap-align: start;
-}
-
-.carousel-item-inner {
-	display: flex;
-	width: 100%;
-	flex-direction: column;
-	justify-content: space-between;
-	position: absolute;
-}
-
-.carousel-item-inner > * {
-	flex-grow: 1;
-}
-
-.quote {
-	display: flex;
-	flex-direction: column;
-	justify-content: space-around;
-	text-decoration: none;
-	color: inherit;
-	font-family: sans-serif;
-}
-
-q.quote-text::before, q.quote-text::after {
-	font-size: 1.25rem;
-	margin-inline: 0.25rem;
-	font-weight: bold;
-}
-
-.quote-text {
-	align-self: center;
-	font-size: 1.1rem;
-}
-
-.quote-text b {
-	color: red;
-}
-
-.quote-author {
-	align-self: flex-end;
-	font-size: 1.1rem;
-}
-
-.banner-link-listing {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	font-family: sans-serif;
-	flex-wrap: wrap;
-}
-
-.banner-link-listing a {
-	display: inline-block;
-	padding: 0.25rem 0.5rem;
-}
-
-.carousel-nav-container {
-	box-sizing: border-box;
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	justify-content: space-between;
-	width: 100%;
-	user-select: none;
-}
-
-.carousel-item-count {
-	text-align: center;
-	color: grey;
-	font-family: sans-serif;
-}
-
-.carousel-nav {
-	color: var(--primary-color);
-	text-decoration: none;
-	font-weight: bold;
-	opacity: 0.6;
-	transition: opacity 0.1s;
-	padding: 1rem;
-	flex-grow: 1;
-}
-
-.carousel-nav:hover {
-	opacity: 0.8;
-}
-
-.carousel-item .carousel-nav-previous::after {
-	content: "Prev";
-}
-
-.carousel-item .carousel-nav-next::after {
-	content: "Next";
-}
-
-.carousel-item:first-child .carousel-nav-previous::after {
-	visibility: hidden;
-}
-
-.carousel-item:last-child .carousel-nav-next::after {
-	visibility: hidden;
-}
-</style>
-<div class="banner">
-	<p class="banner-title">You know how your printer only accepts ink made by the same company?</p>
-
-	<p class="banner-subtitle">Well, someone at Google is <a target="_blank" href="https://www.eff.org/deeplinks/2023/08/your-computer-should-say-what-you-tell-it-say-1">planning to do <em>that</em>... to the Web</a>.</p>
-
-	<div class="carousel-window horizontal-carousel" style="height: calc(11rem - 4vw)">
-		<div class="carousel-tape">
-			<?php
-				ob_start();?>
-				<p class="banner-link-listing">
-					Take action now:
-					<a target="_blank" href="https://ftc.gov/enforcement/report-antitrust-violation">FTC</a>
-					<a target="_blank" href="https://competition-policy.ec.europa.eu/antitrust/contact_en">European Comission</a>
-					<a target="_blank" href="https://gov.uk/guidance/tell-the-cma-about-a-competition-or-market-problem">UK Government</a>
-					<a target="_blank" href="https://cci.gov.in/antitrust">India CCI Antitrust</a> <a target="_blank" href="https://cci.gov.in/filing/atd">India CCI Filing</a>
-					<a target="_blank" href="https://competitionbureau.gc.ca/eic/site/cb-bc.nsf/frm-eng/GHÉT-7TDNA5">Canadian Competion Bureau</a>
-					<a target="_blank" href="https://accc.gov.au/business/competition-and-exemptions/competition-and-anti-competitive-behaviour">ACCC</a>
-				</p>
-				<?php $take_action = ob_get_clean();
-				ob_start();?>
-				<p class="banner-link-listing">
-					Try these browsers instead of Chrome:
-					<a target="_blank" href="https://brave.com">Brave</a>
-					<a target="_blank" href="https://www.mozilla.org/en-US/firefox/new/">Mozilla Firefox</a>
-					<a target="_blank" href="https://www.torproject.org/download/">Tor Browser</a>
-					<a target="_blank" href="https://mullvad.net/en/browser">Mullvad Browser</a>
-					<a target="_blank" href="https://librewolf.net/">LibreWolf</a>
-				</p>
-				<?php $other_browsers = ob_get_clean();
-				echo CarouselItems::fromItems([
-					quote(
-						"Mozilla opposes this proposal because it <b>contradicts our principles</b> and vision for the Web.",
-						"Brian Grinstead (Mozilla)",
-						"https://github.com/mozilla/standards-positions/issues/852#issuecomment-1648820747"
-					),
-					quote(
-						"The idea of it is as simple as it is <b>dangerous</b>.",
-						"Julien Picalausa (Vivaldi)",
-						"https://vivaldi.com/blog/googles-new-dangerous-web-environment-integrity-spec/"
-					),
-					quote(
-						"We <b>won’t be shipping WEI support</b>, just as we disable [...] other junk that Google puts into Chromium.",
-						"Brendan Eich (Brave)",
-						"https://twitter.com/BrendanEich/status/1684561924191842304"
-					),
-					$take_action,
-					$other_browsers
-				])
-			?>
-		</div>
-	</div>
-</div>
diff --git a/sites/+components/issue-banner.php b/sites/+components/issue-banner.php
new file mode 100644
index 0000000..d060e70
--- /dev/null
+++ b/sites/+components/issue-banner.php
@@ -0,0 +1,21 @@
+<style>
+.banner {
+	margin: 0 1rem 1rem;
+	border-left: var(--primary-color) 1rem solid;
+	padding: 1rem;
+	text-align: center;
+}
+
+.banner-title {
+	font-size: 1.5rem;
+}
+
+.banner-subtitle {
+	font-size: 1.25rem;
+}
+</style>
+<div class="banner">
+	<p class="banner-title">We won! 🎉</p>
+
+	<p class="banner-subtitle"><a href="https://9to5google.com/2023/11/02/google-chrome-web-integrity-api/">Web Environment Integrity is dead*</a>!</p>
+</div>
diff --git a/sites/index.php b/sites/index.php
index 951255b..6499bd3 100644
--- a/sites/index.php
+++ b/sites/index.php
@@ -104,7 +104,7 @@
 			</header>
 			<h1 id="headline">Session Communities</h1>
 
-			<?php include "+components/banner-wei.php" ?>
+			<?php include "+components/issue-banner.php" ?>
 
 			<?php include "+components/communities-search.php" ?>