|
|
|
|
@ -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>
|
gravel
8 months ago
