Compare commits

..

29 Commits

Author SHA1 Message Date
Trivernis e7c015e47b Merge pull request 'Remove w-screen from container' (#15) from punishedbernadetta-patch-1 into main
Reviewed-on: Trivernis/no-chromium#15
1 year ago
punishedbernadetta 7babf4f929 removed w-screen from container
It makes the page scroll vertically which is annoying. And w-screen isn't even needed to make the thing full screen.
1 year ago
trivernis 62132def6d
Fix the missing style of the redirect page 1 year ago
trivernis 9a7ffb2aca
Prerender static pages 1 year ago
trivernis 113d43bdaa
Fix main page prose max width 1 year ago
Trivernis 4418c4dfe0 Merge branch 'prod' into main 1 year ago
trivernis ea7ee26271
Add tailwind css classes 1 year ago
trivernis 295092f660
Move references to Articles 1 year ago
trivernis ddf5fd0ad5
Add short Web Environment Integrity explanation 1 year ago
Trivernis 60d1c27ac3 Merge pull request 'main' (#12) from main into prod
Reviewed-on: Trivernis/no-chromium#12
1 year ago
trivernis 11779ab348
Only one z-index can survive 1 year ago
Trivernis 05b0ec3c45 Merge pull request 'Give the popup window a z-index of 10' (#11) from CyanNex/no-chromium:main into main
Reviewed-on: Trivernis/no-chromium#11
1 year ago
Trivernis 0370269e52 Merge pull request 'Add z-index to popup' (#10) from main into prod
Reviewed-on: Trivernis/no-chromium#10
1 year ago
trivernis 01771ee3d3
Add z-index to popup 1 year ago
Nex 8739bc84cc
Give the popup window a z-index of 10 1 year ago
Trivernis 016e3a14c5 Merge pull request 'Add checking for user agent to popup script' (#9) from main into prod
Reviewed-on: Trivernis/no-chromium#9
1 year ago
trivernis c526911449
Add checking for user agent to popup script 1 year ago
Trivernis ee8e3f1062 Merge pull request 'main' (#8) from main into prod
Reviewed-on: Trivernis/no-chromium#8
1 year ago
trivernis c2e672ea29
Add custom server for CORS 1 year ago
trivernis 4a4d9b37e5
Restore original README 1 year ago
Trivernis c1c41b7c1f Merge pull request 'Allow CORS' (#7) from main into prod
Reviewed-on: Trivernis/no-chromium#7
1 year ago
trivernis 287a3d3e66
Allow CORS 1 year ago
Trivernis b472e7e7ce Merge pull request 'Fix popup script fetching from local domain' (#6) from main into prod
Reviewed-on: Trivernis/no-chromium#6
1 year ago
trivernis e6b7a9849f
Fix popup script fetching from local domain 1 year ago
Trivernis 7cb7042bc6 Merge pull request 'Add stop using chromium popup' (#5) from main into prod
Reviewed-on: Trivernis/no-chromium#5
1 year ago
trivernis 5d2ddea3c3
Add stop using chromium popup 1 year ago
Trivernis 13c42a8c55 Merge pull request 'Format main page' (#4) from main into prod
Reviewed-on: Trivernis/no-chromium#4
1 year ago
trivernis 15ce841dfa
Format main page
(kind of a dummy change)
1 year ago
Trivernis 293d66e1bc Merge pull request 'Add Svelte' (#3) from feature/svelte into main
Reviewed-on: Trivernis/no-chromium#3
1 year ago

@ -18,10 +18,11 @@ RUN npm run build
FROM base
COPY --from=builder /app/build .
COPY ./server.js .
RUN npm ci --omit dev
ENV HOST=0.0.0.0
EXPOSE 3000
CMD ["node", "."]
CMD ["node", "server.js"]

@ -1,38 +1,11 @@
# create-svelte
# No Chromium
Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
This is the source code for [no-chromium.org](https://no-chromium.org/).
## Creating a project
## Contributing
If you're seeing this, you've probably already done this step. Congrats!
Yes. Read [this](./CODE_OF_CONDUCT.md).
```bash
# create a new project in the current directory
npm create svelte@latest
## License
# create a new project in my-app
npm create svelte@latest my-app
```
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of your app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
CNPLv7+

769
package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -32,7 +32,11 @@
"type": "module",
"dependencies": {
"@sveltejs/adapter-node": "^1.3.1",
"@tailwindcss/typography": "^0.5.9",
"cors": "^2.8.5",
"detect-browser": "^5.3.0",
"express": "^4.18.2",
"fetch-opengraph": "^1.0.36",
"sass": "^1.64.1"
}
}

@ -0,0 +1,14 @@
import { handler } from "./handler.js";
import express from "express";
import cors from 'cors';
const app = express();
app.use("/popup/", cors());
// let SvelteKit handle everything else, including serving prerendered pages and static assets
app.use(handler);
app.listen(3000, () => {
console.log("listening on port 3000");
});

@ -1,42 +1,9 @@
html {
font-family: Noto Sans, sans-serif;
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
@tailwind base;
@tailwind components;
@tailwind utilities;
body {
font-family: Noto Sans, sans serif;
min-height: 1vh;
min-height: 100vh;
margin: 0;
}
p {
line-height: 1.5rem;
}
.banner {
margin: 10%;
font-size: 2em;
margin: 0 auto 4rem;
text-align: center;
}
.content {
margin: 0 10%;
padding: 0 1rem;
margin: 0 auto;
max-width: 800px;
}
.container {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
height: 100vh;
height: 100dvh;
}

@ -1,13 +1,13 @@
<script>
import Footer from "./footer.svelte";
import Article from "./article.svelte";
</script>
<header class="banner">
<h1>No Chromium</h1>
<h2>Do not use Chromium</h2>
<h3>Use a different web browser</h3>
<header class="container mx-auto mb-20 mt-40 text-center font-bold">
<h1 class="leading-normal text-7xl">No Chromium</h1>
<h3 class="leading-normal text-5xl">Use a different web browser</h3>
</header>
<main class="content">
<main class="w-10/12 md:w-2/3 xl:w-1/2 mx-auto prose max-w-none">
<h2>What is Chromium?</h2>
<p>
@ -34,13 +34,6 @@
a direction they benefit from the most.
</p>
<h2>Examples</h2>
<ul>
<li>Web Environment Integrity</li>
<li>Widevine</li>
<li style="color: red">TODO...</li>
</ul>
<h2>What can I do</h2>
<p>
You should use alternative browsers like
@ -53,4 +46,67 @@
LibreWolf
</a>.
</p>
<hr>
<h2>Examples</h2>
<section>
<h3>Web Environment Integrity</h3>
<p>
The Web Environment Integrity spec is a proposal by Google engineers
to add a mechanism to browsers that verifies them and the platform it's running on
to be trusted by third party (attester). This is often compared as being
<abbr title="Digital Rights Management">DRM</abbr> for Websites.
<br><br>
As an example Google Play is named as an attester for Android.
Of course this would enable Google to mark their own
Browser, Google Chrome, as trusted. Furthermore Google would be able to discourage the
use of Browsers that harm their business model (selling ads) like Firefox, a browser
that has a rich ecosystem of ad blockers and tracker protection.
<br><br>
On Windows Systems, Microsoft will likely play the role of the attester and
encourage the use of Edge. Which third would attest for a Browser to be trusted on
Linux distributions is not clear yet. There might be different attesters
being used in different distributions. More niche distros might have trouble
finding a third party to attest for their platform.
<br><br>
By implementing this spec Google is also forcing other browsers to do the same.
Browsers that don't implement the spec would simply not be trusted by websites
for demand the browser to proof it is trusted.
</p>
<details>
<summary>More Info</summary>
<ul>
<li>
<Article
url="https://vivaldi.com/blog/googles-new-dangerous-web-environment-integrity-spec/"
author="Julien Picalausa"
title = "Unpacking Googles new &quot;dangerous&quot; Web-Environment-Integrity specification"
/>
</li>
<li>
<Article
url="https://www.theregister.com/2023/07/25/google_web_environment_integrity/"
author="Thomas Claburn"
title="Google's next big idea for browser security looks like another freedom grab to some"
/>
</li>
<li>
<Article
url="https://github.com/RupertBenWiser/Web-Environment-Integrity/blob/main/explainer.md"
author= "Ben Wiser (Google), Borbala Benko (Google), Philipp Pfeiffenberger (Google), Sergey Kataev (Google)"
title="Web Environment Integrity Explainer"
/>
</li>
</ul>
</details>
</section>
<section>
<h3>FLOC</h3>
</section>
<section>
<h3>Widevine</h3>
</section>
</main>

@ -0,0 +1 @@
export const prerender = true;

@ -0,0 +1,13 @@
<script lang="ts">
export let url: string;
export let title: string;
export let author: string;
</script>
<a href="{ url }">
<span class="author">{ author }</span>
-
<i class="title">{ title }</i>
</a>

@ -1,20 +1,20 @@
<header class="banner">
<a href="/">Back</a>
<header class="w-10/12 md:w-2/3 xl:w-1/2 mx-auto mb-20 prose">
<div class="mb-10 mt-10"><a href="/">Back</a></div>
<h1>Credits</h1>
</header>
<main class="content">
<h2><a href="https://tech.lgbt/@sara">Sara</a></h2>
<ul>
<li>Icons</li>
</ul>
<main class="w-10/12 md:w-2/3 xl:w-1/2 mx-auto prose">
<h2><a href="https://tech.lgbt/@sara">Sara</a></h2>
<ul>
<li>Icons</li>
</ul>
<h2><a href="https://tech.lgbt/@punishedbernadetta">Punished Bernadetta</a></h2>
<ul>
<li>Style Improvements</li>
</ul>
<h2><a href="https://tech.lgbt/@punishedbernadetta">Punished Bernadetta</a></h2>
<ul>
<li>Style Improvements</li>
</ul>
<h2><a href="https://social.funkyfish.cool/@trivernis">Trivernis</a></h2>
<ul>
<li>Repository Owner</li>
</ul>
<h2><a href="https://social.funkyfish.cool/@trivernis">Trivernis</a></h2>
<ul>
<li>Repository Owner</li>
</ul>
</main>

@ -0,0 +1 @@
export const prerender = true;

@ -23,6 +23,14 @@
.right {
float: right;
}
a {
text-decoration: underline;
color: blue;
}
a:visited {
color: purple;
}
}
}
</style>

@ -0,0 +1,78 @@
<div id="no-chromium-head">
<style lang="scss">
#no-chromium-popup {
position: fixed;
display: flex;
height: 100vh;
width: 100vw;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.125);
font-family: Noto Sans, sans serif;
color: white;
z-index: 10;
.nc-popup-inner {
display: block;
position: relative;
margin: auto;
background-color: #FF6F00;
padding: 1em;
border-radius: 5px;
button {
border-style: none;
font-weight: bold;
background-colour: white;
font-size: 2em;
width: 100%;
cursor: pointer;
margin: 3px;
color: white;
a {
text-decoration: none;
color: white;
}
transition-duration: 0.1s;
&.nc-no {
background-color: #800;
&:hover {
background-color: #B00;
}
}
&.nc-ok {
background-color: #080;
&:hover {
background-color: #0B0;
}
}
&:hover {
}
}
}
}
</style>
</div>
<div id="no-chromium-body">
<div id="no-chromium-popup" style="display: none">
<div class="nc-popup-inner">
<center><h1>Stop using Chromium based Web Browsers</h1></center>
<a href="https://no-chromium.org/redirect"><button class="nc-no">No</button></a>
<button class="nc-ok" id="no-chromium-hide-button">Ok</button>
</div>
</div>
</div>

@ -1,9 +1,9 @@
<script>
<script lang="ts">
import { getBrowserName, isChromium } from "$lib/browser";
// import { browser } from "$app/environment";
import { onMount } from "svelte";
export let browserName;
export let browserName: string;
export let chromium = true;
onMount(() => {
@ -12,29 +12,23 @@
});
</script>
<style lang="scss">
.container {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
height: 100vh;
height: 100dvh;
}
</style>
<div class="container">
<div class="banner">
<div class="container flex mx-auto h-screen">
<div class="m-auto">
{#if browserName }
<center>
{#if chromium}
<h1>{browserName} is not supported by this Website</h1>
<h2>Use a different web browser</h2>
<h4><a href="/">Why?</a></h4>
<h1 class="leading-normal lg:leading-normal text-4xl lg:text-7xl">{ browserName } is not supported by this Website</h1>
<h2 class="leading-normal lg:leading-normal text-3xl lg:text-6xl">Use a different web browser</h2>
<h4 class="leading-normal lg:leading-normal text-2xl lg:text-4xl">
<a class="underline text-blue visited:text-purple-600" href="/">Why?</a>
</h4>
{:else }
<h1>Congrats, you're not using Chromium</h1>
<h2>So why are you here?</h2>
<h4><a href="/">More Info</a></h4>
<h1 class="leading-normal lg:leading-normal text-4xl lg:text-7xl">Congrats, you're not using Chromium</h1>
<h2 class="leading-normal lg:leading-normal text-3xl lg:text-6xl">So why are you here?</h2>
<h4 class="leading-normal lg:leading-normal text-2xl lg:text-4xl">
<a class="underline text-blue visited:text-purple-600" href="/">More Info</a>
</h4>
{/if }
</center>
{/if }

@ -0,0 +1,26 @@
async function showNoChromiumPopup() {
if (navigator.userAgent.includes("Chrome") && localStorage.getItem("no-chromium-popup-shown") != "1") {
const divPage = document.createElement("div");
const response = await fetch("https://no-chromium.org/popup/");
divPage.innerHTML = await response.text();
for (const child of divPage.querySelectorAll("#no-chromium-head > *")) {
document.head.appendChild(child);
}
for (const child of divPage.querySelectorAll("#no-chromium-body > *")) {
document.body.appendChild(child);
}
document.querySelector("#no-chromium-popup").style = "z-index: 9999;";
document.querySelector("#no-chromium-hide-button").addEventListener("click", hideNoChromiumPopup);
}
}
function hideNoChromiumPopup() {
document.querySelector("#no-chromium-popup").remove();
localStorage.setItem("no-chromium-popup-shown", "1");
}
showNoChromiumPopup();

@ -0,0 +1,6 @@
<!DOCTYPE html>
<html>
<body>
<script type="text/javascript" src="/popup.js"></script>
</body>
</html>

@ -1,9 +1,13 @@
const plugin = require("tailwindcss/plugin");
/** @type {import('tailwindcss').Config} */
export default {
content: ["./src/**/*.{htm,js,svelte,ts}"],
theme: {
extend: {},
},
plugins: [],
plugins: [
require('@tailwindcss/typography'),
],
}

Loading…
Cancel
Save