Compare commits

..

No commits in common. "develop" and "3a7096f92f4ef751ebc3d75f6cb2f2c281053600" have entirely different histories.

113 changed files with 6009 additions and 19089 deletions

2
.gitignore vendored
View File

@ -3,5 +3,3 @@ node_modules
sidebar.js sidebar.js
/web-ext-artifacts/ /web-ext-artifacts/
lib/* lib/*
/yarn-error.log
/rentgen.zip

View File

@ -1,5 +1,5 @@
trailingComma: "es5" trailingComma: "es5"
tabWidth: 4 tabWidth: 4
printWidth: 100 printWidth: 80
semi: true semi: true
singleQuote: true singleQuote: true

9
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,9 @@
{
"cSpell.words": [
"ECLI",
"EROD",
"targetowania",
"targetowaniem",
"TSUE"
]
}

119
README.md
View File

@ -1,114 +1,21 @@
<h1 style="display: flex; align-items: center;"><img src="./assets/icon-addon-2048.png" alt="Rentgen logo" style="margin-right: 1rem;" width="48"/> Rentgen</h1> # EN
<strong>Rentgen</strong> is an add-on prepared for Firefox-based browsers. This extension will automatically visualize all the data that a given website ~~steals~~ sends to third parties. A simple Firefox extension that visualizes all the data that a given
website sends to third parties.
Note: At the moment, we support Polish language because this extension generates mail content that is dedicated to Polish website owners. In further versions of this add-on, we will add other languages as well. It aims to help website administrators audit their website for stray
scripts while for exapmle evaluating a given CMP solution, as well as
help users report data-backed complaints and requests regarding
websites that are too data-hungry.
**Features:** ![screenshot](./screenshot.png)
- analysis of web traffic generated by the visited website; # PL
- visualization of data transmitted to third parties by the visited site (user's browsing history and cookies);
- preparation of screenshots of development tools as evidence of data transmitted to third parties;
- assisting in the evaluation of potential work areas for compliance with GDPR;
- generating a report or email content that can be sent to an administrator and Personal Data Protection Office in Poland.
## Installation ## Problematic-requests, aka ICD scanner
Firefox: https://addons.mozilla.org/en-US/firefox/addon/rentgen/ Wtyczka pokazująca, jakie dane zostały ~~wykradzione~~ wysłane do podmiotów trzecich przez odwiedzane strony.
## How to build and run Rentgen on your own ### TODO:
### Pre-requirements
- OS: Linux x86_64
- Node.js: 16.x version
- npm: 7.x version or higher
### Build steps
1. Pull repository or download a zip package
2. Go to the root directory of the pulled repository
3. Run command: `npm install`
4. Run command: `npm run build`
5. Run command: `npm run create-package`
6. Go to the `web-ext-artifacts` directory
7. You will find a zip archive: `rentgen-x-x-x.zip` (`x-x-x` means add-on version)
### Run steps
1. Run Firefox and go to `about:debugging`
2. Click _This Firefox_ tab
3. Click _Load Temporary Add-on..._ button
4. Pick the zip archive from last step of build process.
## Issue tracker
If you find a problem, please send us an email: kontakt@internet-czas-dzialac.pl
We don't receive issues on Microsoft Github.
Each issue will be reviewed and moved to an internal issues list of our Gitea instance: https://git.internet-czas-dzialac.pl/icd/rentgen/issues. We use Gitea and most likely in the future with the federalization of Gitea, we will be able to let users in to report issues directly from the Gitea site.
## Screenshots
<img src="./assets/screenshots/image-14.png" />
<img src="./assets/screenshots/image-15.png" />
<img src="./assets/screenshots/3a.png" />
<img src="./assets/screenshots/3b.png" />
<img src="./assets/screenshots/4a.png" />
<img src="./assets/screenshots/4b.png" />
<img src="./assets/screenshots/5a.png" />
<img src="./assets/screenshots/5b.png" />
<img src="./assets/screenshots/2022-07-14_21-04.png" />
---
<strong>Rentgen</strong> to wtyczka dla przeglądarek opartych o Firefoxa, która automatycznie wizualizuje, jakie dane zostały ~~wykradzione~~ wysłane do podmiotów trzecich przez odwiedzane strony. Wtyczka obrazuje ilość skryptów śledzących na stronie internetowej i pomaga w sformułowaniu maila do administratora strony, który może być podstawą do skargi RODO w Urzędzie Ochrony Danych Osobowych.
**Funkcje Rentgena:**
- analiza ruchu sieciowego generowanego przez stronę internetową;
- wizualizacja danych przekazanych do podmiotów trzecich przez odwiedzaną stronę (historia przeglądania użytkownika oraz jego ciasteczka);
- przygotowywanie zrzutów ekranów narzędzi deweloperskich będących dowodem przekazanych danych do podmiotów trzecich;
- pomoc w oszacowaniu potencjalnych obszarów roboczych względem zgodności z RODO;
- generowanie raportu lub treści maila, którą można wysłać do administratora oraz Urzędu Ochrony Danych Osobowych.
## Instalacja
Firefox: https://addons.mozilla.org/pl/firefox/addon/rentgen/
## Jak zbudować i uruchomić Rentgena ze źródeł
### Wymagania wstępne
- System operacyjny: Linux x86_64
- Node.js: 16.x
- npm: 7.x lub wyższy
### Proces budowy
1. Pobierz repozytorium przez `git pull https://git.internet-czas-dzialac.pl/icd/rentgen.git` lub pobierz archwium zip
2. Przejdź do głównego katalogu pobranego repozytorium
3. Uruchom komendę: `npm install`
4. Uruchom komendę: `npm run build`
5. Uruchom komendę: `npm run create-package`
6. Przejdź do katalogu `web-ext-artifacts`
7. Znajdziesz tam archiwum zip: `rentgen-x-x-x.zip` (`x-x-x` oznaczają wersję wtyczki)
### Kroki do uruchomienia
1. Uruchom Firefoxa i przejdź do strony `about:debugging`
2. Kliknij zakładkę _This Firefox_
3. Kliknij przycisk _Load Temporary Add-on..._
4. Wybierz archiwum, które zbudowałeś w ostatnim kroku procesu budowy
## Zgłaszanie błędów
Jeżeli znajdziesz jakieś problem, napisz do nas maila: kontakt@internet-czas-dzialac.pl
Nie przyjmujemy zgłoszeń na platformie Microsoft Github.
Każdy problem zostanie sprawdzony i przeniesiony na wewnętrzną listę problemów na naszej instancji Gitea: https://git.internet-czas-dzialac.pl/icd/rentgen/issues. Korzystamy z Gitea i najprawdopodobniej w przyszłości dzięki federalizacji Gitea będziemy w stanie wpuścić użytkowników do zgłaszania błędów bezpośrednio ze strony Gitea.
---
- Używać https://github.com/InteractiveAdvertisingBureau/iabtcf-es/tree/master/modules/core#iabtcfcore do wizualizacji "zgód" zebranych przez CMP-y od IAB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 460 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

View File

@ -1,331 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="135.46667mm"
height="135.46667mm"
viewBox="0 0 135.46669 135.46668"
version="1.1"
id="svg53021"
inkscape:version="1.1.1 (c3084ef, 2021-09-22)"
sodipodi:docname="icon-addon.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview53023"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:document-units="mm"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:zoom="0.078461974"
inkscape:cx="-3001.4539"
inkscape:cy="-1867.1465"
inkscape:window-width="1440"
inkscape:window-height="813"
inkscape:window-x="0"
inkscape:window-y="23"
inkscape:window-maximized="0"
inkscape:current-layer="layer1" />
<defs
id="defs53018">
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath173350-9-1">
<rect
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:40.0956;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect173352-6-8"
width="332.26355"
height="607.00031"
x="17577.004"
y="25919.434"
rx="57.737461"
transform="rotate(-2.0027185)" />
</clipPath>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter173358-2-9"
x="-0.032803837"
y="-0.047985993"
width="1.0656077"
height="1.0959719">
<feColorMatrix
type="hueRotate"
values="180"
result="color1"
id="feColorMatrix173354-1-6" />
<feColorMatrix
values="0 0 1 0 0 0 1 0 0 0 1 0 0 0 0 0.21 0.72 0.07 1 0 "
result="color2"
id="feColorMatrix173356-7-4" />
</filter>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter88345-2-8"
x="0"
y="0"
width="1"
height="1">
<feColorMatrix
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 -0.21 -0.72 -0.07 2 0 "
result="fbSourceGraphic"
id="feColorMatrix88343-0-4" />
<feColorMatrix
result="fbSourceGraphicAlpha"
in="fbSourceGraphic"
values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
id="feColorMatrix88715-6-3" />
<feColorMatrix
id="feColorMatrix88717-1-1"
type="hueRotate"
values="180"
result="color1"
in="fbSourceGraphic" />
<feColorMatrix
id="feColorMatrix88719-5-4"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0.21 0.72 0.07 1 0 "
result="color2" />
</filter>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter88349-5-9"
x="-0.030212665"
y="-0.032402139"
width="1.0604253"
height="1.0648043">
<feColorMatrix
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 -0.21 -0.72 -0.07 2 0 "
result="fbSourceGraphic"
id="feColorMatrix88347-4-2" />
<feColorMatrix
result="fbSourceGraphicAlpha"
in="fbSourceGraphic"
values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
id="feColorMatrix88721-7-0" />
<feColorMatrix
id="feColorMatrix88723-6-6"
type="hueRotate"
values="180"
result="color1"
in="fbSourceGraphic" />
<feColorMatrix
id="feColorMatrix88725-5-8"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0.21 0.72 0.07 1 0 "
result="color2" />
</filter>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter88353-6-9"
x="-0.032402139"
y="-0.030212665"
width="1.0648043"
height="1.0604253">
<feColorMatrix
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 -0.21 -0.72 -0.07 2 0 "
result="fbSourceGraphic"
id="feColorMatrix88351-9-2" />
<feColorMatrix
result="fbSourceGraphicAlpha"
in="fbSourceGraphic"
values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
id="feColorMatrix88727-3-6" />
<feColorMatrix
id="feColorMatrix88729-7-6"
type="hueRotate"
values="180"
result="color1"
in="fbSourceGraphic" />
<feColorMatrix
id="feColorMatrix88731-4-4"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0.21 0.72 0.07 1 0 "
result="color2" />
</filter>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter88357-5-9"
x="-0.033333346"
y="-0.050000001"
width="1.0666667"
height="1.1">
<feColorMatrix
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 -0.21 -0.72 -0.07 2 0 "
result="fbSourceGraphic"
id="feColorMatrix88355-2-5" />
<feColorMatrix
result="fbSourceGraphicAlpha"
in="fbSourceGraphic"
values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
id="feColorMatrix88733-5-0" />
<feColorMatrix
id="feColorMatrix88735-4-4"
type="hueRotate"
values="180"
result="color1"
in="fbSourceGraphic" />
<feColorMatrix
id="feColorMatrix88737-7-8"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0.21 0.72 0.07 1 0 "
result="color2" />
</filter>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter88349-5-9-3"
x="-0.030212665"
y="-0.032402139"
width="1.0604253"
height="1.0648043">
<feColorMatrix
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 -0.21 -0.72 -0.07 2 0 "
result="fbSourceGraphic"
id="feColorMatrix88347-4-2-6" />
<feColorMatrix
result="fbSourceGraphicAlpha"
in="fbSourceGraphic"
values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
id="feColorMatrix88721-7-0-1" />
<feColorMatrix
id="feColorMatrix88723-6-6-2"
type="hueRotate"
values="180"
result="color1"
in="fbSourceGraphic" />
<feColorMatrix
id="feColorMatrix88725-5-8-9"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0.21 0.72 0.07 1 0 "
result="color2" />
</filter>
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Invert"
id="filter88353-6-9-1"
x="-0.032402139"
y="-0.030212665"
width="1.0648043"
height="1.0604253">
<feColorMatrix
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 -0.21 -0.72 -0.07 2 0 "
result="fbSourceGraphic"
id="feColorMatrix88351-9-2-9" />
<feColorMatrix
result="fbSourceGraphicAlpha"
in="fbSourceGraphic"
values="0 0 0 -1 0 0 0 0 -1 0 0 0 0 -1 0 0 0 0 1 0"
id="feColorMatrix88727-3-6-4" />
<feColorMatrix
id="feColorMatrix88729-7-6-7"
type="hueRotate"
values="180"
result="color1"
in="fbSourceGraphic" />
<feColorMatrix
id="feColorMatrix88731-4-4-8"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0.21 0.72 0.07 1 0 "
result="color2" />
</filter>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath119614">
<path
style="fill:#249cac;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M -248.17551,322.92995 V 458.39657 L -112.70886,322.92995 Z"
id="path119616" />
</clipPath>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath119645">
<path
style="fill:#249cac;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 37.194174,319.15377 V 183.68712 L -98.272474,319.15377 Z"
id="path119647" />
</clipPath>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath119614-4">
<path
style="fill:#249cac;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M -248.17551,322.92995 V 458.39657 L -112.70886,322.92995 Z"
id="path119616-7" />
</clipPath>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath119645-4">
<path
style="fill:#249cac;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 37.194174,319.15377 V 183.68712 L -98.272474,319.15377 Z"
id="path119647-4" />
</clipPath>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath123068">
<path
d="m -146.33119,586.6503 c 37.33028,0.0512 67.582131,30.34176 67.62308,67.7332 -2.662653,-0.75518 -5.415433,-1.13917 -8.182276,-1.1443 -9.152811,-0.0768 -17.751854,4.38372 -22.991934,11.90009 -4.68483,6.77629 -5.67454,15.45055 -2.63733,23.11056 -1.94306,-0.34817 -3.91042,-0.52224 -5.88315,-0.52737 -8.76983,-0.0768 -17.09369,3.86739 -22.61997,10.68821 -5.40801,6.61911 -7.52258,15.33999 -5.74796,23.70627 -37.34744,-0.12803 -67.52478,-30.54501 -67.4037,-67.95233 0.12804,-37.40834 30.49582,-67.63414 67.84323,-67.51304 z m -5.15995,23.24597 c -1.03936,-0.44798 -2.16066,-0.67834 -3.29319,-0.67838 -3.41711,0.004 -6.49704,2.06592 -7.80624,5.22775 -1.30814,3.16182 -0.59135,6.80163 1.82273,9.2267 1.58978,1.58464 3.74095,2.4755 5.98427,2.47807 4.01332,-0.009 7.46626,-2.84338 8.26498,-6.78268 0.79873,-3.93931 -1.28,-7.89758 -4.97177,-9.47325 z m 39.51241,11.46723 c -1.35425,-0.56065 -2.8073,-0.84995 -4.27367,-0.84737 -4.57525,10e-4 -8.69583,2.77171 -10.42946,7.01231 -1.73314,4.2409 -0.73729,9.11076 2.52416,12.32559 2.10688,2.07873 4.94721,3.24427 7.9053,3.24427 6.22158,-0.008 11.26225,-5.05956 11.26607,-11.29108 -0.001,-4.52989 -2.69875,-8.62306 -6.85698,-10.40379 l -0.0257,2.6e-4 -0.0768,2e-5 z m -63.77513,16.98066 c -4.54555,-1.91233 -9.8038,-0.64257 -12.97974,3.13471 -3.17544,3.77674 -3.53101,9.18318 -0.87552,13.34471 0.83201,1.29534 1.91745,2.40892 3.19157,3.27165 3.50054,2.36799 8.02919,2.57585 11.73225,0.54015 3.70305,-2.03518 5.95917,-5.97321 5.84527,-10.20257 -0.10244,-4.22934 -2.57846,-8.0399 -6.38594,-9.87209 l 0.0768,-2e-5 -0.20479,-0.0768 -0.12804,-0.0512 0.0511,3e-5 c -0.1025,-0.0254 -0.17926,-0.0768 -0.28416,-0.10243 z m 29.42266,27.32966 c 2.69723,0.006 5.01993,-1.90463 5.5419,-4.55448 0.52225,-2.65036 -0.90111,-5.29992 -3.39814,-6.32264 -2.49601,-1.02402 -5.36577,-0.12806 -6.84777,2.12733 -1.48223,2.2579 -1.15968,5.25004 0.76801,7.13906 0.50175,0.49663 1.09568,0.89088 1.74593,1.16478 l 0.12805,0.0512 0.17924,0.0768 c 0.60415,0.20487 1.24429,0.32719 1.88672,0.32512 z m -25.35863,28.21774 c 4.32666,0.0114 7.95853,-3.26298 8.40217,-7.57426 0.44289,-4.31128 -2.44478,-8.25799 -6.68313,-9.13146 -4.2381,-0.87296 -8.44829,1.61023 -9.74006,5.74665 -1.29279,4.13644 0.75521,8.58057 4.73448,10.28168 h 0.0768 c 1.01888,0.43519 2.112,0.66561 3.21868,0.67839 z m 76.075954,-22.57526 c 3.11092,0 5.633051,2.52669 5.633045,5.64221 -2e-6,3.11603 -2.521614,5.64195 -5.633035,5.64195 -3.110931,0 -5.633054,-2.52669 -5.633064,-5.64195 0.004,-3.11472 2.524173,-5.63861 5.633054,-5.64221 z m 8.452895,16.93304 c 4.668414,0 8.452869,3.79082 8.452869,8.46664 0,4.67609 -3.784457,8.46667 -8.452869,8.46667 -4.668435,0 -8.452885,-3.79058 -8.452885,-8.46667 0.008,-4.67275 3.787529,-8.45896 8.452885,-8.46664 z m -33.811569,11.29107 c 4.66843,0 8.45289,3.79061 8.45289,8.46667 0,4.67582 -3.78446,8.46664 -8.45288,8.46664 -4.66841,0 -8.45288,-3.79082 -8.45288,-8.46664 1e-5,-4.67712 3.78344,-8.46974 8.45287,-8.47331 z m 19.71898,11.28443 c 3.110163,2e-5 5.631754,2.52417 5.633045,5.63967 0.0011,3.11526 -2.51904,5.64195 -5.628705,5.64451 -3.10987,0.003 -5.6338,-2.52158 -5.63739,-5.6353 0,-3.1173 2.52161,-5.64529 5.63305,-5.64888 z"
fill="#2e3a59"
id="path123070"
style="stroke-width:6.77333"
inkscape:transform-center-x="-44.159193"
inkscape:transform-center-y="160.92391" />
</clipPath>
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath119645-4-8">
<path
style="fill:#249cac;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 37.194174,319.15377 V 183.68712 L -98.272474,319.15377 Z"
id="path119647-4-4" />
</clipPath>
</defs>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(1257.4453,-313.40609)">
<g
id="g511"
transform="translate(40.499292,-186.77458)"
inkscape:export-filename="/Users/arkawiec/projects/internet-czas-dzialac/rentgen/assets/icons/icon-addon-2048.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96">
<g
id="g509"
transform="matrix(1.0081916,0,0,1.0064873,148.45653,296.28626)">
<g
id="g1595"
inkscape:export-filename="/Users/arkawiec/projects/internet-czas-dzialac/rentgen/assets/logo.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96">
<g
id="g1589">
<path
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.0657194px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m -1434.6491,316.91219 1e-4,-114.33198 112.5948,6.87072 10e-5,124.78187 z"
id="path503" />
<path
style="fill:#99ffdd;fill-opacity:1;stroke:none;stroke-width:0.0657194px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m -1322.2815,209.45093 21.9984,1.16661 v 126.55619 l -21.9984,-2.94092 z"
id="path505" />
<path
d="m -1378.4248,311.15116 c -24.7739,-0.0339 -44.8503,-20.13623 -44.8775,-44.95095 1.767,0.50119 3.5939,0.75602 5.4301,0.75943 6.0742,0.051 11.7809,-2.90926 15.2584,-7.89747 3.1091,-4.49707 3.7659,-10.25372 1.7503,-15.33726 1.2894,0.23105 2.5951,0.34659 3.9043,0.34998 5.82,0.051 11.3441,-2.56657 15.0115,-7.09319 3.589,-4.39277 4.9923,-10.18034 3.8146,-15.73261 24.7854,0.0849 44.8123,20.27113 44.732,45.09637 -0.085,24.82595 -20.2383,44.88521 -45.0237,44.80484 z m 3.4244,-15.42711 c 0.6898,0.2973 1.4339,0.45021 2.1855,0.45021 2.2677,-0.003 4.3117,-1.37104 5.1805,-3.46939 0.8682,-2.09835 0.3925,-4.51388 -1.2096,-6.12328 -1.055,-1.05165 -2.4826,-1.64287 -3.9714,-1.64457 -2.6634,0.005 -4.9549,1.88701 -5.485,4.50133 -0.5301,2.61431 0.8495,5.24118 3.2995,6.28688 z m -26.2221,-7.6102 c 0.8987,0.37207 1.863,0.56405 2.8362,0.56235 3.0363,-6.6e-4 5.7709,-1.83943 6.9214,-4.65371 1.1502,-2.81444 0.4893,-6.04631 -1.6751,-8.17984 -1.3983,-1.37951 -3.2832,-2.15305 -5.2463,-2.15305 -4.1289,0.005 -7.4741,3.35777 -7.4767,7.49331 7e-4,3.00625 1.791,5.72266 4.5506,6.90444 h 0.017 0.051 z m 42.3239,-11.26917 c 3.0166,1.2691 6.5062,0.42644 8.6139,-2.08033 2.1073,-2.50644 2.3433,-6.0944 0.581,-8.85619 -0.5521,-0.85965 -1.2725,-1.59869 -2.118,-2.17122 -2.3232,-1.57151 -5.3286,-1.70947 -7.7861,-0.35847 -2.4575,1.35064 -3.9547,3.96411 -3.8791,6.7709 0.068,2.8068 1.7111,5.33567 4.2379,6.5516 h -0.051 l 0.136,0.051 0.085,0.0339 h -0.034 c 0.068,0.017 0.1189,0.051 0.1885,0.0679 z m -19.5262,-18.13725 c -1.79,-0.004 -3.3314,1.264 -3.6778,3.02255 -0.3466,1.75891 0.598,3.5173 2.2552,4.19601 1.6564,0.67958 3.5609,0.085 4.5444,-1.41181 0.9837,-1.49844 0.7696,-3.48415 -0.5097,-4.73779 -0.333,-0.32959 -0.7271,-0.59123 -1.1586,-0.77301 l -0.085,-0.0339 -0.1189,-0.051 c -0.401,-0.13593 -0.8257,-0.21746 -1.2522,-0.21577 z m 16.8291,-18.72662 c -2.8713,-0.007 -5.2816,2.16546 -5.576,5.02662 -0.294,2.86117 1.6224,5.48041 4.4352,6.06009 2.8126,0.57934 5.6066,-1.06863 6.4639,-3.81377 0.858,-2.74513 -0.5012,-5.69448 -3.142,-6.82341 h -0.051 c -0.6762,-0.28881 -1.4016,-0.44172 -2.1361,-0.4502 z m -50.4872,14.98201 c -2.0646,0 -3.7384,-1.67685 -3.7384,-3.74444 0,-2.06794 1.6735,-3.74427 3.7384,-3.74427 2.0645,0 3.7383,1.67685 3.7383,3.74427 0,2.06708 -1.6752,3.74205 -3.7383,3.74444 z m -5.6097,-11.23757 c -3.0982,0 -5.6097,-2.51577 -5.6097,-5.61887 0,-3.10326 2.5115,-5.61887 5.6097,-5.61887 3.0981,0 5.6097,2.51561 5.6097,5.61887 -0.01,3.10105 -2.5136,5.61377 -5.6097,5.61887 z m 22.4388,-7.49329 c -3.0982,0 -5.6097,-2.51561 -5.6097,-5.61887 0,-3.1031 2.5115,-5.61888 5.6097,-5.61888 3.0981,0 5.6096,2.51578 5.6096,5.61888 0,3.10394 -2.5108,5.62091 -5.6096,5.62328 z m -13.0864,-7.48888 c -2.064,0 -3.7375,-1.67516 -3.7383,-3.74275 -7e-4,-2.06743 1.6717,-3.74427 3.7354,-3.74597 2.0639,-0.003 3.7389,1.67345 3.7412,3.73984 0,2.0688 -1.6734,3.74649 -3.7383,3.74888 z"
fill="#2e3a59"
id="path507"
style="fill:#99ffdd;fill-opacity:1;stroke-width:4.49508" />
</g>
</g>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 17 KiB

View File

@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15 22H9V20H15V22ZM15 19H9L8.777 17C8.65703 16.3385 8.45863 15.6936 8.186 15.079C7.832 14.579 7.463 14.152 7.106 13.735C5.79411 12.5053 5.03465 10.7978 5 9C5 5.13401 8.13401 2 12 2C15.866 2 19 5.13401 19 9C18.9593 10.7868 18.2057 12.4831 16.907 13.711L16.89 13.731C16.534 14.148 16.166 14.58 15.819 15.075C15.5466 15.6912 15.3476 16.3373 15.226 17L15 19ZM12 4C9.23995 4.00331 7.00331 6.23995 7 9C7 10.544 7.644 11.293 8.618 12.428C8.988 12.86 9.408 13.348 9.818 13.919C10.3156 14.8858 10.6555 15.9259 10.825 17H13.176C13.3499 15.929 13.6892 14.8916 14.182 13.925C14.582 13.354 15.001 12.863 15.37 12.431L15.385 12.413C16.357 11.273 17 10.52 17 9C16.9967 6.23995 14.7601 4.00331 12 4Z" fill="#000000"/>
</svg>

Before

Width:  |  Height:  |  Size: 814 B

View File

@ -1,40 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41L17.59 5Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg4"
sodipodi:docname="close_big.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs8" />
<sodipodi:namedview
id="namedview6"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg4" />
<path
d="M17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41L17.59 5Z"
fill="#2E3A59"
id="path2"
style="fill:#000000" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 240 B

View File

@ -1,47 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M11.9837 21.9999C6.47237 21.9938 2.00605 17.5203 2 11.9999C2.39311 12.1112 2.79955 12.168 3.20803 12.1689C4.55933 12.1789 5.82888 11.5217 6.6025 10.412C7.29413 9.41154 7.44027 8.13091 6.99186 6.99997C7.27858 7.05119 7.5692 7.07729 7.86045 7.07797C9.1552 7.08764 10.3841 6.50698 11.2 5.49998C11.9984 4.52274 12.3106 3.2352 12.0486 2C17.5625 2.01795 22.0178 6.50963 21.9999 12.0324C21.982 17.5553 17.4976 22.0178 11.9837 21.9999ZM12.7455 18.5679C12.8991 18.634 13.0645 18.6681 13.2317 18.6679C13.7362 18.6674 14.1909 18.363 14.3842 17.8961C14.5775 17.4293 14.4714 16.8919 14.1152 16.5339C13.8805 16.2998 13.5629 16.1683 13.2317 16.1679C12.6392 16.1693 12.1294 16.5877 12.0115 17.1693C11.8937 17.7509 12.2004 18.3353 12.7455 18.5679ZM6.91199 16.8749C7.11205 16.9578 7.32647 17.0003 7.54296 16.9999C8.21842 16.9997 8.82678 16.5907 9.08272 15.9646C9.33866 15.3385 9.19143 14.6195 8.71006 14.1449C8.3989 13.838 7.97969 13.6659 7.54296 13.6659C6.62442 13.667 5.88022 14.4129 5.87967 15.3329C5.87984 16.0017 6.2781 16.606 6.89202 16.8689H6.89702H6.908L6.91199 16.8749ZM16.3276 14.3679C16.9987 14.6502 17.775 14.4627 18.2439 13.9051C18.7127 13.3475 18.7652 12.5493 18.3733 11.9349C18.2506 11.7436 18.0902 11.5793 17.9021 11.4519C17.3853 11.1024 16.7167 11.0716 16.17 11.3721C15.6233 11.6726 15.2902 12.254 15.307 12.8784C15.3238 13.5028 15.6877 14.0654 16.2498 14.3359H16.2378L16.2677 14.3489L16.2877 14.3569H16.2817C16.296 14.3615 16.31 14.3669 16.3236 14.3729L16.3276 14.3679ZM11.9837 10.333C11.5855 10.3323 11.2426 10.6141 11.1655 11.0054C11.0883 11.3967 11.2986 11.7879 11.6672 11.9389C12.0357 12.0899 12.4594 11.9583 12.6782 11.625C12.8969 11.2917 12.8493 10.8499 12.5648 10.571C12.4906 10.4978 12.4032 10.4394 12.3072 10.399L12.2892 10.391L12.2623 10.381C12.1729 10.349 12.0786 10.3328 11.9837 10.333ZM15.7276 6.16697C15.0888 6.16539 14.5526 6.64873 14.4871 7.28522C14.4216 7.92172 14.8481 8.50444 15.4738 8.63339C16.0995 8.76235 16.7211 8.39562 16.9118 7.78494C17.1025 7.17425 16.8004 6.51814 16.2128 6.26698H16.2028C16.0525 6.20267 15.8911 6.16869 15.7276 6.16697ZM4.49593 9.49996C4.03663 9.49996 3.66429 9.12701 3.66429 8.66696C3.66429 8.20691 4.03663 7.83397 4.49593 7.83397C4.95523 7.83397 5.32757 8.20691 5.32757 8.66696C5.32702 9.12679 4.95501 9.49941 4.49593 9.49996ZM3.24797 6.99997C2.55873 6.99997 2 6.44033 2 5.74998C2 5.05963 2.55873 4.49999 3.24797 4.49999C3.9372 4.49999 4.49593 5.05963 4.49593 5.74998C4.49483 6.43988 3.93674 6.99887 3.24797 6.99997ZM8.23983 5.33298C7.55059 5.33298 6.99186 4.77334 6.99186 4.08299C6.99186 3.39264 7.55059 2.833 8.23983 2.833C8.92906 2.833 9.48779 3.39264 9.48779 4.08299C9.48779 4.7735 8.92922 5.33343 8.23983 5.33398V5.33298ZM5.32857 3.66699C4.8694 3.66699 4.49711 3.29425 4.49693 2.83433C4.49675 2.37441 4.86873 2.00137 5.32791 2.001C5.78708 2.00063 6.15967 2.37308 6.16022 2.833C6.16022 3.29321 5.78804 3.66644 5.32857 3.66699Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg827"
sodipodi:docname="cookie.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
>
<style>
path:target {
fill: #ff726b !important;
}
</style>
<defs id="defs831" />
<sodipodi:namedview
id="namedview829"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg827"
/>
<path
d="M11.9837 21.9999C6.47237 21.9938 2.00605 17.5203 2 11.9999C2.39311 12.1112 2.79955 12.168 3.20803 12.1689C4.55933 12.1789 5.82888 11.5217 6.6025 10.412C7.29413 9.41154 7.44027 8.13091 6.99186 6.99997C7.27858 7.05119 7.5692 7.07729 7.86045 7.07797C9.1552 7.08764 10.3841 6.50698 11.2 5.49998C11.9984 4.52274 12.3106 3.2352 12.0486 2C17.5625 2.01795 22.0178 6.50963 21.9999 12.0324C21.982 17.5553 17.4976 22.0178 11.9837 21.9999ZM12.7455 18.5679C12.8991 18.634 13.0645 18.6681 13.2317 18.6679C13.7362 18.6674 14.1909 18.363 14.3842 17.8961C14.5775 17.4293 14.4714 16.8919 14.1152 16.5339C13.8805 16.2998 13.5629 16.1683 13.2317 16.1679C12.6392 16.1693 12.1294 16.5877 12.0115 17.1693C11.8937 17.7509 12.2004 18.3353 12.7455 18.5679ZM6.91199 16.8749C7.11205 16.9578 7.32647 17.0003 7.54296 16.9999C8.21842 16.9997 8.82678 16.5907 9.08272 15.9646C9.33866 15.3385 9.19143 14.6195 8.71006 14.1449C8.3989 13.838 7.97969 13.6659 7.54296 13.6659C6.62442 13.667 5.88022 14.4129 5.87967 15.3329C5.87984 16.0017 6.2781 16.606 6.89202 16.8689H6.89702H6.908L6.91199 16.8749ZM16.3276 14.3679C16.9987 14.6502 17.775 14.4627 18.2439 13.9051C18.7127 13.3475 18.7652 12.5493 18.3733 11.9349C18.2506 11.7436 18.0902 11.5793 17.9021 11.4519C17.3853 11.1024 16.7167 11.0716 16.17 11.3721C15.6233 11.6726 15.2902 12.254 15.307 12.8784C15.3238 13.5028 15.6877 14.0654 16.2498 14.3359H16.2378L16.2677 14.3489L16.2877 14.3569H16.2817C16.296 14.3615 16.31 14.3669 16.3236 14.3729L16.3276 14.3679ZM11.9837 10.333C11.5855 10.3323 11.2426 10.6141 11.1655 11.0054C11.0883 11.3967 11.2986 11.7879 11.6672 11.9389C12.0357 12.0899 12.4594 11.9583 12.6782 11.625C12.8969 11.2917 12.8493 10.8499 12.5648 10.571C12.4906 10.4978 12.4032 10.4394 12.3072 10.399L12.2892 10.391L12.2623 10.381C12.1729 10.349 12.0786 10.3328 11.9837 10.333ZM15.7276 6.16697C15.0888 6.16539 14.5526 6.64873 14.4871 7.28522C14.4216 7.92172 14.8481 8.50444 15.4738 8.63339C16.0995 8.76235 16.7211 8.39562 16.9118 7.78494C17.1025 7.17425 16.8004 6.51814 16.2128 6.26698H16.2028C16.0525 6.20267 15.8911 6.16869 15.7276 6.16697ZM4.49593 9.49996C4.03663 9.49996 3.66429 9.12701 3.66429 8.66696C3.66429 8.20691 4.03663 7.83397 4.49593 7.83397C4.95523 7.83397 5.32757 8.20691 5.32757 8.66696C5.32702 9.12679 4.95501 9.49941 4.49593 9.49996ZM3.24797 6.99997C2.55873 6.99997 2 6.44033 2 5.74998C2 5.05963 2.55873 4.49999 3.24797 4.49999C3.9372 4.49999 4.49593 5.05963 4.49593 5.74998C4.49483 6.43988 3.93674 6.99887 3.24797 6.99997ZM8.23983 5.33298C7.55059 5.33298 6.99186 4.77334 6.99186 4.08299C6.99186 3.39264 7.55059 2.833 8.23983 2.833C8.92906 2.833 9.48779 3.39264 9.48779 4.08299C9.48779 4.7735 8.92922 5.33343 8.23983 5.33398V5.33298ZM5.32857 3.66699C4.8694 3.66699 4.49711 3.29425 4.49693 2.83433C4.49675 2.37441 4.86873 2.00137 5.32791 2.001C5.78708 2.00063 6.15967 2.37308 6.16022 2.833C6.16022 3.29321 5.78804 3.66644 5.32857 3.66699Z"
fill="#2E3A59"
id="color"
style="fill:#000000"
/>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -1,40 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg892"
sodipodi:docname="data.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs896" />
<sodipodi:namedview
id="namedview894"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg892" />
<path
d="M12 22C7.664 22 4 19.965 4 17.556V6.444C4 4.035 7.664 2 12 2C16.336 2 20 4.035 20 6.444V17.556C20 19.965 16.337 22 12 22ZM6 14.9V17.559C6.07 18.112 8.309 19.781 12 19.781C15.691 19.781 17.931 18.107 18 17.553V14.9C16.1794 15.9554 14.1039 16.4905 12 16.447C9.89606 16.4906 7.82058 15.9554 6 14.9ZM6 9.341V12C6.07 12.553 8.309 14.222 12 14.222C15.691 14.222 17.931 12.548 18 11.994V9.341C16.1795 10.3968 14.104 10.9323 12 10.889C9.89596 10.9323 7.82046 10.3968 6 9.341ZM12 4.222C8.308 4.222 6.069 5.896 6 6.451C6.07 7 8.311 8.666 12 8.666C15.689 8.666 17.931 6.992 18 6.438C17.93 5.887 15.689 4.222 12 4.222Z"
fill="#2E3A59"
id="path890"
style="fill:#000000" />
</svg>

Before

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18 22H6C4.89543 22 4 21.1046 4 20V4.00001C4 2.89544 4.89543 2.00001 6 2.00001H13C13.2654 1.99907 13.5201 2.10462 13.707 2.29301L19.707 8.29301C19.8954 8.47994 20.0009 8.73462 20 9.00001V20C20 21.1046 19.1046 22 18 22ZM6 4.00001V20H16.586L14.02 17.434C13.4101 17.8017 12.7121 17.9973 12 18C10.1612 18.0199 8.54049 16.7967 8.05545 15.0229C7.57041 13.2491 8.34318 11.3714 9.93625 10.4529C11.5293 9.53434 13.5415 9.80626 14.8337 11.1147C16.1258 12.4231 16.3724 14.4386 15.434 16.02L18 18.588V9.41401L12.586 4.00001H6ZM12 12C10.8954 12 10 12.8954 10 14C10 15.1046 10.8954 16 12 16C13.1046 16 14 15.1046 14 14C14 12.8954 13.1046 12 12 12Z" fill="#000000"/>
</svg>

Before

Width:  |  Height:  |  Size: 764 B

View File

@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18 22H6C4.89543 22 4 21.1046 4 20V4C4 2.89543 4.89543 2 6 2H13C13.0109 2.00047 13.0217 2.00249 13.032 2.006C13.0418 2.00902 13.0518 2.01103 13.062 2.012C13.1502 2.01765 13.2373 2.0348 13.321 2.063L13.349 2.072C13.3717 2.07968 13.3937 2.08904 13.415 2.1C13.5239 2.14842 13.6232 2.21618 13.708 2.3L19.708 8.3C19.7918 8.38479 19.8596 8.48406 19.908 8.593C19.918 8.615 19.925 8.638 19.933 8.661L19.942 8.687C19.9699 8.77039 19.9864 8.85718 19.991 8.945C19.9926 8.95418 19.9949 8.96322 19.998 8.972C19.9998 8.98122 20.0004 8.99062 20.0001 9V20C20.0001 21.1046 19.1046 22 18 22ZM6 4V20H18V10H13C12.4477 10 12 9.55228 12 9V4H6ZM14 5.414V8H16.586L14 5.414ZM15 16H9V14H15V16Z" fill="#000000"/>
</svg>

Before

Width:  |  Height:  |  Size: 798 B

View File

@ -1,40 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C21.9939 17.5203 17.5203 21.9939 12 22ZM4 12.172C4.04732 16.5732 7.64111 20.1095 12.0425 20.086C16.444 20.0622 19.9995 16.4875 19.9995 12.086C19.9995 7.68451 16.444 4.10977 12.0425 4.086C7.64111 4.06246 4.04732 7.59876 4 12V12.172ZM14 17H11V13H10V11H13V15H14V17ZM13 9H11V7H13V9Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg957"
sodipodi:docname="info_circle_outline.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs961" />
<sodipodi:namedview
id="namedview959"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg957" />
<path
d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C21.9939 17.5203 17.5203 21.9939 12 22ZM4 12.172C4.04732 16.5732 7.64111 20.1095 12.0425 20.086C16.444 20.0622 19.9995 16.4875 19.9995 12.086C19.9995 7.68451 16.444 4.10977 12.0425 4.086C7.64111 4.06246 4.04732 7.59876 4 12V12.172ZM14 17H11V13H10V11H13V15H14V17ZM13 9H11V7H13V9Z"
fill="#2E3A59"
id="path955"
style="fill:#000000" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 492 B

View File

@ -1,41 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg135"
sodipodi:docname="laptop.svg"
inkscape:version="1.2 (dc2aedaf03, 2022-05-15)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs139" />
<sodipodi:namedview
id="namedview137"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
showgrid="false"
inkscape:zoom="26.634355"
inkscape:cx="11.958239"
inkscape:cy="12.990741"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg135" />
<path
d="M21 19H3C1.89543 19 1 18.1046 1 17V16H3V7C3 5.89543 3.89543 5 5 5H19C20.1046 5 21 5.89543 21 7V16H23V17C23 18.1046 22.1046 19 21 19ZM5 7V16H19V7H5Z"
fill="#2E3A59"
id="path133"
style="fill:#000000" />
</svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -1,40 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M20 20H4C2.89543 20 2 19.1046 2 18V5.913C2.04661 4.84255 2.92853 3.99899 4 4H20C21.1046 4 22 4.89543 22 6V18C22 19.1046 21.1046 20 20 20ZM4 7.868V18H20V7.868L12 13.2L4 7.868ZM4.8 6L12 10.8L19.2 6H4.8Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg1022"
sodipodi:docname="mail.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1026" />
<sodipodi:namedview
id="namedview1024"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1022" />
<path
d="M20 20H4C2.89543 20 2 19.1046 2 18V5.913C2.04661 4.84255 2.92853 3.99899 4 4H20C21.1046 4 22 4.89543 22 6V18C22 19.1046 21.1046 20 20 20ZM4 7.868V18H20V7.868L12 13.2L4 7.868ZM4.8 6L12 10.8L19.2 6H4.8Z"
fill="#2E3A59"
id="path1020"
style="fill:#000000" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 331 B

View File

@ -1,41 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg4"
sodipodi:docname="report.svg"
inkscape:version="1.2 (dc2aedaf03, 2022-05-15)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs8" />
<sodipodi:namedview
id="namedview6"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
showgrid="false"
inkscape:zoom="37.666667"
inkscape:cx="12.013274"
inkscape:cy="12"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg4" />
<path
d="M13.66 4.3C13.5649 3.83433 13.1553 3.5 12.68 3.5H5.5C4.94772 3.5 4.5 3.94772 4.5 4.5V19.5C4.5 20.0523 4.94772 20.5 5.5 20.5C6.05228 20.5 6.5 20.0523 6.5 19.5V13.5H12.1L12.34 14.7C12.4307 15.1683 12.8431 15.5048 13.32 15.5H18.5C19.0523 15.5 19.5 15.0523 19.5 14.5V6.5C19.5 5.94772 19.0523 5.5 18.5 5.5H13.9L13.66 4.3Z"
fill="#2E3A59"
id="path2"
style="fill:#000000" />
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -1,40 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M13.8199 22H10.1799C9.71003 22 9.30347 21.673 9.20292 21.214L8.79592 19.33C8.25297 19.0921 7.73814 18.7946 7.26092 18.443L5.42392 19.028C4.97592 19.1709 4.48891 18.9823 4.25392 18.575L2.42992 15.424C2.19751 15.0165 2.27758 14.5025 2.62292 14.185L4.04792 12.885C3.98312 12.2961 3.98312 11.7019 4.04792 11.113L2.62292 9.816C2.27707 9.49837 2.19697 8.98372 2.42992 8.576L4.24992 5.423C4.48491 5.0157 4.97192 4.82714 5.41992 4.97L7.25692 5.555C7.50098 5.37416 7.75505 5.20722 8.01792 5.055C8.27026 4.91269 8.52995 4.78385 8.79592 4.669L9.20392 2.787C9.30399 2.32797 9.71011 2.00049 10.1799 2H13.8199C14.2897 2.00049 14.6958 2.32797 14.7959 2.787L15.2079 4.67C15.4887 4.79352 15.7622 4.93308 16.0269 5.088C16.2739 5.23081 16.5126 5.38739 16.7419 5.557L18.5799 4.972C19.0276 4.82967 19.514 5.01816 19.7489 5.425L21.5689 8.578C21.8013 8.98548 21.7213 9.49951 21.3759 9.817L19.9509 11.117C20.0157 11.7059 20.0157 12.3001 19.9509 12.889L21.3759 14.189C21.7213 14.5065 21.8013 15.0205 21.5689 15.428L19.7489 18.581C19.514 18.9878 19.0276 19.1763 18.5799 19.034L16.7419 18.449C16.5093 18.6203 16.2677 18.7789 16.0179 18.924C15.7557 19.0759 15.4853 19.2131 15.2079 19.335L14.7959 21.214C14.6954 21.6726 14.2894 21.9996 13.8199 22ZM7.61992 16.229L8.43992 16.829C8.62477 16.9652 8.81743 17.0904 9.01692 17.204C9.20462 17.3127 9.39788 17.4115 9.59592 17.5L10.5289 17.909L10.9859 20H13.0159L13.4729 17.908L14.4059 17.499C14.8132 17.3194 15.1998 17.0961 15.5589 16.833L16.3799 16.233L18.4209 16.883L19.4359 15.125L17.8529 13.682L17.9649 12.67C18.0141 12.2274 18.0141 11.7806 17.9649 11.338L17.8529 10.326L19.4369 8.88L18.4209 7.121L16.3799 7.771L15.5589 7.171C15.1997 6.90671 14.8132 6.68175 14.4059 6.5L13.4729 6.091L13.0159 4H10.9859L10.5269 6.092L9.59592 6.5C9.39772 6.58704 9.20444 6.68486 9.01692 6.793C8.81866 6.90633 8.62701 7.03086 8.44292 7.166L7.62192 7.766L5.58192 7.116L4.56492 8.88L6.14792 10.321L6.03592 11.334C5.98672 11.7766 5.98672 12.2234 6.03592 12.666L6.14792 13.678L4.56492 15.121L5.57992 16.879L7.61992 16.229ZM11.9959 16C9.78678 16 7.99592 14.2091 7.99592 12C7.99592 9.79086 9.78678 8 11.9959 8C14.2051 8 15.9959 9.79086 15.9959 12C15.9932 14.208 14.2039 15.9972 11.9959 16ZM11.9959 10C10.9033 10.0011 10.0138 10.8788 9.99815 11.9713C9.98249 13.0638 10.8465 13.9667 11.9386 13.9991C13.0307 14.0315 13.9468 13.1815 13.9959 12.09V12.49V12C13.9959 10.8954 13.1005 10 11.9959 10Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg1087"
sodipodi:docname="settings.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1091" />
<sodipodi:namedview
id="namedview1089"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1087" />
<path
d="M13.8199 22H10.1799C9.71003 22 9.30347 21.673 9.20292 21.214L8.79592 19.33C8.25297 19.0921 7.73814 18.7946 7.26092 18.443L5.42392 19.028C4.97592 19.1709 4.48891 18.9823 4.25392 18.575L2.42992 15.424C2.19751 15.0165 2.27758 14.5025 2.62292 14.185L4.04792 12.885C3.98312 12.2961 3.98312 11.7019 4.04792 11.113L2.62292 9.816C2.27707 9.49837 2.19697 8.98372 2.42992 8.576L4.24992 5.423C4.48491 5.0157 4.97192 4.82714 5.41992 4.97L7.25692 5.555C7.50098 5.37416 7.75505 5.20722 8.01792 5.055C8.27026 4.91269 8.52995 4.78385 8.79592 4.669L9.20392 2.787C9.30399 2.32797 9.71011 2.00049 10.1799 2H13.8199C14.2897 2.00049 14.6958 2.32797 14.7959 2.787L15.2079 4.67C15.4887 4.79352 15.7622 4.93308 16.0269 5.088C16.2739 5.23081 16.5126 5.38739 16.7419 5.557L18.5799 4.972C19.0276 4.82967 19.514 5.01816 19.7489 5.425L21.5689 8.578C21.8013 8.98548 21.7213 9.49951 21.3759 9.817L19.9509 11.117C20.0157 11.7059 20.0157 12.3001 19.9509 12.889L21.3759 14.189C21.7213 14.5065 21.8013 15.0205 21.5689 15.428L19.7489 18.581C19.514 18.9878 19.0276 19.1763 18.5799 19.034L16.7419 18.449C16.5093 18.6203 16.2677 18.7789 16.0179 18.924C15.7557 19.0759 15.4853 19.2131 15.2079 19.335L14.7959 21.214C14.6954 21.6726 14.2894 21.9996 13.8199 22ZM7.61992 16.229L8.43992 16.829C8.62477 16.9652 8.81743 17.0904 9.01692 17.204C9.20462 17.3127 9.39788 17.4115 9.59592 17.5L10.5289 17.909L10.9859 20H13.0159L13.4729 17.908L14.4059 17.499C14.8132 17.3194 15.1998 17.0961 15.5589 16.833L16.3799 16.233L18.4209 16.883L19.4359 15.125L17.8529 13.682L17.9649 12.67C18.0141 12.2274 18.0141 11.7806 17.9649 11.338L17.8529 10.326L19.4369 8.88L18.4209 7.121L16.3799 7.771L15.5589 7.171C15.1997 6.90671 14.8132 6.68175 14.4059 6.5L13.4729 6.091L13.0159 4H10.9859L10.5269 6.092L9.59592 6.5C9.39772 6.58704 9.20444 6.68486 9.01692 6.793C8.81866 6.90633 8.62701 7.03086 8.44292 7.166L7.62192 7.766L5.58192 7.116L4.56492 8.88L6.14792 10.321L6.03592 11.334C5.98672 11.7766 5.98672 12.2234 6.03592 12.666L6.14792 13.678L4.56492 15.121L5.57992 16.879L7.61992 16.229ZM11.9959 16C9.78678 16 7.99592 14.2091 7.99592 12C7.99592 9.79086 9.78678 8 11.9959 8C14.2051 8 15.9959 9.79086 15.9959 12C15.9932 14.208 14.2039 15.9972 11.9959 16ZM11.9959 10C10.9033 10.0011 10.0138 10.8788 9.99815 11.9713C9.98249 13.0638 10.8465 13.9667 11.9386 13.9991C13.0307 14.0315 13.9468 13.1815 13.9959 12.09V12.49V12C13.9959 10.8954 13.1005 10 11.9959 10Z"
fill="#2E3A59"
id="path1085"
style="fill:#000000" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -1,40 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M7.83 11L11.41 7.41L10 6L4 12L10 18L11.41 16.59L7.83 13H20V11H7.83Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg1152"
sodipodi:docname="short_left.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1156" />
<sodipodi:namedview
id="namedview1154"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1152" />
<path
d="M7.83 11L11.41 7.41L10 6L4 12L10 18L11.41 16.59L7.83 13H20V11H7.83Z"
fill="#2E3A59"
id="path1150"
style="fill:#000000" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 198 B

View File

@ -1,40 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M17 22H7C5.89543 22 5 21.1046 5 20V7H3V5H7V4C7 2.89543 7.89543 2 9 2H15C16.1046 2 17 2.89543 17 4V5H21V7H19V20C19 21.1046 18.1046 22 17 22ZM7 7V20H17V7H7ZM9 4V5H15V4H9ZM15 18H13V9H15V18ZM11 18H9V9H11V18Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg1217"
sodipodi:docname="trash_full.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1221" />
<sodipodi:namedview
id="namedview1219"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="1.9174434"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1217" />
<path
d="M17 22H7C5.89543 22 5 21.1046 5 20V7H3V5H7V4C7 2.89543 7.89543 2 9 2H15C16.1046 2 17 2.89543 17 4V5H21V7H19V20C19 21.1046 18.1046 22 17 22ZM7 7V20H17V7H7ZM9 4V5H15V4H9ZM15 18H13V9H15V18ZM11 18H9V9H11V18Z"
fill="#2E3A59"
id="path1215"
style="fill:#000000" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 334 B

View File

@ -1,47 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg <path d="M21.2659 20.998H2.73288C2.37562 20.998 2.04551 20.8074 1.86688 20.498C1.68825 20.1886 1.68825 19.8074 1.86688 19.498L11.1329 3.49799C11.3117 3.1891 11.6415 2.9989 11.9984 2.9989C12.3553 2.9989 12.6851 3.1891 12.8639 3.49799L22.1299 19.498C22.3084 19.8072 22.3085 20.1882 22.1301 20.4975C21.9518 20.8069 21.622 20.9976 21.2649 20.998H21.2659ZM10.9999 15.998V17.998H11.9329H11.9979H12.0629H12.9979V15.998H10.9999ZM10.9999 8.99799V13.998H12.9999V8.99799H10.9999Z" fill="#2E3A59"/>
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
version="1.1"
id="svg1282"
sodipodi:docname="warning.svg"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
>
<style>
path:target {
fill: #ffb900 !important;
}
</style>
<defs id="defs1286" />
<sodipodi:namedview
id="namedview1284"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="31.291667"
inkscape:cx="12.015979"
inkscape:cy="11.984021"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1282"
/>
<path
d="M21.2659 20.998H2.73288C2.37562 20.998 2.04551 20.8074 1.86688 20.498C1.68825 20.1886 1.68825 19.8074 1.86688 19.498L11.1329 3.49799C11.3117 3.1891 11.6415 2.9989 11.9984 2.9989C12.3553 2.9989 12.6851 3.1891 12.8639 3.49799L22.1299 19.498C22.3084 19.8072 22.3085 20.1882 22.1301 20.4975C21.9518 20.8069 21.622 20.9976 21.2649 20.998H21.2659ZM10.9999 15.998V17.998H11.9329H11.9979H12.0629H12.9979V15.998H10.9999ZM10.9999 8.99799V13.998H12.9999V8.99799H10.9999Z"
fill="#2E3A59"
id="color"
style="fill:#000000"
/>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 590 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 480 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 526 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 414 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 275 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 316 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 139 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 215 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 362 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 468 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 752 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 346 KiB

BIN
border-48.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 225 B

View File

@ -1,25 +0,0 @@
import { RequestCluster } from '../../request-cluster';
import { ParsedAnswers } from './parse-answers';
import NoInformationAtAllProblem from './problems/no-information-at-all';
import { Problem } from './problems/problem';
import { TransferOutsideEU } from './problems/transfer-outside-eu';
import { UnknownIdentity } from './problems/unknown-identity';
import { UnknownLegalBasis } from './problems/unknown-legal-basis';
import { UnknownPurposes } from './problems/unknown-purpose';
import { UnlawfulCookieAccess } from './problems/unlawful-cookies';
export default function deduceProblems(
answers: ParsedAnswers,
clusters: Record<string, RequestCluster>
): Problem[] {
return [
NoInformationAtAllProblem,
UnknownPurposes,
UnlawfulCookieAccess,
UnknownLegalBasis,
UnknownIdentity,
TransferOutsideEU,
]
.map((c) => new c(answers, clusters))
.filter((p) => p.qualifies());
}

View File

@ -1,74 +0,0 @@
@import './../../styles/colors.scss';
h1 {
font-size: 1.1rem;
margin-bottom: calc(24 / 16 * 1rem);
}
.mail-container {
box-shadow: rgba(12, 12, 13, 0.1) 0px 1px 4px 0px;
background-color: #fff;
margin-top: 0.5rem;
max-width: 100ex;
margin: 0 auto;
font-size: calc(14 / 16 * 1rem);
&__header {
display: flex;
justify-content: flex-end;
}
&__content {
max-height: 50vh;
overflow-y: scroll;
padding: 1rem 2rem;
color: $black-color;
a {
color: $ultra-black-color;
}
}
h2 {
font-weight: 700;
font-size: 1rem;
}
p {
font-size: calc(14 / 16 * 1rem);
}
}
.greeting-text {
font-size: 1rem;
a {
color: $ultra-black-color;
font-weight: 700;
}
}
.buttons-email-container {
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr 1fr 1fr 1fr;
margin: 2rem 0;
padding: 1em 0;
&--single {
grid-template-columns: 1fr 1fr 1fr;
}
.sv_prev_btn,
.sv_next_btn {
margin: 0 !important;
}
.sv_prev_btn {
grid-column: 2/3;
}
.sv_next_btn--single {
grid-column: 2;
}
}

View File

@ -1,161 +0,0 @@
import { RequestCluster } from '../../request-cluster';
import deduceProblems from './deduce-problems';
import { Explainers } from './explainers';
import { ParsedAnswers } from './parse-answers';
import { v } from './verbs';
import './email-content.scss';
import { Fragment, useState } from 'react';
import emailIntro from './email-intro';
import { reportIntro } from './report-intro';
import { downloadText } from '../../util';
import { getFakeClusterData } from './fake-clusters';
const SS_URL = 'http://65.108.60.135:3000';
export default function EmailContent({
answers,
visited_url,
clusters,
scrRequestPath,
downloadFiles,
user_role,
}: {
answers: ParsedAnswers;
visited_url: string;
clusters: Record<string, RequestCluster>;
scrRequestPath: string;
downloadFiles: Function;
user_role: string;
}) {
const _ = (key: string) => v(key, answers.zaimek);
const problems = deduceProblems(answers, clusters);
const explainers = Array.from(
new Set(
problems
.map((problem) => problem.getNecessaryExplainers())
.reduce((a, b) => a.concat(b), [])
)
).map((explainer_key) => Explainers[explainer_key]);
const [copied, setCopy] = useState<boolean>(false);
function copyTextToClipboard() {
// Should be changed in the future to Clipboard API (https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/write#browser_compatibility)
let r = document.createRange();
const container = document.querySelector('.mail-container__content');
if (!container) return;
r.selectNode(container);
window.getSelection()?.addRange(r);
document.execCommand('copy');
window.getSelection()?.removeAllRanges();
setCopy(true);
}
const mode = answers.user_role === 'user' ? 'email' : 'report';
const email_tone = answers.email_type === 'polite_information' ? 'polite' : 'official';
return (
<Fragment>
<div className="generator-container">
<h1>Treść {mode === 'email' ? 'maila' : 'raportu'}</h1>
<div className="mail-container">
<div className="mail-container__header">
<div className="mail-container__header--control"></div>
</div>
<article className="mail-container__content">
{mode === 'email'
? emailIntro(email_tone, _, visited_url)
: reportIntro(visited_url)}
{problems.map((problem, index) => {
const Component = problem.getEmailContent.bind(problem);
return <Component mode={mode} tone={email_tone} key={index} />;
})}
{explainers.map((explainer) => explainer(answers.zaimek))}
<h2>Państwa rola jako współadministratora danych osobowych</h2>
{mode == 'email' ? (
<p>
{_('Zwracam')} Państwa uwagę na fakt, że w myśl{' '}
<a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
treści wyroku TSUE w sprawie C-40/17
</a>{' '}
poprzez wysyłanie moich danych w wyżej opisanym zakresie stają się
Państwo współadministratorem {_('moich')} danych osobowych, nawet
jeżeli nie Państwo bezpośrednimi autorami osadzonych na Państwa
stronie skryptów czy innych zasobów ujawniających dane użytkowników
Państwa strony podmiotom trzecim. Dlatego ciąży na Państwu obowiązek
odpowiedzi na {_('moje')} pytania na mocy Art. 12 i 13
Rozporządzenia 2016/679 Parlamentu Europejskiego i Rady (UE) z dnia
27 kwietnia 2016 r. w sprawie ochrony osób fizycznych w związku z
przetwarzaniem danych osobowych i w sprawie swobodnego przepływu
takich danych oraz uchylenia dyrektywy 95/46/WE (ogólne
rozporządzenie o ochronie danych) RODO
</p>
) : (
<p>
W myśl{' '}
<a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
treści wyroku TSUE w sprawie C-40/17
</a>
, ponoszą Państwo współodpowiedzialność za skrypty i inne zasoby
ujawniajace dane osobowe na Państwa stronie, nawet jeżeli nie
Państwo ich bezpośrednimi autorami.
</p>
)}
</article>
</div>
<div
className={
scrRequestPath
? 'buttons-email-container'
: 'buttons-email-container buttons-email-container--single'
}
>
{scrRequestPath ? (
<button
className="sv_prev_btn"
onClick={() => downloadFiles(`${SS_URL}${scrRequestPath}`)}
>
Pobierz zrzuty ekranów
</button>
) : null}
<button
className={
scrRequestPath ? 'sv_next_btn' : 'sv_next_btn sv_next_btn--single'
}
onClick={() => copyTextToClipboard()}
>
{copied ? 'Skopiowano!' : 'Kopiuj treść'}
</button>
</div>
{copied && user_role === 'user' ? (
<section className="greeting-text">
<strong>Przed Tobą ostatni krok! 😊</strong>
<p>
<a href="mailto:?subject=Zapytanie o przetwarzanie moich danych osobowych przez Państwa stronę">
Przejdź do swojego klienta pocztowego
</a>
, załącz zrzuty ekranów, wklej treść wiadomości i wyślij do
administratorów witryny {visited_url.split('/').slice(0, 3).join('/')}.
</p>
</section>
) : null}
<div className="diag-toolbox">
<a
href="#"
onClick={() =>
downloadText(
'diag.json',
JSON.stringify({
answers,
fake_clusters_data: getFakeClusterData(clusters),
visited_url,
})
)
}
>
Pobierz plik diagnostyczny
</a>
</div>
</div>
</Fragment>
);
}

View File

@ -1,32 +0,0 @@
import { getDate } from '../../util';
declare var PLUGIN_NAME: string;
declare var PLUGIN_URL: string;
export default function emailIntro(
tone: 'polite' | 'official',
_: (verb: string) => string,
visited_url: string
) {
return (
<>
<p>{tone == 'polite' ? 'Szanowni Państwo' : 'Dzień dobry'},</p>
<p>
w dniu {getDate()} {_('odwiedziłem')} stronę {visited_url}. Po podejrzeniu ruchu
sieciowego generowanego przez stronę za pomocą wtyczki{' '}
<a href={PLUGIN_URL}>{PLUGIN_NAME}</a> w przeglądarce Firefox{' '}
{tone == 'polite' ? (
<>
{_('chciałbym')} zwrócić Państwa uwagę na kilka potencjalnych problemów ze
zgodnością RODO na Państwa stronie.
</>
) : (
<>
{_('mam')} pytania dotyczące przetwarzania {_('moich')} danych osobowych, na
które nie {_('znalazłem')} odpowiedzi nigdzie na Państwa stronie.
</>
)}
</p>
</>
);
}

View File

@ -1,72 +0,0 @@
// various explainers that could be related to multiple problems. They are gathered here and added at the end of the email to avoid pasting them multiple times
export type ExplainerKey = 'cookies_are_pii' | 'responsibility_for_third_parties';
export const Explainers: Record<ExplainerKey, (zaimek_index: 0 | 1 | 2 | 3) => JSX.Element> = {
cookies_are_pii: () => (
<>
<h2>Ciasteczka stanowią dane osobowe</h2>
<p>
Sztucznie wygenerowane identyfikatory przechowywane w plikach Cookies stanowią dane
osobowe. Wskazuje na to wprost Art. 4. pkt 1. RODO, wymieniając identyfikator
internetowy i numer identyfikacyjny jako przykłady danych osobowych. Losowe
przypisane identyfikatory mogą nie zawierać imienia i nazwiska osoby, której
dotyczą, ani nie prowadzić wprost do ich ustalenia, ale pozwalają odróżnić jedną,
daną konkretną osobę, od innych.
</p>
<p>
Por. komentarz z D. Lubasz [w:] Ochrona Danych Osobowych [red.] D. Lubasz, Warszawa
2020 r., str. 81:
</p>
<p>
<em>
Zidentyfikowaną osobą fizyczną jest osoba, której tożsamość jest ustalona -
bezpośrednio i natychmiast, czyli taka, którą bezpośrednio można wskazać,
wyodrębnić lub wyróżnić z określonej zbiorowości.{' '}
<strong>Nie musi to natomiast polegać na podaniu jej imienia nazwiska</strong>.
Konstatacja ta jest zwłaszcza istotna w środowisku cyfrowym, w którym
identyfikacja sprowadza się do oznaczenia danego użytkownika w celu wywierania
na niego określonego wpływu. (...) Możliwą do zidentyfikowania jest osoba,
której tożsamość dopiero administrator może ustalić -{' '}
<strong>niezależnie od tego, czy to zrobi, czy nie</strong>.
</em>
</p>
<p>
Podobnie za{' '}
<em>
P. Litwiński [w:] Rozporządzenie UE w sprawie ochrony osób fizycznych w związku
z przetwarzaniem danych osobowych i w sprawie swobodnego przepływu takich
danych, Komentarz [red.] P. Litwiński, Warszawa 2018 r.
</em>
:
</p>
<p>
<em>
Jak zwrócono uwagę w nauce prawa, identyfikacja osoby powinna być rozumiana jako
możliwość fizycznego wskazania tejże osoby, nie zaś jako ustalenie
podstawowych danych tej osoby (...). Analogicznie,{' '}
<em>identyfikacja osoby nie wymaga znajomości jej imienia lub nazwiska</em>,
wymaga natomiast znajomości pewnych unikalnych cech tej osoby, które odróżniają
od innych osób (...). W ten sam sposób należy więc rozumieć zwrot można
zidentyfikować - nie tylko jako możliwość odniesienia konkretnej informacji do
konkretnej osoby, lecz także jako możliwość wskazania tej osoby, rozumianego
jako faktyczne wyodrębnienie jej spośród innych osób.
</em>
</p>
</>
),
responsibility_for_third_parties: () => (
<>
<h2>Administrator strony ponosi odpowiedzialność za skrypty podmiotów trzecich</h2>
<p>
W wypadku, gdy ujawnienie czy dostęp do danych osobowych zostało dokonane przez
skrypty podmiotów trzecich (np. Google, Facebook, itp), których autorem nie jest
Administrator strony, Administrator wciąż jest odpowiedzialny za procesy
przetwarzania danych osobowych, jakie realizują te skrypty - w myśl treści{' '}
<a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
wyroku TSUE w sprawie C-40/17
</a>
</p>
</>
),
};

View File

@ -1,56 +0,0 @@
// good for diagnostic purposes
import { RequestCluster } from '../../request-cluster';
import { DataLocation } from '../../stolen-data-entry';
export type FakeRequestClusterData = {
id: string;
hasCookies: boolean;
hasMarkedCookies: boolean;
hasMarks: boolean;
exposesOriginWhere: DataLocation[];
exposesOrigin: boolean;
};
export function getFakeClusterData(
clusters: Record<string, RequestCluster>
): Record<string, FakeRequestClusterData> {
return Object.fromEntries(
Object.entries(clusters).map(([key, cluster]) => [key, cluster.makeDataForFake()])
);
}
export function makeFakeClusters(
fake_clusters_data: Record<string, FakeRequestClusterData>
): Record<string, FakeCluster> {
return Object.fromEntries(
Object.entries(fake_clusters_data).map(([key, cluster_data]) => [
key,
new FakeCluster(cluster_data),
])
);
}
export class FakeCluster extends RequestCluster {
constructor(public data: FakeRequestClusterData) {
super(data.id);
for (const key of [
'hasCookies',
'hasMarkedCookies',
'hasMarks',
'exposesOriginWhere',
'exposesOrigin',
]) {
//@ts-ignore
this[key] = () => {
//@ts-ignore
return this.data[key];
};
}
}
hasCookies() {
return this.data.hasCookies;
}
}

View File

@ -1,440 +0,0 @@
import { RequestCluster } from '../../request-cluster';
function generateHostPage(
cluster: RequestCluster,
index: number,
all_clusters: RequestCluster[]
): { title: string; elements: any[]; visibleIf?: string } {
function f(name: string, c = cluster) {
return `${c.id.replace(/\./g, '_')}|${name}`;
}
const previous_cluster: RequestCluster | null = index > 0 ? all_clusters[index - 1] : null;
function defaultValue(name: string) {
if (!previous_cluster) {
return {};
}
return { defaultValueExpression: `{${f(name, previous_cluster)}}` };
}
const domain = cluster.id;
const danych = cluster.getDataTypeDescription();
return {
title: cluster.id,
elements: [
{
type: 'radiogroup',
name: f('present'),
isRequired: true,
title: `Strona udostępniła właścicielowi domeny ${domain} ${danych}. Cel takiego przetwarzania danych:`,
...defaultValue('present'),
visibleIf: '{popup_type} != "none"',
choices: [
{
value: 'not_mentioned',
text: 'nie jest podany nigdzie na stronie',
visibleIf: "{policy_readable} = 'yes' ",
},
{
value: 'not_before_making_a_choice',
text: 'nie jest podany w żadnym miejscu na stronie, do którego można się dostać bez podejmowania wyboru dotyczącego przetwarzania danych osobowych',
},
{
value: 'mentioned_in_policy',
text: 'jest podany w polityce prywatności',
visibleIf: "{policy_readable} = 'yes' ",
},
{
value: 'mentioned_in_popup',
text: 'jest podany w okienku RODO',
visibleIf: "{popup_type} != 'none' ",
},
],
},
{
type: 'radiogroup',
name: f('legal_basis_type'),
...defaultValue('legal_basis_type'),
isRequired: true,
title: `Podstawa prawna dla tego konkretnego celu`,
visibleIf: `{${f('present')}} notempty and {${f(
'present'
)}} != "not_mentioned" and {${f('present')}} != "not_before_making_a_choice"`,
choices: [
{ value: 'consent', text: 'to zgoda (art. 6 ust. 1 lit. a RODO).' },
{
value: 'legitimate_interest',
text: 'to uzasadniony interes (art. 6 ust. 1 lit. f RODO).',
},
{ value: 'not_mentioned', text: 'nie jest wskazana nigdzie na stronie.' },
],
},
{
type: 'radiogroup',
name: f('consent_problems'),
...defaultValue('consent_problems'),
isRequired: true,
title: `Jak ma się ta podstawa prawna do stanu faktycznego?`,
visibleIf: `{${f('legal_basis_type')}} = "consent"`,
defaultValueExpression:
'iif({popup_action} = "none" or {popup_action} = "closed_popup", "claims_consent_but_sends_before_consent", iif({popup_action} = "accept_all" and {rejection_is_hard} = "yes", "claims_consent_but_there_was_no_easy_refuse", ""))',
choices: [
{
value: 'claims_consent_but_sends_before_consent',
text: `Strona wysłała {moje} dane do ${domain} zanim {wyraziłem} na to zgodę`,
},
{
value: 'claims_consent_but_there_was_no_easy_refuse',
text: '{Kliknąłem} przycisk od wyrażania zgody, ale w okienku o zgodę nie było natychmiastowo dostępnego przycisku do niewyrażenia zgody jednym kliknięciem',
},
{ value: 'none', text: 'żadne z powyższych.' },
],
},
{
type: 'radiogroup',
name: f('legitimate_interest_activity_specified'),
...defaultValue('legitimate_interest_activity_specified'),
isRequired: true,
title: /* HTML */ `Czy administrator strony opisał szczegółowo, na czym polega
uzasadniony interes w kontekście tego celu?`,
visibleIf: `{${f('legal_basis_type')}} = "legitimate_interest"`,
choices: [
{
value: 'precise',
text: /* HTML */ `Tak, wskazuje jasno na bieżące działania lub korzyści
wynikające z takiego przetwarzania danych.`,
},
{
value: 'vague',
text: `Wskazuje tylko ogólnie, jak np. „marketing” czy „statystyki”.`,
},
{
value: 'no',
text: `Nie. Nie wiadomo, na czym ten uzasadniony interes polega.`,
},
],
},
{
type: 'text',
title: `Jak administrator opisał to, na czym polega uzasadniony interes w kontekście ${domain}?`,
name: f('legitimate_interest_description'),
visibleIf: `{${f('legitimate_interest_activity_specified')}} = 'vague'`,
placeholder: 'marketing',
defaultValueExpression:
index == 0
? 'marketing'
: `{${f(
'legitimate_interest_description',
previous_cluster || undefined
)}}`,
},
{
type: 'radiogroup',
title: `Czy domena ${domain} należy do podmiotu spoza Europy (np. Google, Facebook)?`,
name: f('outside_eu'),
...defaultValue('outside_eu'),
visibleIf: `{${f('legitimate_interest_activity_specified')}} = "precise" or {${f(
'consent_problems'
)}} = "none"`,
isRequired: true,
choices: [
{ value: 'yes', text: 'Tak' },
{ value: 'no', text: 'Nie' },
{ value: 'not_sure', text: 'Nie wiem' },
],
},
{
type: 'radiogroup',
title: `Czy w {Twojej} ocenie ujawnienie {Twoich} danych (${danych}) właścicielowi domeny ${domain} było konieczne do świadczenia zażądanej przez {Ciebie} usługi drogą elektroniczną?`,
name: f('was_processing_necessary'),
isRequired: true,
...defaultValue('was_processing_necessary'),
visibleIf: `{${f('legal_basis_type')}} = "legitimate_interest" or {${f(
'present'
)}} = "not_mentioned" or {${f(
'present'
)}} = "not_before_making_a_choice" or {popup_type} = "none"`,
choices: [
{ value: 'yes', text: 'Tak, było konieczne' },
{ value: 'no', text: 'Nie, nie było konieczne' },
{ value: 'not_sure', text: 'Nie mam zdania' },
],
},
],
};
}
export default function generateSurveyQuestions(clusters: RequestCluster[]) {
return {
showQuestionNumbers: 'off',
showProgressBar: 'top',
pagePrevText: 'Wróć',
pageNextText: 'Dalej',
completeText: 'Dalej',
locale: 'pl',
clearInvisibleValues: 'onHidden',
pages: [
{
title: 'Dodatkowe pytania',
elements: [
{
type: 'html',
name: 'intro',
html: /* HTML */ `<p>
Analiza ruchu sieciowego generowanego przez stronę została zakończona.
Teraz, aby lepiej oszacować, gdzie potencjalne obszary robocze pod
względem zgodności z RODO, możesz udzielić odpowiedzi na pytania
dotyczące funkcjonowania strony. Wtyczka wtedy wygeneruje raport lub
treść maila, którą możesz wysłać do administratora strony.
</p>`,
},
],
},
{
title: 'Kontekst analizy',
elements: [
{
type: 'radiogroup',
name: 'user_role',
title: 'Jestem:',
isRequired: true,
choices: [
{ value: 'user', text: 'użytkownikiem strony' },
{ value: 'admin', text: 'administratorem strony' },
],
},
{
type: 'radiogroup',
name: 'email_type',
title: 'Chcę:',
visibleIf: "{user_role} = 'user'",
choices: [
{
value: 'polite_information',
text: 'uprzejmie poinformować administratora strony o potencjalnych problemach ze zgodnością z RODO na jego stronie',
},
{
value: 'official_request',
text: 'wysłać formalne zapytanie do administratora strony, na które ma obowiązek odpowiedzieć. Jeżeli administrator nie odpowie na takie zapytanie, może to być podstawą złożenia skargi do UODO',
},
],
},
{
type: 'radiogroup',
name: 'zaimek',
title: 'Forma czasownika, jaka będzie użyta w raporcie:',
isRequired: true,
choices: [
{ value: 0, text: 'wysłałem' },
{ value: 1, text: 'wysłałam' },
{ value: 2, text: 'wysłałom' },
{ value: 3, text: 'wysłaliśmy' },
],
},
],
},
{
title: 'Obowiązek informacyjny i mechanizm pozyskiwania zgody',
elements: [
{
type: 'radiogroup',
title: 'Jaką formę informacji o przetwarzaniu danych osobowych stosuje ta strona?',
name: 'popup_type',
isRequired: true,
choices: [
{ value: 'none', text: 'Brak informacji' },
{
value: 'page',
text: 'Tylko w postaci tekstu na podstronie np. "prywatność" lub "polityka cookies"',
},
{
value: 'passive_popup',
text: /* HTML */ `Okienko o cookiesach, bez możliwości podjęcia
żadnego wyboru (np. tylko opcja zamknij)`,
},
{
value: 'some_choice',
text: 'Okienko o cookiesach, z możliwością podjęcia wyboru',
},
],
},
{
type: 'checkbox',
title: /* HTML */ `Istnieje możliwość, że okienko z informacjami i wyborami
dotyczącymi przetwarzania {Twoich} danych osobowych ukazało się dawno temu w
trakcie {twojej} wcześniejszej wizyty i wtedy je {odkliknąłeś}. {Otwórz}
samą stronę w Trybie Prywatnym (Incognito). Co {widzisz}?`,
visibleIf: "{popup_type} = 'none' or {popup_type} = 'page'",
name: 'is_incognito_different',
isRequired: true,
choices: [
{
value: 'incognito_is_the_same',
text: 'W Trybie prywatnym {widzę} to samo, co {widziałem} w normalnym trybie',
},
],
},
{
type: 'html',
visibleIf:
'{is_incognito_different} != "no" and ({popup_type} = "none" or {popup_type} = "page") ',
html: /* HTML */ `Jeżeli w trybie incognito {widzisz} więcej okienek z
informacjami o przetwarzaniu danych osobowych, {wykonaj} analizę w
normalnym trybie ponownie - ale najpierw {usuń} pliki cookies tej
strony.
<a
href="https://support.mozilla.org/pl/kb/usuwanie-ciasteczek-i-danych-stron-firefox?redirectslug=usuwanie-ciasteczek&redirectlocale=pl"
target="_blank"
>
{Zobacz}, jak to zrobić
</a>`,
},
{
type: 'radiogroup',
name: 'mentions_passive_consent',
isRequired: true,
visibleIf: '{popup_type} = "passive_popup"',
title: 'Czy treść okienka wskazuje na zgodę wyrażoną pasywnie, np. „Korzystając z naszej strony wyrażasz zgodę”, „Brak zmiany ustawień przeglądarki oznacza zgodę”, „Klikając przycisk "X" (zamknij) wyrażasz zgodę”?',
choices: [
{
value: 'yes',
text: 'Tak',
},
{
value: 'no',
text: 'Nie',
},
],
},
{
type: 'text',
name: 'passive_consent_description',
isRequired: true,
visibleIf: '{mentions_passive_consent} = "yes"',
title: 'Jakimi słowami administrator opisuje to pasywne wyrażenie zgody? Zacytuj wprost. Na przykład: „Korzystając ze strony wyrażasz zgodę”, albo „Pozostawiając ustawienia przeglądarki bez zmian (..) wyrażasz zgodę”',
defaultValue: 'Korzystając ze strony wyrażasz zgodę',
},
{
type: 'radiogroup',
name: 'cookie_wall',
isRequired: true,
visibleIf: '{popup_type} = "passive_popup"',
title: 'Czy treść strony jest wygodnie czytelna bez odkliknięcia tego okienka o RODO?',
choices: [
{
value: 'no', // wiem, że tu jest "no", a odpowiedź brzmi "tak" - ale nazwa pytania dotyczy obecności cookie walla
text: 'Tak, jest czytelna',
},
{
value: 'yes',
text: 'Nie. Jest zupełnie niewidoczna albo jest przesłonięta w stopniu uniemożliwiającym lub znacznie utrudniającym czytanie treści strony.',
},
],
},
{
type: 'radiogroup',
name: 'rejection_is_hard',
isRequired: true,
visibleIf: '{popup_type} = "some_choice"',
title: 'Czy wyrażenie zgody na wszystkie cele jest dokładnie tak samo łatwe, jak odmowa zgody na wszystkie cele?',
choices: [
{
value: 'no', // wiem, że tu jest "no", a odpowiedź brzmi "tak" - ale nazwa pytania dotyczy braku równowagi
text: 'Tak. Opcja odmowy zgody na wszystkie cele jest równie widoczna i łatwo dostępna, co opcja wyrażenia zgody.',
},
{
value: 'yes',
text: 'Nie. {Muszę} wykonać więcej czynności (np. kliknięć) aby odmówić wszystkich zgód, albo opcja niewyrażenia zgody jest mało widoczna.',
},
],
},
{
type: 'radiogroup',
name: 'popup_action',
isRequired: true,
visibleIf: '{popup_type} = "some_choice" or {popup_type} = "passive_popup"',
title: 'Jaką akcję {podjąłeś} w ramach wyskakującego okienka?',
choices: [
{
value: 'none',
text: 'Nic nie {kliknąłem}',
},
{
value: 'closed_popup',
text: '{Zamknąłem} okienko za pomocą przycisku „X” lub „Zamknij”, lub podobnego',
},
{
value: 'accept_all',
text: '{Kliknąłem} przycisk od akceptacji wszystkich zgód',
},
{
value: 'deny_all',
text: '{Odmówiłem} wyrażenia zgody na wszystkie cele',
},
{
value: 'other',
text: 'Coś innego',
},
],
},
{
type: 'text',
name: 'popup_closed_how',
isRequired: true,
visibleIf: '{popup_action} = "closed_popup"',
title: 'W jaki sposób {zamknąłeś} okienko o zgodę? Opisz pełnym zdaniem',
defaultValueExpression: '{Kliknąłem} przycisk „X”.',
},
{
type: 'text',
name: 'popup_deny_all_how',
isRequired: true,
visibleIf: '{popup_action} = "deny_all"',
title: 'W jaki sposób {zamknąłeś} okienko o zgodę? Opisz pełnym zdaniem, np.: „{Kliknąłem} przycisk <Odrzuć wszystkie>” lub „{Odznaczyłem} wszystkie opcje w ustawieniach zaawansowanych”',
defaultValueExpression: '{Kliknąłem} przycisk „odmawiam wyrażenia zgody”.',
},
{
type: 'radiogroup',
name: 'administrator_identity_available_before_choice',
isRequired: true,
visibleIf: '{popup_type} = "some_choice"',
title: 'Czy przed podjęciem wyboru dot. {Twoich} danych {masz} możliwość poznać tożsamość administratora strony?',
choices: [
{
value: 'yes',
text: 'Tak.',
},
{
value: 'no',
text: 'Nie.',
},
],
},
],
},
{
title: 'Obowiązek informacyjny, polityka prywatności',
visibleIf: "{popup_type} != 'none'",
elements: [
{
type: 'radiogroup',
title: 'Czy polityka prywatności jest dostępna i czytelna?',
name: 'policy_readable',
isRequired: true,
choices: [
{ value: 'yes', text: 'Dostępna i czytelna' },
{
value: 'entirely_obscured_by_popup',
text: 'Dostępna, ale nieczytelna. Zasłania ją całkowicie lub prawie całkowicie popup o RODO lub nie można się do niej doklikać bez podjęcia wyboru w okienku',
},
{
value: 'cant_find',
text: `Niedostępna. {Szukałem}, ale nie {znalazłem} jej na stronie`,
},
],
},
],
},
...clusters.map(generateHostPage),
],
};
}

View File

@ -1,73 +0,0 @@
import RawAnswers, { BasicRawAnswers, HostRawAnswers } from './raw-answers';
export type RecordValue<T> = T extends Record<any, infer R> ? R : any;
export type ParsedHostAnswers = ({
present:
| 'not_mentioned'
| 'not_before_making_a_choice'
| 'mentioned_in_policy'
| 'mentioned_in_popup';
legal_basis_type: 'consent' | 'legitimate_interes' | 'not_mentioned';
was_processing_necessary: 'yes' | 'no' | 'not_sure';
} & (
| {
consent_problems:
| 'claims_consent_but_sends_before_consent'
| 'claims_consent_but_there_was_no_easy_refuse';
}
| { consent_problems: 'none'; outside_eu: 'yes' | 'no' | 'not_sure' }
)) & {
legitimate_interest_activity_specified: 'no' | 'precise' | 'vague';
outside_eu: 'yes' | 'no' | 'not_sure';
legitimate_interest_description?: string;
};
export type ParsedAnswers = BasicRawAnswers & { hosts: Record<string, ParsedHostAnswers> };
function parseHostAnswers(
raw_answers: Record<keyof HostRawAnswers, string>
): Record<string, ParsedHostAnswers> {
const result: Record<string, Record<string, string>> = {};
for (const [key, value] of Object.entries(raw_answers)) {
const [masked_host, attr] = key.split('|');
const host = masked_host.replace(/_/g, '.');
if (!result[host]) {
result[host] = {} as ParsedHostAnswers;
}
result[host][attr] = value;
}
return result as Record<string, ParsedHostAnswers>;
}
export function parseAnswers({
zaimek,
user_role,
email_type,
is_incognito_different,
policy_readable,
popup_type,
cookie_wall,
passive_consent_description,
mentions_passive_consent,
rejection_is_hard,
administrator_identity_available_before_choice,
popup_action,
...rest
}: RawAnswers): ParsedAnswers {
return {
zaimek,
user_role,
email_type,
is_incognito_different,
policy_readable,
popup_type,
cookie_wall,
passive_consent_description,
mentions_passive_consent,
rejection_is_hard,
administrator_identity_available_before_choice,
popup_action,
hosts: parseHostAnswers(rest),
} as ParsedAnswers;
}

View File

@ -1,67 +0,0 @@
import { ExplainerKey } from '../explainers';
import { v } from '../verbs';
import { Problem } from './problem';
export default class NoInformationAtAllProblem extends Problem {
qualifies() {
return this.answers.popup_type === 'none';
}
getEmailContent({ mode, tone }: { mode: 'email' | 'report'; tone: 'official' | 'polite' }) {
const _ = (word: string) => v(word, this.answers.zaimek);
return (
<>
<h2>Brak informacji na temat przetwarzania danych osobowych</h2>
{mode == 'email' ? (
tone == 'official' ? (
<p>
{_('Moje')} dane osobowe zostały ujawnione podmiotom, które
właścicielami domen:
</p>
) : (
<p>
Państwa strona ujawnia dane użytkowników podmiotom, które
właścicielami następujących domen:
</p>
)
) : (
<p>
Poprzez skrypty osadzone na stronie dane osobowe użytkownika końcowego
przekazywane podmiotom, którzy właścicielami następujacych domen:
</p>
)}
{this.getRangeDescription()}
<p>
Na stronie brakuje jednak jakichkolwiek informacji o tym, jakie cele
przetwarzania takich danych oraz jakie podstawy prawne takiego przetwarzania.
</p>
{mode == 'email' ? (
<p>Zwracam się zatem do Państwa z następującymi pytaniami:</p>
) : (
<p>Na stronie należy zawrzeć odpowiedzi na następujące pytania:</p>
)}
<ul>
<li>Jaka jest tożsamość właścicieli tych domen?</li>
<li>Jaki jest cel takiego przetwarzania danych przez Państwa stronę?</li>
<li>
Jaka jest podstawa prawna takiego przetwarzania{' '}
{mode == 'email' ? _('moich') : ''} danych osobowych
{mode == 'report' ? 'użytkowników końcowych' : ''} przez Państwa stronę?
</li>
</ul>
</>
);
}
getNecessaryExplainers() {
const explainers = [] as Array<ExplainerKey>;
if (
this.getMarkedClusters().some((cluster) => {
return cluster.hasMarkedCookies();
})
) {
explainers.push('cookies_are_pii');
explainers.push('responsibility_for_third_parties');
}
return explainers;
}
}

View File

@ -1,41 +0,0 @@
import { RequestCluster } from '../../../request-cluster';
import { ExplainerKey } from '../explainers';
import { ParsedAnswers } from '../parse-answers';
function formatRange(cluster: RequestCluster) {
const parts = [] as string[];
if (cluster.hasMarkedCookies()) {
parts.push('mojego identyfikatora internetowego pozyskanego z Cookie');
}
if (cluster.exposesOrigin()) {
parts.push('części mojej historii przeglądania');
}
return parts.join(' oraz ');
}
export abstract class Problem {
constructor(public answers: ParsedAnswers, public clusters: Record<string, RequestCluster>) {}
abstract getEmailContent(props: {
mode: 'email' | 'report';
tone: 'polite' | 'official';
}): JSX.Element;
abstract getNecessaryExplainers(): ExplainerKey[];
abstract qualifies(): boolean;
getMarkedClusters() {
return Object.values(this.clusters).filter((c) => c.hasMarks());
}
getRangeDescription() {
return (
<ul>
{this.getMarkedClusters().map((cluster) => (
<li key={cluster.id}>
{cluster.id} (w zakresie: {formatRange(cluster)})
</li>
))}
</ul>
);
}
}

View File

@ -1,90 +0,0 @@
import { RequestCluster } from '../../../request-cluster';
import { ExplainerKey } from '../explainers';
import { v } from '../verbs';
import { Problem } from './problem';
export class TransferOutsideEU extends Problem {
getNecessaryExplainers(): ExplainerKey[] {
const has_cookies = this.getRelatedClusters().some((cluster) => cluster.hasCookies());
return has_cookies ? ['cookies_are_pii'] : [];
}
qualifies(): boolean {
return Object.values(this.answers.hosts).some(
(hostAnswers) => hostAnswers.outside_eu == 'yes'
);
}
getRelatedClusters(): RequestCluster[] {
return Object.entries(this.answers.hosts)
.filter(([_, hostAnswers]) => hostAnswers.outside_eu == 'yes')
.map(([id]) => this.clusters[id]);
}
getEmailContent({ mode }: { mode: 'email' | 'report'; tone: 'official' | 'polite' }) {
const clusters = this.getRelatedClusters();
const _ = (key: string) => v(key, this.answers.zaimek);
return (
<>
<h2>Transfer danych osobowych poza Europejski Obszar Gospodarczy</h2>
{mode == 'email' ? (
<p>
Państwa strona przetworzyła {_('moje')} dane osobowe poprzez przesłanie
danych do:
</p>
) : (
<p>
Strona przetwarza dane osobowe użytkowników końcowych poprzez przesłanie
przekazanie ich do:
</p>
)}
<ul>
{clusters.map((cluster) => (
<li key={cluster.id}>
właściciela domeny <strong>{cluster.id}</strong>: (w zakresie:{' '}
{cluster.getDataTypeDescription(mode == 'email' ? 'mojej' : '')});
</li>
))}
</ul>
{mode == 'email' ? (
<p>
Według {_('mojej')} najlepszej wiedzy, każdy z tych podmiotów utrzymuje
swoje serwery poza Europejskim Obszarem Gospodarczym. Zatem Państwa strona
przesłała
{_('moje')} dane osobowe poza EOG. Jeżeli tak jest, to takie przetwarzanie
danych jest niezgodne z prawem, gdyż dane trafiają do krajów, które nie
gwarantują ochrony danych w stopniu, jakiego wymaga RODO, a tzw. Tarcza
Prywatności została unieważniona w 2020r. Zob.{' '}
<a href="https://panoptykon.org/noyb-skargi-schrems-ii">
artykuł Fundacji Panoptykon w tej sprawie
</a>
.
</p>
) : (
<p>
Te podmioty utrzymują swoje centra danych poza Europejskim Obszarem
Gospodarczym. Jako, że tzw. Tarcza Prywatności zostałą unieważniona w
2020r., nie można przesyłać danych osobowych obywateli Unii Europejskiej do
krajów, które nie zapewniają ochrony danych o sile odpowiadającej RODO.
Przykłądem kraju, do którego nie można przekazywać danych osobowych
obywateli UE Stany Zjednoczone.
</p>
)}
{mode == 'email' ? (
<p>
{_('Zwracam')} się zatem do Państwa z pytaniem:{' '}
<strong>
czy wyżej wymienione podmioty, którym Państwa strona ujawniła moje dane
osobowe, przechowują moje dane poza EOG?
</strong>
</p>
) : (
<p>
Zaleca się rezygnację z korzystania z usług firm, które przetwarzają dane
osobowe użytkowników, a których centra danych znajdują się poza EOG.
</p>
)}
</>
);
}
}

View File

@ -1,55 +0,0 @@
import { ExplainerKey } from '../explainers';
import { v } from '../verbs';
import { Problem } from './problem';
export class UnknownIdentity extends Problem {
getNecessaryExplainers(): ExplainerKey[] {
return ['responsibility_for_third_parties'];
}
qualifies(): boolean {
return this.answers.administrator_identity_available_before_choice == 'no';
}
getEmailContent({ mode, tone }: { mode: 'email' | 'report'; tone: 'official' | 'polite' }) {
const _ = (key: string) => v(key, this.answers.zaimek);
return (
<>
<h2>Tożsamość administratora</h2>
{mode == 'email' ? (
<p>
Na Państwa stronie nie {_('znalazłem')} sposobu na poznanie tożsamości
administratora strony <strong>przed</strong> podjęciem wyboru dotyczącego
przetwarzania danych mnie dotyczących.
</p>
) : (
<p>Na stronie brakuje sposobu na poznanie tożsamości administratora strony.</p>
)}
<p>
Zgodnie z treścią Art. 13 RODO, jeżeli dane osobowe osoby, której dane dotyczą,
zbierane od tej osoby, administrator podczas pozyskiwania danych osobowych
musi podać jej swoją tożsamość i dane kontaktowe.
</p>
{mode == 'email' ? (
tone == 'official' ? (
<p>
Zwracam się zatem z pytaniem:{' '}
<strong>jaka jest tożsamość administratora tej strony?</strong>
</p>
) : (
<p>
Apeluję o dodanie do Państwa strony informacji o tym, kto (np. pełna
nazwa firmy + NIP oraz dane kontaktowe) jest administratorem danych
osobowych przetwarzanych przez stronę.
</p>
)
) : (
<p>
Zalecane jest dodanie informacji o administratorze strony (pełna nazwa firmy
+ NIP i dane kontaktowe) w łatwo dostępnym miejscu na stronie.
</p>
)}
</>
);
}
}

View File

@ -1,121 +0,0 @@
import { RequestCluster } from '../../../request-cluster';
import { ExplainerKey } from '../explainers';
import { ParsedHostAnswers } from '../parse-answers';
import { v } from '../verbs';
import { Problem } from './problem';
const testCluster: (cluster: RequestCluster, answers: ParsedHostAnswers | undefined) => boolean = (
cluster,
hostAnswers
) => {
if (!hostAnswers) {
return false;
}
if (cluster.hasMarkedCookies()) {
/* if it has cookies, it will be picked up by the UnlawfulCookieAccess problem, and that one
is pretty detailed, so no need to mention it here. */
return false;
}
return hostAnswers.legal_basis_type == 'not_mentioned';
};
export class UnknownLegalBasis extends Problem {
getNecessaryExplainers(): ExplainerKey[] {
const has_cookies = this.getRelatedClusters().some((cluster) => cluster.hasCookies());
return [
'responsibility_for_third_parties',
...(has_cookies ? ['cookies_are_pii' as ExplainerKey] : []),
];
}
qualifies(): boolean {
return Object.values(this.clusters).some((cluster) =>
testCluster(cluster, this.answers.hosts[cluster.id])
);
}
getRelatedClusters() {
return Object.values(this.clusters).filter((cluster) =>
testCluster(cluster, this.answers.hosts[cluster.id])
);
}
getEmailContent({ mode, tone }: { mode: 'email' | 'report'; tone: 'official' | 'polite' }) {
const clusters = this.getRelatedClusters();
const _ = (key: string) => v(key, this.answers.zaimek);
return (
<>
<h2>Przetwarzanie danych osobowych bez podania podstawy prawnej</h2>
{mode == 'email' ? (
<p>Państwa strona przetworzyła {_('moje')} dane osobowe poprzez ujawnienie:</p>
) : (
<p>Państwa strona przetwarza dane osobowe użytkowników poprzez ujawnienie</p>
)}
<ul>
{clusters.map((cluster) => (
<li key={cluster.id}>
właścicielowi domeny <strong>{cluster.id}</strong>:{' '}
{cluster.getDataTypeDescription(mode == 'email' ? 'mojej' : '')}
</li>
))}
</ul>
{mode == 'email' ? (
<p>
{_('Moja')} historia przeglądania stanowi {_('moje')} dane osobowe. Zgodnie
z treścią Artykułu 13 p. 1 lit. c){' '}
<a href="https://eur-lex.europa.eu/legal-content/PL/TXT/HTML/?uri=CELEX:32016R0679&qid=1632163985520&from=PL#d1e1822-1-1">
RODO
</a>
, aby przetwarzać dane osobowe, trzeba poinformować osobę, której dane
dotyczą, o tym, jaka jest podstawa prawna takiego przetwarzania danych.
</p>
) : (
<p>
Na stronie nie znajdują się informacje o tym, jaka jest podstawa prawna
takiego przetwarzania danych osobowych, jakimi jest część historii
przeglądania. Zgodnie z treścią Artykułu 13. p. 1 lit. c) RODO, aby
przetwarzać dane osobowe, trzeba poinformować osobę, której dane dotyczą, o
tym, jaka jest podstawa prawna takiego przetwarzania danych.
</p>
)}
{mode == 'email' ? (
tone == 'official' ? (
<p>
Zwracam się zatem z pytaniem:{' '}
<strong>
jakie były podstawy prawne ujawnienia moich danych każdemu z wyżej
wymienionych podmiotów przez Państwa stronę?
</strong>
</p>
) : (
<p>
Dodanie do Państwa strony informacji o tym, jakie podstawy prawne (w
znaczeniu Art. 6 pkt. 1 RODO) dla każdego z tych procesów przetwarzania
miałoby pozytywny wpływ na przejrzystość informacji dla użytkowników
końcowych, jak i na zgodność strony z obowiązującymi przepisami.
</p>
)
) : (
<>
<p>Możliwe działania:</p>
<ul>
<li>rezygnacja z niektórych skryptów śledzących;</li>
<li>
przeniesienie assetów z CDN-a na samohostowanie (przy korzystaniu z
HTTP2 to może dać zwiększoną wydajność wzgłędem CDN);
</li>
<li>
konfiguracja nagłówka{' '}
<a href="https://developer.mozilla.org/pl/docs/Web/HTTP/Headers/Referrer-Policy">
Referrer-Policy
</a>{' '}
tak, aby nie ujawniać historii przeglądania właścicielom zasobów z
domen podmiotów trzecich.
</li>
</ul>
</>
)}
</>
);
}
}

View File

@ -1,114 +0,0 @@
import { RequestCluster } from '../../../request-cluster';
import { dataLocationToText, wordlist } from '../../../util';
import { ExplainerKey } from '../explainers';
import { v } from '../verbs';
import { Problem } from './problem';
export class UnknownPurposes extends Problem {
getNecessaryExplainers(): ExplainerKey[] {
const has_cookies = this.getAffectedClusters().some((cluster) => cluster.hasCookies());
if (has_cookies) {
return ['cookies_are_pii'];
} else {
return [];
}
}
isHostAffected(host: string) {
const answers = this.answers.hosts[host];
if (!answers) {
return false;
}
return (
['not_mentioned', 'not_before_making_a_choice'].includes(answers.present) &&
['no', 'not_sure'].includes(answers.was_processing_necessary) &&
(this.clusters[host].hasCookies() || this.clusters[host].exposesOrigin())
);
}
qualifies(): boolean {
return Object.keys(this.answers.hosts).some((host) => this.isHostAffected(host));
}
getAffectedClusters(): RequestCluster[] {
return Object.keys(this.answers.hosts)
.filter((host) => this.isHostAffected(host))
.map((host) => this.clusters[host]);
}
getEmailContent({ mode, tone }: { mode: 'email' | 'report'; tone: 'official' | 'polite' }) {
const _ = (key: string) => v(key, this.answers.zaimek);
const affected_clusters = this.getAffectedClusters();
const has_history = affected_clusters.some((cluster) => cluster.exposesOrigin());
const has_cookies = affected_clusters.some((cluster) => cluster.hasCookies());
return (
<>
<h2>Cele przetwarzania danych</h2>
<p>
Państwa strona{' '}
{mode == 'email'
? `ujawniła dane ${_('mnie')} dotyczące`
: 'ujawnia dane dotyczące użytkowników'}{' '}
w zakresie{' '}
{wordlist([
...(has_cookies ? ['treści plików cookies'] : []),
...(has_history
? [
mode === 'email'
? `części ${_('mojej')} historii przeglądania`
: `części historii przeglądania`,
]
: []),
])}{' '}
podmiotom, które właścicielami nastepujących domen:
</p>
<ul>
{affected_clusters.map((cluster, index) => {
const locations = cluster.exposesOriginWhere();
return (
<li>
<strong>{cluster.id}</strong>:{' '}
{wordlist([
...(cluster.hasCookies() ? ['treść plików cookies'] : []),
...(cluster.exposesOrigin()
? [
(mode === 'email'
? `część ${_('mojej')} historii przeglądania`
: `część historii przeglądania użytkownika`) +
' (' +
wordlist(
locations.map((l) => dataLocationToText(l))
) +
')',
]
: []),
])}
{index === affected_clusters.length - 1 ? '.' : ';'}
</li>
);
})}
</ul>
{mode === 'email' ? (
tone === 'official' ? (
<p>
Proszę o wskazanie, jakie cele takiego przetwarzania danych, które
mnie dotyczą.
</p>
) : (
<p>
Apeluję o umieszczenie informacji na temat na Państwa stronie, aby jej
użytkownicy mogli podejmować w pełni świadome wybory dotyczące
przetwarzania danych ich dotyczących.
</p>
)
) : (
<p>
<strong>Zalecenie</strong>: warto dodać informacje o tym, jakie cele
ujawniania wyżej opisanych danych wyżej opisanym podmiotom trzecim.
</p>
)}
</>
);
}
}

View File

@ -1,282 +0,0 @@
import { wordlist } from '../../../util';
import { ExplainerKey } from '../explainers';
import { v } from '../verbs';
import { Problem } from './problem';
export class UnlawfulCookieAccess extends Problem {
getNecessaryExplainers(): ExplainerKey[] {
return ['cookies_are_pii', 'responsibility_for_third_parties'];
}
qualifies(): boolean {
// są cookiesy, nie było zgody, nie są konieczne do działania strony
const cookie_clusters = Object.values(this.clusters).filter((c) => c.hasMarkedCookies());
return cookie_clusters.some((cluster) => {
const hostAnswers = this.answers.hosts[cluster.id];
return (
(hostAnswers.present == 'not_mentioned' ||
hostAnswers.present == 'not_before_making_a_choice' ||
['none', 'closed_popup', 'deny_all'].includes(this.answers.popup_action) ||
this.answers.popup_type === 'none') &&
hostAnswers.was_processing_necessary != 'yes'
);
});
}
getEmailContent({ mode, tone }: { mode: 'email' | 'report'; tone: 'official' | 'polite' }) {
const cookie_clusters = Object.values(this.clusters).filter((c) => c.hasMarkedCookies());
const unnecessary_hosts = Object.entries(this.answers.hosts)
.filter(([, answers]) => answers.was_processing_necessary === 'no')
.map(([host]) => host);
const maybe_unnecessary_hosts = Object.entries(this.answers.hosts)
.filter(([, answers]) => answers.was_processing_necessary === 'not_sure')
.map(([host]) => host);
const _ = (key: string) => v(key, this.answers.zaimek);
return (
<>
<h2>Dostęp do cookies niezgodny z ustawą Prawo Telekomunikacyjne</h2>
<p>
Państwa strona {mode == 'email' ? 'dokonała' : 'dokonuje'} odczytu plików Cookie
zapisanych na dysku twardym{' '}
{mode === 'email'
? _('mojego') + ' komputera.'
: 'komputerach użytkowników końcowych.'}
. Dotyczy to plików cookie przypisanych do domen:
</p>
<ul>
{cookie_clusters.map((cluster, index) => {
const names = cluster
.getMarkedEntries()
.filter((e) => e.source === 'cookie')
.map((e) => e.name);
return (
<li>
{cluster.id} ({names.length > 1 ? 'pliki' : 'plik'}{' '}
{names.map((name, index) => {
return (
<>
{index > 0 ? ', ' : ''}
{name}
</>
);
})}
){index === cookie_clusters.length - 1 ? '.' : ';'}
</li>
);
})}
</ul>
<p>
Zgodnie z treścią Art. 173.{' '}
<a href="https://isap.sejm.gov.pl/isap.nsf/download.xsp/WDU20041711800/U/D20041800Lj.pdf">
ustawy Prawo Telekomunikacyjne
</a>
, strona może pozyskać dostęp do treści plików cookies pod warunkiem spełnienia
jednego z następujących warunków:
</p>
<ol>
<li>
Użytkownik wyraził zgodę na takie przetwarzanie danych <em>po</em> tym, jak
został poinformowany bezpośrednio o celu uzyskania dostępu do tej
informacji. Zgodnie z Art. 174 ustawy Prawo Telekomunikacyjne, taka zgoda
musi spełniać warunki zgody ustalone przez RODO, aby mogła być jako podstawa
prawna uzyskania dostępu do cookies i podobnych technologii w przeglądarce;
</li>
<li>
Dostęp do treści plików cookies jest konieczny do dostarczania usługi
świadczonej drogą elektroniczną zażądanej przez użytkownika.
</li>
</ol>
{(() => {
if (this.answers.popup_type == 'none' || this.answers.popup_type == 'page') {
return mode === 'email' ? (
<p>
Jako, że strona nie pytała {_('mnie')} nigdy o zgodę, nie jest
spełniony warunek 1.
</p>
) : (
<p>
Strona nie ma zaimplementowanego mechanizmu pozyskiwania zgód, zatem
nie spełnia warunku opisanego w punkcie 1.
</p>
);
} else if (this.answers.popup_type === 'passive_popup') {
return (
<p>
{mode === 'email' ? (
<>
Państwa strona nie dała mi nigdy faktycznego wyboru
dotyczącego wyrażenia lub odmówienia zgody na takie
przetwarzanie danych osobowych. Aby zgoda była ważna w
świetle RODO, musi być dobrowolna. Brak możliwości
odmówienia zgody sprawia, że tak wyrażona zgoda nie jest
ważna w świetle RODO. Dlatego nie jest spełniony warunek 1.{' '}
</>
) : (
<>
Aktualnie zaimplementowane okienko o przetwarzaniu danych
osobowych nie daje użytkownikom końcowym możliwości odmowy
wyrażenia zgody, przez co tak wyrażona zgoda nie spełnia
warunku dobrowolności opisanego w motywie (32) RODO. Z tego
powodu nie jest spełniony warunek opisany w punkcie 1.
powyżej, zatem tak pozyskana "zgoda" nie może stanowić
podstawy prawnej dostępu do cookiesów użytkownika końcowego.
</>
)}{' '}
{this.answers.mentions_passive_consent ? (
<>
Należy nadmienić także, że zgody wyrażonej w sposób bierny
lub milczący nie można uznać za ważną w świetle
obowiązujących przepisów rozporządzenia 2016/679. Dlatego
zaniechanie zmiany ustawień przeglądarki lub po prostu
korzystanie ze strony nie stanowi ważnej zgody. Takie jest{' '}
<a href="https://assets.midline.pl/pisma/2021-12-16%20odpowiedz%20UODO%20na%20skarg%C4%99%20i(n)Secure.pdf">
stanowisko polskiego UODO
</a>
.
</>
) : (
''
)}
</p>
);
} else if (this.answers.popup_type === 'some_choice') {
if (this.answers.popup_action === 'none') {
return mode == 'email' ? (
<p>
Nie {_('wyraziłem')} zgody na takie przetwarzanie {_('moich')}{' '}
danych osobowych. W okienku pytającym o zgodę nic nie{' '}
{_('kliknąłem')}. Nie jest zatem spełniony warunek 1.
</p>
) : (
<p>
Skrypty pozyskujące dostęp do plików cookie uruchamiają się
zanim użytkownik końcowy zdąży wybrać jakąkolwiek opcję w
okienku pytającym o zgodę. Aby zgoda była ważna, musi być
pozyskana <strong>zanim</strong> nastąpi proces przetwarzania
danych, którego ta zgoda dotyczy. Z tego powodu nie jest
spełniony warunek 1. Nie można używać tak pozyskanej zgody
jako podstawy prawnej dostępu do plików cookies na urządzeniu
użytkownika końcowego.
</p>
);
} else if (this.answers.popup_action === 'closed_popup') {
return mode == 'email' ? (
<p>
Nie {_('wyraziłem')} zgody na takie przetwarzanie {_('moich')}{' '}
danych osobowych. {this.answers.popup_closed_how.trim()}
{this.answers.popup_closed_how.trim().at(-1) != '.'
? '.'
: ''}{' '}
Takiego działania nie można uznać za ważną zgodę na
przetwarzanie danych osobowych, gdyż nie spełnia warunku
jednoznaczności opisanego w Art. 4, pkt 11 RODO. Nie jest zatem
spełniony warunek 1.
</p>
) : (
<p>
Gdy użytkownik końcowy strony nie wyrazi jednoznacznej zgody w
wyskakującym okienku, a zamiast tego po prostu zamknie to
okienko, strona nadal pozyskuje dostęp do plików cookies na
urządzeniu użytkownika. Zamknięcia okienka (np. przyciskiem x)
nie można uznać za ważną zgodę, gdyż taka czyność nie spełnia
warunku jednoznaczności opisanego w Art. 4. pkt 11. RODO. Nie
jest zatem spełniony warunek 1.
</p>
);
} else if (this.answers.popup_action == 'deny_all') {
return mode == 'email' ? (
<p>
{this.answers.popup_deny_all_how.trim()}
{this.answers.popup_closed_how.trim().at(-1) != '.'
? '.'
: ''}{' '}
Zatem nie jest spełniony warunek 1.
</p>
) : (
<p>
Gdy użytkownik jednoznacznie odmówi zgód na wszystkie cele
przetwarzania, strona nadal pozyskuje dostęp do plików cookies
na urządzeniu użytkownika. Jeżeli uzytkownik nie odmówił zgody,
to nie powinny załączać się procesy przetwarzania powołujące się
na zgodę jako podstawę prawną.
</p>
);
}
}
})()}
{unnecessary_hosts.length > 0 ? (
mode == 'email' ? (
<p>
W {_('mojej')} ocenie odczytywanie przez Państwa stronę treści plików
cookies z {wordlist(unnecessary_hosts)} nie jest konieczne do
wyświetlenia treści Państwa strony, dlatego nie jest dla nich spełniony
warunek 2. Jeżeli według Państwa oceny jest inaczej, {_('proszę')} o
wskazanie, co jest źródłem tej konieczności i co odróżnia Państwa stronę
od wielu innych stron, które realizują te same funkcjonalności{' '}
<em>bez</em> korzystania z plików Cookie.
</p>
) : (
<p>
Warto, aby informacje na stronie opisywały w zrozumiały sposob, które z
podmiotów, których skrypty uruchamiają się na stronie (
{wordlist(unnecessary_hosts)}) konieczne do działania strony, jaki
zakres danych przetwarzają i w jakim celu.
</p>
)
) : (
''
)}
{mode == 'email' ? (
tone === 'official' ? (
<p>
{_('Proszę')} o wskazanie,{' '}
<strong>
czy być może stosowali Państwo inną podstawę prawną do takiego
przetwarzania {_('moich')} danych osobowych, czy być może
przetwarzali je Państwo bez ważnej podstawy prawnej?
</strong>
</p>
) : (
<p>
Apeluję o wdrożenie zmian na Państwa stronie tak, aby użytkownik miał
faktyczny wybór dotyczący procesów przetwarzania jego danych osobowych,
jakie zachodzą w trakcie odwiedzin tej strony.
</p>
)
) : (
<>
<p>
Jeżeli zgoda nadal ma być używana jako podstawa prawna do odczytu plików
cookies przez skrypty wyżej wymienionych podmiotów, to należy zmienić
mechanizm zgody tak, aby:{' '}
</p>{' '}
<ul>
<li>
dawał użytkownikowi końcowemu możliwość odmowy zgody w sposób równie
łatwy i dostępny, jak na wyrażenie zgody;
</li>
<li>
skrypty śledzące uruchamiały się dopiero po uzyskaniu ważnej zgody;
</li>
<li>
skrypty śledzące nie uruchamiały się, jeżeli użytkownik nie wyraził
na nie zgody.
</li>
</ul>
</>
)}
{maybe_unnecessary_hosts.length > 1 && mode == 'email' && tone == 'official' ? (
<p>
{_('Proszę')} też o wskazanie, czy dostęp do treści plików cookie z
{wordlist(maybe_unnecessary_hosts)} jest konieczny do poprawnego działania
strony? Jeżeli tak, to {_('proszę')} wskazać, w jaki sposób. Co sprawia, że
strona nie może działać bez nich?
</p>
) : (
''
)}
</>
);
}
}

View File

@ -1,20 +0,0 @@
import * as Survey from 'survey-react';
import { RequestCluster } from '../../request-cluster';
import RawAnswers from './raw-answers';
import useSurvey from './use-survey';
export default function Questions({
clusters,
onComplete,
}: {
clusters: RequestCluster[];
onComplete: (data: RawAnswers) => void;
}) {
const survey = useSurvey(clusters, {
onComplete: (sender) => onComplete(sender.data),
});
if (!survey) {
return <div>Wczytywanie...</div>;
}
return <Survey.Survey model={survey} />;
}

View File

@ -1,62 +0,0 @@
export type HostRawAnswers = {
[key: `${string}|present`]:
| 'not_mentioned'
| 'not_before_making_a_choice'
| 'mentioned_in_policy'
| 'mentioned_in_popup';
[key: `${string}|legal_basis_type`]: 'consent' | 'legitimate_interest' | 'not_mentioned';
[key: `${string}|consent`]:
| 'claims_consent_but_sends_before_consent'
| 'claims_consent_but_there_was_no_easy_refuse'
| 'none';
[key: `${string}|legitimate_interest_activity_specified`]: 'precise' | 'vague' | 'no';
[key: `${string}|legitimate_interest_description`]: string;
[key: `${string}|outside_eu`]: 'yes' | 'no' | 'not_sure';
};
export type BasicRawAnswers = {
zaimek: 0 | 1 | 2 | 3;
user_role: 'user' | 'admin';
email_type: 'polite_information' | 'official_request';
is_incognito_different: [] | ['incognito_is_the_same'];
policy_readable: 'yes' | 'vague' | 'cant_find';
popup_action: 'none' | 'closed_popup' | 'accept_all' | 'deny_all' | 'other';
popup_closed_how: string;
popup_deny_all_how: string;
} & (
| ({
popup_type: 'passive_popup';
cookie_wall: 'yes' | 'no';
rejection_is_hard: undefined;
administrator_identity_available_before_choice: undefined;
} & (
| {
mentions_passive_consent?: 'yes';
passive_consent_description: string;
}
| {
mentions_passive_consent?: 'no';
passive_consent_description: undefined;
}
))
| {
popup_type: 'some_choice';
rejection_is_hard: 'yes' | 'no';
administrator_identity_available_before_choice: 'yes' | 'no';
cookie_wall: undefined;
passive_consent_description: undefined;
mentions_passive_consent: undefined;
}
| {
popup_type: 'none' | 'page';
cookie_wall: undefined;
passive_consent_description: undefined;
mentions_passive_consent: undefined;
rejection_is_hard: undefined;
administrator_identity_available_before_choice: undefined;
}
);
type RawAnswers = BasicRawAnswers & HostRawAnswers;
export default RawAnswers;

View File

@ -1,3 +0,0 @@
export function reportIntro(visited_url: string) {
return <h2>Analiza skryptów śledzących na {visited_url} - raport</h2>;
}

View File

@ -1,38 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Rentgen - generowanie raportu</title>
<link
rel="stylesheet"
href="/lib/styles/fonts.css"
>
<link
rel="stylesheet"
href="/node_modules/survey-react/survey.min.css"
/>
<link
rel="stylesheet"
href="/node_modules/survey-react/modern.min.css"
/>
<link
rel="stylesheet"
href="/lib/components/report-window/report-window.css"
/>
<link
rel="shortcut icon"
href="../../../assets/icon-addon.svg"
type="image/x-icon"
>
</head>
<body>
<div id="app"></div>
<script src="/node_modules/react/umd/react.production.min.js"></script>
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
<script src="/node_modules/survey-react/survey.react.min.js"></script>
<script src="/lib/components/report-window/report-window.js"></script>
</body>
</html>

View File

@ -1,308 +0,0 @@
@import './../../styles/colors.scss';
* {
box-sizing: border-box;
font-family: 'OpenSans' !important;
}
#app {
min-height: 100vh;
display: flex;
flex-flow: column;
}
#main-section {
flex-grow: 1;
margin-bottom: 20px; // to contain diag section
}
html {
font-size: 1rem;
}
body {
background-color: #f9f9fa;
padding: 0rem 0.75rem;
margin: 0;
}
nav {
position: sticky;
top: 0;
display: flex;
flex-wrap: wrap;
justify-content: left;
align-items: center;
padding: 1rem 1rem;
border-bottom: 2px solid $ultra-light-grey;
height: 5rem;
img {
margin-right: 0.5rem;
}
}
p,
li,
h1,
h2,
h3 {
max-width: 100ex;
}
h1 {
font-size: 1.1rem;
}
.header {
display: grid;
grid-template-columns: 1.75rem 1fr;
align-items: center;
max-height: 3.5rem;
min-height: 3.5rem;
position: sticky;
top: 0;
z-index: 1;
user-select: none;
.webpage-metadata {
word-break: break-all;
display: flex;
flex-flow: column;
flex-wrap: nowrap;
font-size: 0.875rem;
font-weight: 600;
justify-content: center;
padding-left: 1rem;
color: #000;
&--hyperlink {
font-weight: 400;
color: $ultra-black-color;
max-height: 2rem;
overflow: hidden;
}
}
}
.sv_main {
font-family: 'OpenSans' !important;
background-color: transparent;
.sv_p_root {
max-width: 100ex;
margin: 0 auto;
& > .sv_row:nth-child(2n) {
background-color: #fff;
}
& > .sv_row:nth-child(2n + 1) {
background-color: #fff;
}
& > .sv_row {
border-bottom: none;
background-color: #fff;
box-shadow: rgba(12, 12, 13, 0.1) 0px 1px 4px 0px;
}
& > .sv_row:last-child {
border-bottom: none;
}
}
.sv_container {
color: rgb(12, 12, 13);
padding: 0;
.sv_body {
padding: 0;
.sv_nav {
display: flex;
}
.sv_p_root {
& > .sv_row {
padding: 0.75rem 1.5rem;
margin-bottom: 1rem;
border-radius: 3px;
}
.sv_page_title {
font-weight: bold;
font-size: calc(15 / 16 * 1rem);
}
.sv_q {
padding: 0;
}
}
.sv_progress {
height: 0.25rem;
.sv_progress_bar {
margin-top: 0;
margin-bottom: 0.5rem;
}
}
}
}
.sv_body {
border: none !important;
background-color: transparent;
}
.sv_progress {
background-color: hsl(240, 9.1%, 87.8%);
margin-bottom: 4rem;
transition: all 200ms;
transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
& > span {
font-weight: 600;
}
}
.sv_progress_bar {
background-color: #000;
transition: all 200ms;
transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
}
}
.sv_main .sv_container .sv_body .sv_p_root .sv_page_title {
font-size: 1.1rem;
font-weight: bold;
}
.sv_q_radiogroup {
margin-top: 0.25rem;
}
.sv_main .sv_q_other input,
.sv_main .sv_q_text_root,
.sv_main .sv_q_dropdown_control,
.sv_main
input:not([type='button']):not([type='reset']):not([type='submit']):not([type='image']):not([type='checkbox']):not([type='radio']),
.sv_main select,
.sv_main textarea {
border: 1px solid #6d7072;
color: #000;
padding-left: 0.25rem !important;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.sv_q_radiogroup_label {
cursor: pointer;
}
.sv_nav {
display: flex;
margin: 2rem 0;
justify-content: center;
}
.sv_prev_btn,
.sv_next_btn,
.sv_complete_btn {
border: 0;
outline: 0;
font-size: 0.875rem !important;
line-height: 0.875rem !important;
height: 2.5rem;
cursor: pointer;
min-width: 100px;
}
.sv_next_btn,
.sv_complete_btn {
background-color: #000 !important;
font-weight: 800 !important;
padding: 0 1.5rem;
background-color: #000;
margin: 0 !important;
color: #fff !important;
&:hover {
color: $icd-rentgen-color !important;
background-image: linear-gradient(
to right,
$icd-rentgen-color 0%,
$icd-rentgen-color 4%,
#000 4%,
#000 100%
);
animation: slidebg 1s cubic-bezier(0.19, 1, 0.22, 1) infinite;
}
@keyframes slidebg {
to {
background-position: 155px;
}
}
}
.sv_prev_btn {
margin-right: 0.5rem !important;
color: #000 !important;
text-decoration: underline !important;
background-color: transparent !important;
font-weight: 700 !important;
}
.sv_main .sv_q_erbox:not([style*='display: none']):not([style*='display:none']) {
color: $dark-red;
}
.sv_main .sv_q_erbox:not([style*='display: none']):not([style*='display:none']) {
border: 1px solid $dark-red;
background-color: $pale-red;
}
.sv_main
.sv_container
.sv_body
.sv_p_root
.sv_q
.sv_q_erbox:not([style*='display: none']):not([style*='display:none']) {
margin: 0.5rem 0;
padding: 1rem;
}
.sv_qstn fieldset {
margin: 0px;
padding: 0px;
font-size: calc(14 / 16 * 1rem);
}
.sv_main .sv_custom_header {
background-color: transparent;
}
.sv_main .sv_q_other input:focus,
.sv_main .sv_q_text_root:focus,
.sv_main .sv_q_dropdown_control:focus,
.sv_main
input:not([type='button']):not([type='reset']):not([type='submit']):not([type='image']):not([type='checkbox']):not([type='radio']):focus,
.sv_main select:focus,
.sv_main textarea:focus {
border: 1px solid #000;
}
.sv_q_title,
.sv_main .sv_container .sv_body .sv_p_root .sv_q_title {
font-weight: 600;
font-size: calc(14 / 16 * 1rem);
}
.generator-container {
max-width: 100ex;
margin: 0 auto;
font-size: calc(14 / 16 * 1rem);
margin-top: 3rem;
a {
color: $ultra-black-color;
}
}
.diag-toolbox {
position: fixed;
bottom: 10px;
left: 10px;
}

View File

@ -1,122 +0,0 @@
import React, { Fragment } from 'react';
import ReactDOM from 'react-dom';
import { getMemory } from '../../memory';
import { useEmitter } from '../../util';
import './report-window.scss';
import Questions from './questions';
import EmailContent from './email-content';
import { parseAnswers, ParsedAnswers } from './parse-answers';
import ScreenshotGenerator from './screenshot-generator';
function downloadFiles(link: string) {
let a = document.createElement('a');
a.setAttribute('href', link);
a.setAttribute('download', '');
a.setAttribute('target', '_blank');
a.click();
}
function Report() {
try {
const url = new URL(document.location.toString());
const origin = url.searchParams.get('origin');
if (!origin) {
return <div>Błąd: brak parametru "origin"</div>;
}
const [counter] = useEmitter(getMemory());
const rawAnswers = url.searchParams.get('answers');
const [answers, setAnswers] = React.useState<ParsedAnswers>(
rawAnswers ? JSON.parse(rawAnswers) : null
);
const [mode, setMode] = React.useState(url.searchParams.get('mode') || 'survey');
const [scrRequestPath, setScrRequestPath] = React.useState('');
const clusters = getMemory().getClustersForOrigin(origin || '');
React.useEffect(() => {
if (!origin) return;
const url = new URL(document.location.toString());
url.searchParams.set('origin', origin);
url.searchParams.set('answers', JSON.stringify(answers));
url.searchParams.set('mode', mode);
history.pushState({}, 'Rentgen', url.toString());
}, [mode, answers, origin]);
const visited_url = Object.values(clusters)
.sort((a, b) => (a.lastModified > b.lastModified ? -1 : 1))
.find((cluster) => !!cluster.lastFullUrl)?.lastFullUrl;
if (!visited_url) {
return <div>Wczytywanie...</div>;
}
const result = (
<div {...{ 'data-version': counter }}>
{mode === 'survey' ? (
<Questions
clusters={Object.values(clusters).filter(
(cluster) => cluster.getMarkedRequests().length > 0
)}
onComplete={(answers) => {
setAnswers(parseAnswers(answers));
setMode('screenshots');
}}
></Questions>
) : (
''
)}
{mode === 'screenshots' ? (
<ScreenshotGenerator
{...{
visited_url,
clusters,
setReportWindowMode: setMode,
setRequestPath: setScrRequestPath,
downloadFiles: downloadFiles,
user_role: answers.user_role,
}}
/>
) : (
''
)}
{mode === 'preview' ? (
<EmailContent
{...{
answers,
visited_url,
clusters,
scrRequestPath,
downloadFiles: downloadFiles,
user_role: answers.user_role,
}}
/>
) : (
''
)}
</div>
);
return (
<Fragment>
<header className="header">
<img src="../../assets/icon-addon.svg" height={32}></img>
<div className="webpage-metadata">
{origin ? (
<>
<span>Generowanie raportu </span>
<span className="webpage-metadata--hyperlink">{origin}</span>
</>
) : (
<span>Przejdź do wybranej strony internetowej</span>
)}
</div>
</header>
<section id="main-section">{result}</section>
</Fragment>
);
} catch (e) {
console.error(e);
return <div>ERROR! {JSON.stringify(e)}</div>;
}
}
ReactDOM.render(<Report />, document.getElementById('app'));

View File

@ -1,126 +0,0 @@
@import './../../styles/colors.scss';
h1 {
font-size: 1.1rem;
margin-bottom: calc(24 / 16 * 1rem);
}
h2 {
font-weight: 600;
font-size: 0.875rem;
}
.images {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
width: 100%;
grid-gap: 1rem;
margin: 2rem 0 1rem;
max-height: 45vh;
overflow-y: scroll;
overflow-x: clip;
z-index: 1;
position: relative;
}
.buttons-container {
display: flex;
justify-content: center;
margin: 2rem 0;
padding: 1em 0;
}
.container {
padding: 0.75rem 1.5rem;
margin-bottom: 1rem;
border-radius: 3px;
box-shadow: rgba(12, 12, 13, 0.1) 0px 1px 4px 0px;
background-color: #fff;
}
.browser {
height: 9.267rem;
font-weight: 800 !important;
color: $disabled-grey !important;
border: 1px solid $disabled-grey;
background: linear-gradient(to bottom, $icd-rentgen-color 20%, #fff 20%, #fff 100%);
background-size: 100%;
background-position-y: 26.5px;
&--filled {
background-size: 100%;
background-position-y: 26.5px;
animation: none;
&--address-bar {
border: 1px solid #8a949f;
height: 1rem;
width: 10rem;
font-size: 0.667rem;
font-weight: 400;
padding: 0 0.25rem;
color: #000;
overflow: hidden;
word-break: normal;
inline-size: 10rem;
text-overflow: ellipsis;
background: linear-gradient(to left, $icd-rentgen-color 20%, #fff 20%, #fff 100%);
animation: xray-header 2s cubic-bezier(0, 1.43, 0.39, 1.43) infinite;
}
}
@keyframes xray {
to {
background-position-y: 11.1rem;
}
}
@keyframes xray-header {
to {
background-position-x: 11.1rem;
}
}
&__header {
height: 1.667rem;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
background-color: #fff;
padding: 0 0.5rem;
font-size: 1.25rem;
border-bottom: 1px solid $disabled-grey;
&--in_progress {
.browser__header--address-bar {
background: linear-gradient(to left, $icd-rentgen-color 20%, #fff 20%, #fff 100%);
animation: xray-header 2s cubic-bezier(0, 1.43, 0.39, 1.43) infinite;
}
}
&--address-bar {
border: 1px solid #8a949f;
height: 1rem;
width: 10rem;
font-size: 0.667rem;
font-weight: 400;
padding: 0 0.25rem;
color: #000;
overflow: hidden;
word-break: normal;
inline-size: 10rem;
text-overflow: ellipsis;
}
&--controls {
padding-bottom: 0.25rem;
font-weight: 900;
}
}
&__content {
height: 6.667rem;
}
}

View File

@ -1,260 +0,0 @@
import React, { Fragment } from 'react';
import { RequestCluster } from '../../request-cluster';
import './screenshot-generator.scss';
const SS_URL = 'https://screenshot-service.internet-czas-dzialac.pl';
enum taskState {
WAITING = 'waiting',
RUNNING = 'running',
FINISHED = 'finished',
}
type Screenshot = {
url: string;
thumb_url: string;
domain: string;
filename: string;
found_headers: string[];
};
interface screenshotTask {
domains: string[];
elapsed_time_s: number;
current_action: string;
finished_time: number;
id: string;
images: Screenshot[];
jobs_ahead: number;
output: string;
processing_took: number;
request_time: number;
started_time: number;
status: taskState;
url: string;
waiting_took: number;
zip_url: string;
preview: string;
}
function createTaskEndpoint(visited_url: string, domains: string[]) {
return `${SS_URL}/api/requests?url=${encodeURIComponent(visited_url)}${domains.reduce(
(prev: string, curr: string) => prev + '&domains[]=' + curr,
''
)}`;
}
function createTask(visited_url: string, domains: string[]) {
return fetch(createTaskEndpoint(visited_url, domains), { method: 'POST' });
}
function pollTask(path: string): Promise<Response> {
return fetch(path, { method: 'GET' });
}
export default function ScreenshotGenerator({
visited_url,
clusters,
setReportWindowMode,
setRequestPath,
downloadFiles,
user_role,
}: {
visited_url: string;
clusters: Record<string, RequestCluster>;
setReportWindowMode: Function;
setRequestPath: Function;
downloadFiles: Function;
user_role: string;
}) {
const [mode, setMode] = React.useState<string>('idle');
const [images, setImages] = React.useState<Screenshot[]>([]);
const [taskId, setTaskId] = React.useState<string | null>(null);
const [output, setOutput] = React.useState<any>({});
const [currentAction, setCurrentAction] = React.useState<string>('');
const [preview, setPreview] = React.useState<string>('');
const [lastPreview, setLastPreview] = React.useState<string>('');
async function subscribeTask(path: string): Promise<screenshotTask> {
let response = { status: taskState.WAITING };
let last_preview = '';
while (response.status === taskState.WAITING || response.status === taskState.RUNNING) {
await new Promise((resolve) => setTimeout(resolve, 1000));
response = await (await pollTask(path)).json();
setImages((response as screenshotTask)?.images);
setCurrentAction((response as screenshotTask)?.current_action);
setLastPreview(last_preview);
setPreview((response as screenshotTask)?.preview);
last_preview = (response as screenshotTask)?.preview;
document.querySelector('.images')?.scrollTo({
top: document.querySelector('.images')?.scrollHeight,
behavior: 'smooth',
});
}
if (response.status === taskState.FINISHED) {
setMode('finished');
}
return response as screenshotTask;
}
return (
<div className="generator-container">
{mode === 'idle' ? (
<Fragment>
<h1>Przygotowanie zrzutów ekranów</h1>
<div className="container">
<h2>Notka informacyjna</h2>
<img
src="/assets/doctor_welcome.png"
style={{
width: '100%',
maxWidth: '360px',
float: 'right',
position: 'relative',
top: '-10px',
}}
/>
<Fragment>
<p>
W celu udokumentowania procesów przetwarzania danych, jakie wykryła
nasza wtyczka na tej stronie, warto wykonać zrzuty ekranu, na
których widać przeglądarkę z otwartymi narzędziami deweloperskimi,
ukazując wybrane elementy ruchu sieciowego generowanego przez
stronę.
</p>
<p>Jeżeli chcesz, wtyczka Rentgen może wygenerować je za Ciebie.</p>
<p>
Uwaga: aby to zrobić, adres aktualnie odwiedzonej podstrony
analizowanej witryny będzie wysłany na nasz serwer, aby na nim
odwiedzić podstronę i wykonać zrzuty ekranu.
</p>
<p>
Serwer, na którym jest wykonywana analiza należy do inicjatywy{' '}
<a href="https://www.internet-czas-dzialac.pl/contact/">
<i>Internet. Czas działać!</i>
</a>
. Zebrane dane nie wysyłane do żadnych podmiotów trzecich i
usuwane z serwera po 24 godzinach. Wysłanie na serwer informacji o
adresie przeglądanej strony jest konieczne, aby wykonać te zrzuty
ekranu w sposób automatyczny. Jeżeli nie chcesz korzystać z opcji
automatycznej, zachęcamy do wykonania zrzutów ekranu samodzielnie.
</p>
</Fragment>
</div>
<div className="buttons-container">
<button
className="sv_prev_btn"
onClick={() => {
setReportWindowMode('preview');
setRequestPath(null);
}}
>
Pomiń
</button>
<button
className="sv_next_btn"
onClick={async () => {
setMode('in_progress');
const task = await createTask(
visited_url,
Object.values(clusters)
.filter((cluster) => cluster.hasMarks())
.map((cluster) => cluster.id)
);
const urlArr = task.url.split('/');
setTaskId(urlArr[urlArr.length - 1]);
const response = await subscribeTask(task.url);
setImages(response.images);
setLastPreview(preview);
setPreview(response.preview);
setOutput(response);
setRequestPath(response.zip_url);
}}
>
Wygeneruj
</button>
</div>
</Fragment>
) : null}
{mode === 'in_progress' || mode === 'finished' ? (
<Fragment>
<h1>Przygotowanie zrzutów ekranów</h1>
<div className="container">
{mode === 'in_progress' ? (
<Fragment>
<h2>To może chwilkę zająć...</h2>
<p>
Nasz serwer właśnie odwiedza wskazaną przez Ciebie stronę
i przygotowuje zrzuty ekranów narzędzi deweloperskich.
</p>
<div>{currentAction}</div>
</Fragment>
) : null}
{mode === 'finished' ? (
<Fragment>
<h2>Gotowe!</h2>
<p>Zrzuty ekranów narzędzi deweloperskich gotowe do pobrania.</p>
</Fragment>
) : null}
<div className="images">
{mode === 'in_progress' ? (
<div
className="browser"
style={{
backgroundImage: `url(${SS_URL}${preview})${
lastPreview ? `, url(${SS_URL}${lastPreview})` : ''
}`,
}}
>
<div className="browser__header browser__header--in_progress">
<div className="browser__header--address-bar"></div>
<div className="browser__header--controls">···</div>
</div>
<div className="browser__content"></div>
</div>
) : null}
{images.map((screenshot) => {
return (
<div
key={`${taskId}_${screenshot.url}`}
className="browser browser--filled"
style={{
backgroundImage: `url(${SS_URL}${screenshot.thumb_url})`,
}}
>
<div className="browser__header">
<div className="browser__header--address-bar">
🕸 {screenshot.domain}
</div>
<div className="browser__header--controls">···</div>
</div>
<div className="browser__content"></div>
</div>
);
})}
</div>
</div>
<div className="buttons-container">
{mode === 'finished' ? (
<Fragment>
<button
className="sv_next_btn"
onClick={() => {
downloadFiles(`${SS_URL}${output.zip_url}`);
setReportWindowMode('preview');
}}
>
Pobierz zrzuty ekranów i przejdź dalej
</button>
</Fragment>
) : null}
</div>
</Fragment>
) : null}
</div>
);
}

View File

@ -1,29 +0,0 @@
import * as React from 'react';
import * as Survey from 'survey-react';
import { RequestCluster } from '../../request-cluster';
import generateSurveyQuestions from './generate-survey-questions';
import RawAnswers from './raw-answers';
import verbs, { v } from './verbs';
export default function useSurvey(
clusters: RequestCluster[],
{ onComplete }: { onComplete: (sender: { data: RawAnswers }) => void }
): Survey.ReactSurveyModel | null {
const [survey, setSurvey] = React.useState<Survey.Model | null>(null);
React.useEffect(() => {
const model = generateSurveyQuestions(clusters);
const survey = new Survey.Model(model);
survey.onProcessTextValue.add(function (
sender: Survey.SurveyModel,
options: { name: string; value?: string }
) {
if (verbs[options.name.toLowerCase()]) {
options.value = v(options.name, sender.valuesHash.zaimek);
}
});
survey.onComplete.add(onComplete);
setSurvey(survey);
}, []);
return survey;
}

View File

@ -1,53 +0,0 @@
const words = {
ciebie: ['ciebie', 'ciebie', 'ciebie', 'was'],
chciałbym: ['chciałbym', 'chciałabym', 'chciałobym', 'chcielibyśmy'],
dokonałeś: ['dokonałeś', 'dokonałaś', 'dokonałoś', 'dokonaliście'],
jesteś: ['jesteś', 'jesteś', 'jesteś', 'jesteście'],
kliknąłem: ['kliknąłem', 'kliknęłam', 'klinkęłom', 'kliknęliśmy'],
mam: ['mam', 'mam', 'mam', 'mamy'],
masz: ['masz', 'masz', 'masz', 'macie'],
mnie: ['mnie', 'mnie', 'mnie', 'nas'],
moich: ['moich', 'moich', 'moich', 'naszych'],
moje: ['moje', 'moje', 'moje', 'nasze'],
mojego: ['mojego', 'mojego', 'mojego', 'naszego'],
moja: ['moja', 'moja', 'moja', 'nasza'],
mojej: ['mojej', 'mojej', 'mojej', 'naszej'],
muszę: ['muszę', 'muszę', 'muszę', 'musimy'],
odkliknąłeś: ['odkliknąłeś', 'odkliknęłaś', 'odklikęłoś', 'odkliknęliście'],
odmówiłem: ['odmówiłem', 'odmówiłam', 'odmówiłom', 'odmówiliśmy'],
odmówiłeś: ['odmówiłeś', 'odmówiłaś', 'odmówiłoś', 'odmówiliście'],
odwiedzałeś: ['odwiedzałeś', 'odwiedzałaś', 'odwiedzałoś', 'odwiedzaliście'],
odwiedziłem: ['odwiedziłem', 'odwiedziłam', 'odwiedziłom', 'odwiedziliśmy'],
odznaczyłem: ['odznaczyłem', 'odznaczyłam', 'odznaczyłom', 'odznaczyliśmy'],
otwórz: ['otwórz', 'otwórz', 'otwórz', 'otwórzcie'],
podjąłem: ['podjąłem', 'podjęłam', 'podjęłom', 'podjęliśmy'],
podjąłeś: ['podjąłeś', 'podjęłaś', 'podjęłoś', 'podjęliście'],
proszę: ['proszę', 'proszę', 'proszę', 'prosimy'],
szukałem: ['szukałem', 'szukałam', 'szukałom', 'szukaliśmy'],
tobie: ['tobie', 'tobie', 'tobie', 'wam'],
twoich: ['twoich', 'twoich', 'twoich', 'waszych'],
twojej: ['twojej', 'twojej', 'twojej', 'waszej'],
usuń: ['usuń', 'usuń', 'usuń', 'usuńcie'],
widzę: ['widzę', 'widzę', 'widzę', 'widzimy'],
widziałem: ['widziałem', 'widziałam', 'widziałom', 'widzieliśmy'],
widzisz: ['widzisz', 'widzisz', 'widzisz', 'widzicie'],
wykonaj: ['wykonaj', 'wykonaj', 'wykonaj', 'wykonajcie'],
wyraziłem: ['wyraziłem', 'wyraziłam', 'wyraziłom', 'wyraziliśmy'],
wyraziłeś: ['wyraziłeś', 'wyraziłaś', 'wyraziłoś', 'wyraziliście'],
zamknąłem: ['zamknąłem', 'zamknęłam', 'zamknęłom', 'zamknęliśmy'],
zobacz: ['zobacz', 'zobacz', 'zobacz', 'zobaczcie'],
zamknąłeś: ['zamknąłeś', 'zamknęłaś', 'zamknęłoś', 'zamknęliście'],
znalazłem: ['znalazłem', 'znalazłam', 'znalazłom', 'znaleźliśmy'],
zrobiłem: ['zrobiłem', 'zrobiłam', 'zrobiłom', 'zrobiliśmy'],
zwracam: ['zwracam', 'zwracam', 'zwracam', 'zwracamy'],
} as { [key: string]: string[] };
export default words;
export function v(key: string, index: number) {
let result = words[key.toLowerCase()]?.[index] || key;
if (key[0] == key[0].toUpperCase()) {
result = [result[0].toUpperCase(), ...result.slice(1)].join('');
}
return result;
}

View File

@ -1,31 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Rentgen - analiza strony</title>
<link
rel="stylesheet"
href="/lib/styles/global.css"
>
<link
rel="stylesheet"
href="/lib/components/sidebar/sidebar.css"
>
<link
rel="shortcut icon"
href="../../assets/icon-addon.svg"
type="image/x-icon"
>
</head>
<body>
<div id="app"></div>
<script src="/node_modules/react/umd/react.production.min.js"></script>
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
<script src="/lib/components/sidebar/sidebar.js"></script>
</body>
</html>

View File

@ -1,237 +0,0 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { getMemory } from '../../memory';
import Options from '../../options';
import { useEmitter } from '../../util';
import './../../styles/global.scss';
import './sidebar.scss';
import { StolenData } from './stolen-data';
const Sidebar = () => {
const url = new URL(document.location.toString());
const origin = url.searchParams.get('origin');
const [minValueLength, setMinValueLength] = React.useState<number | null>(
localStorage.getItem('minValueLength') === null
? 7
: (localStorage.getItem('minValueLength') as unknown as number)
);
const [cookiesOnly, setCookiesOnly] = React.useState<boolean>(false);
const [stolenDataView, setStolenDataView] = React.useState<boolean>(true);
const [cookiesOrOriginOnly, setCookiesOrOriginOnly] = React.useState<boolean>(false);
const [eventCounts] = useEmitter(getMemory());
const [_, setMarksOccurrence] = React.useState<boolean>(false);
const [infoDataDialogAck, setInfoDataDialogAck] = React.useState<boolean>(
localStorage.getItem('infoDataDialogAck') === null
? true
: localStorage.getItem('infoDataDialogAck') == 'true'
? true
: false
);
const [warningDataDialogAck, setWarningDataDialogAck] = React.useState<boolean>(
localStorage.getItem('warningDataDialogAck') === null
? true
: localStorage.getItem('warningDataDialogAck') == 'true'
? true
: false
);
const [detailsVisibility, setDetailsVisibility] = React.useState<boolean>(
localStorage.getItem('detailsVisibility') === null
? false
: localStorage.getItem('detailsVisibility') == 'true'
? true
: false
);
React.useEffect(() => {
if (!origin) return;
for (const cluster of Object.values(getMemory().getClustersForOrigin(origin))) {
if (cluster.hasMarks()) {
return setMarksOccurrence(true);
}
}
return setMarksOccurrence(false);
}, [eventCounts['*']]);
if (!origin) return <div>Błąd: Brak parametru "origin"</div>;
return (
<div className="sidebar">
<header className="header">
<img src="../../assets/icon-addon.svg" height={32}></img>
<div className="webpage-metadata">
{origin ? (
<>
<span>Analiza strony</span>
<span className="webpage-metadata--hyperlink">{origin}</span>
</>
) : (
<span>Przejdź do wybranej strony internetowej</span>
)}
</div>
<button
className="button button--report"
onClick={() => {
window.open(
`/components/report-window/report-window.html?origin=${origin}`,
'new_tab'
);
}}
>
Generuj raport
</button>
</header>
{stolenDataView ? (
<nav>
<button
onClick={() => {
window.open(
`/components/report-window/report-window.html?origin=${origin}`,
'new_tab'
);
}}
>
<img src="/assets/icons/report.svg" width="20" height="20" />
<span>Generuj raport</span>
</button>
<button
onClick={() => {
setDetailsVisibility(!detailsVisibility);
}}
>
<img
src={
detailsVisibility
? '/assets/icons/file_minus.svg'
: '/assets/icons/file_find.svg'
}
width="20"
height="20"
/>
<span>
{detailsVisibility ? 'Ukryj szczegóły' : 'Wyświetlaj szczegóły'}
</span>
</button>
<button onClick={() => setStolenDataView(!stolenDataView)}>
<img src="/assets/icons/settings.svg" width="20" height="20" />
<span>Ustawienia</span>
</button>
{localStorage.getItem('blottingBrowser') ===
'nikttakniesplamitwojejprzeglądarkijakspidersweb' ? (
<button
onClick={() => {
if (
window.confirm(
'Czy chcesz wczytać wszystkie domeny w celu „splamienia” twojej przeglądarki? Uwaga przeglądarka może zablokować otwieranie nowych kart. (Ten krok jest opcjonalny)'
)
) {
let deep_copy = JSON.parse(
JSON.stringify(
Object.values(
getMemory().getClustersForOrigin(origin)
).map((domain) => domain.id)
)
);
for (const domain of deep_copy) {
window.open(`https://${domain}`);
}
}
}}
>
<img src="/assets/icons/bulb.svg" width="20" height="20" />
<span>Odwiedź wszystkie domeny</span>
</button>
) : null}
</nav>
) : null}
<section>
{stolenDataView ? (
<>
{infoDataDialogAck ? (
<section className="dialog-container dialog-container--info">
<span>
<strong>
Rentgen automatycznie zaznacza wybrane domeny na podstawie
zebranych danych.
</strong>{' '}
Możesz teraz przejść do generowania raportu lub dokonać korekty.
</span>
<button
onClick={() => {
setInfoDataDialogAck(false);
localStorage.setItem(
'infoDataDialogAck',
false as unknown as string
);
}}
>
<img src="/assets/icons/close_big.svg" width="16" height="16" />
</button>
</section>
) : null}
{warningDataDialogAck ? (
<section className="dialog-container dialog-container--warning">
<span>
<strong>Uwaga!</strong> Niekoniecznie każda przesłana poniżej
informacja jest daną osobową. Niektóre z podanych domen mogą
należeć do właściciela strony i nie reprezentować podmiotów
trzecich.
</span>
<button
onClick={() => {
setWarningDataDialogAck(false);
localStorage.setItem(
'warningDataDialogAck',
false as unknown as string
);
}}
>
<img src="/assets/icons/close_big.svg" width="16" height="16" />
</button>
</section>
) : null}
<StolenData
origin={origin}
eventCounts={eventCounts}
minValueLength={minValueLength === null ? 7 : minValueLength}
cookiesOnly={cookiesOnly}
cookiesOrOriginOnly={cookiesOrOriginOnly}
detailsVisibility={detailsVisibility}
/>
</>
) : (
<Options
minValueLength={minValueLength === null ? 7 : minValueLength}
setMinValueLength={setMinValueLength}
cookiesOnly={cookiesOnly}
setCookiesOnly={setCookiesOnly}
cookiesOrOriginOnly={cookiesOrOriginOnly}
setCookiesOrOriginOnly={setCookiesOrOriginOnly}
warningDataDialogAck={warningDataDialogAck}
setWarningDataDialogAck={setWarningDataDialogAck}
detailsVisibility={detailsVisibility}
setDetailsVisibility={setDetailsVisibility}
setStolenDataView={setStolenDataView}
removeCookies={() => {
getMemory().removeCookiesFor(origin);
getMemory().emit('change', origin);
setMarksOccurrence(false);
}}
removeRequests={() => {
getMemory().removeRequestsFor(origin);
getMemory().emit('change', origin);
setMarksOccurrence(false);
}}
/>
)}
</section>
</div>
);
};
ReactDOM.render(<Sidebar />, document.getElementById('app'));

View File

@ -1,198 +0,0 @@
import React from 'react';
import { getMemory } from '../../memory';
import { StolenDataEntry } from '../../stolen-data-entry';
import { useEmitter } from '../../util';
import './stolen-data-cluster.scss';
function StolenDataValue({ entry }: { entry: StolenDataEntry; prefixKey?: string }) {
const [version] = useEmitter(entry);
let body = null;
if (!entry.value) {
body = <></>;
} else {
body = <div data-version={version}>{entry.value}</div>;
}
return (
<td
className="value"
onClick={(e) => {
entry.toggleMark();
getMemory().emit('change', entry.request.shorthost);
e.stopPropagation();
}}
title={entry.value}
>
{body}
</td>
);
}
function StolenDataRow({ entry }: { entry: StolenDataEntry }) {
const [version] = useEmitter(entry);
return (
<tr
data-key={entry.id}
data-version={version}
className={`${entry.isMarked ? 'toggled' : 'untoggled'}`}
>
<td className="checkbox">
<input
type="checkbox"
checked={entry.isMarked}
id={entry.id.toString()}
onChange={() => {
entry.toggleMark();
getMemory().emit('change', entry.request.shorthost);
}}
/>
</td>
<th title={`Nazwa: ${entry.name}\nŹródło: ${entry.source}`}>
<label htmlFor={entry.id.toString()}>{entry.name}</label>
</th>
<td className="icons">
{entry.source === 'cookie' ? (
<span title="Dane przechowywane w Cookies">
<img
src="/assets/icons/cookie.svg"
height={16}
width={16}
className="cookie-data"
/>
</span>
) : entry.request.hasCookie() ? (
<span title="Wysłane w zapytaniu opatrzonym Cookies" style={{ opacity: 0.25 }}>
<img
src="/assets/icons/cookie.svg"
height={16}
width={16}
className="request-with-cookie"
/>
</span>
) : null}
{entry.exposesOrigin() ? (
<span title="Pokazuje część historii przeglądania">
<img
src="/assets/icons/warning.svg"
height={16}
width={16}
className="show-history-part"
/>
</span>
) : entry.request.exposesOrigin() ? (
<span
title="Jest częścią zapytania, które ujawnia historię przeglądania"
style={{ opacity: 0.25 }}
>
<img
src="/assets/icons/warning.svg"
height={16}
width={16}
className="request-with-history-part"
/>
</span>
) : null}
</td>
<StolenDataValue entry={entry} />
</tr>
);
}
export default function StolenDataCluster({
origin,
shorthost,
minValueLength,
cookiesOnly,
cookiesOrOriginOnly,
detailsVisibility,
}: {
origin: string;
shorthost: string;
minValueLength: number;
cookiesOnly: boolean;
cookiesOrOriginOnly: boolean;
detailsVisibility: boolean;
}) {
const cluster = getMemory().getClustersForOrigin(origin)[shorthost];
const fullHosts = cluster.getFullHosts();
const [version] = useEmitter(cluster);
return (
<div className="stolen-data-cluster-container">
<header className="domains-container">
<div className="domains-container__header">
<input
type="checkbox"
className="domain-checkbox"
data-version={version}
checked={cluster.hasMarks()}
onChange={() => {
console.log('Clicked checkbox!', {
cluster_id: cluster.id,
has_marks: cluster.hasMarks(),
});
cluster.hasMarks() ? cluster.undoMark() : cluster.autoMark();
getMemory().emit('change', cluster.id);
}}
/>
<a className="domain" href={'https://' + cluster.id} target="_blank">
{cluster.id}
</a>{' '}
{cluster.hasCookies() ? (
<img
src="/assets/icons/cookie.svg"
height={16}
width={16}
className="icon cookie-data"
/>
) : (
''
)}
</div>
<div className="subdomains-container">
{fullHosts.map((host, index) => (
<a
className="subdomain"
key={host}
href={`https://${host}`}
target="_blank"
>
{host} {`${fullHosts.length - 1 !== index ? '· ' : ''}`}
</a>
))}
</div>
</header>
{detailsVisibility ? (
<section>
<table>
<thead>
<tr>
<th className="table-header" colSpan={4}>
Wysłane dane:
</th>
</tr>
</thead>
<tbody>
{cluster
.calculateRepresentativeStolenData({
minValueLength,
cookiesOnly,
cookiesOrOriginOnly,
})
.map((entry) => (
<StolenDataRow
{...{
entry,
key: entry.id,
}}
/>
))}
</tbody>
</table>
</section>
) : null}
</div>
);
}

View File

@ -1,56 +0,0 @@
import { getMemory } from '../../memory';
import { RequestCluster } from '../../request-cluster';
import StolenDataCluster from './stolen-data-cluster';
import './stolen-data.scss';
export function StolenData({
origin,
minValueLength,
eventCounts,
cookiesOnly,
cookiesOrOriginOnly,
detailsVisibility,
}: {
origin: string;
eventCounts: Record<string, number | undefined>;
minValueLength: number;
cookiesOnly: boolean;
cookiesOrOriginOnly: boolean;
detailsVisibility: boolean;
}) {
if (!origin) {
return (
<div className="stolen-data-container">
<span>Otwórz nową kartę z wybraną stroną internetową</span>
</div>
);
}
const clusters = Object.values(getMemory().getClustersForOrigin(origin))
.sort(RequestCluster.sortCompare)
.filter((cluster) => !cookiesOnly || cluster.hasCookies())
.filter(
(cluster) => !cookiesOrOriginOnly || cluster.hasCookies() || cluster.exposesOrigin()
);
return (
<div className="stolen-data-container">
<span>Domeny{detailsVisibility ? ' oraz przesłane informacje' : null}</span>
{clusters.map((cluster) => {
return (
<StolenDataCluster
origin={origin}
shorthost={cluster.id}
key={cluster.id + origin}
refreshToken={eventCounts[cluster.id] || 0}
minValueLength={minValueLength}
cookiesOnly={cookiesOnly}
cookiesOrOriginOnly={cookiesOrOriginOnly}
detailsVisibility={detailsVisibility}
/>
);
})}
</div>
);
}

View File

@ -1,26 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link
rel="stylesheet"
href="/lib/styles/global.css"
>
<link
rel="stylesheet"
href="/lib/components/toolbar/toolbar.css"
>
</head>
<body>
<div id="toolbar"></div>
<script src="/node_modules/react/umd/react.production.min.js"></script>
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
<script src="/lib/components/toolbar/toolbar.js"></script>
</body>
</html>

View File

@ -1,176 +0,0 @@
@import '../../styles/colors.scss';
body {
width: 400px;
overflow-x: hidden;
user-select: none;
}
.toolbar {
padding: 0.125rem 1rem;
.header {
display: grid;
grid-template-columns: 1.75rem 1fr 1.25rem;
align-items: center;
max-height: 3.5rem;
min-height: 3.5rem;
border-bottom: 1px solid $light-grey;
position: sticky;
top: 0;
background: #ffffff;
z-index: 1;
user-select: none;
&--no-page {
border-bottom: 0;
}
.webpage-metadata {
word-break: break-all;
display: flex;
flex-flow: column;
flex-wrap: nowrap;
font-size: 0.875rem;
font-weight: 700;
justify-content: center;
padding-left: 1rem;
color: #000;
&--hyperlink {
font-weight: 600;
color: $ultra-black-color;
max-height: 2rem;
overflow: hidden;
}
}
button {
border: none;
background: transparent;
cursor: pointer;
padding: 0;
}
}
.summary {
display: flex;
flex-flow: column;
justify-content: center;
padding-bottom: 1.5rem;
border-bottom: 1px solid $light-grey;
.counters-wrapper {
flex-flow: row;
display: flex;
justify-content: center;
.counters {
display: flex;
flex-flow: column;
align-content: flex-start;
justify-content: center;
margin-right: 1rem;
.counter {
font-size: 1.25rem;
font-weight: 700;
align-items: center;
display: flex;
img {
margin-right: 0.5rem;
}
span {
margin-right: 2rem;
}
&:nth-child(1) {
margin-bottom: 1rem;
}
}
}
.big-counter {
font-size: 6rem;
font-weight: 700;
}
}
.notice {
font-size: 0.875rem;
font-weight: 700;
text-align: center;
}
}
.details {
padding-top: 1.5rem;
p {
font-size: 0.875rem;
padding-bottom: 1rem;
}
}
.about {
&__no-errors {
text-align: center;
padding-bottom: 1.5rem;
}
p {
font-size: 0.875rem;
font-weight: 700;
}
}
.actions {
padding: 2rem 0;
display: flex;
justify-content: center;
align-items: center;
a {
font-size: 0.875rem;
font-weight: 700;
color: #000;
margin-right: 0.5rem;
}
.button {
border: 0;
outline: 0;
height: 3rem;
font-size: 0.875rem;
line-height: 0.875rem;
cursor: pointer;
&--report {
font-weight: 800;
padding: 0 1.5rem;
background-color: #000;
color: #fff;
&:hover {
color: $icd-rentgen-color;
background-image: linear-gradient(
to right,
$icd-rentgen-color 0%,
$icd-rentgen-color 4%,
#000 4%,
#000 100%
);
animation: slidebg 1s cubic-bezier(0.19, 1, 0.22, 1) infinite;
}
}
@keyframes slidebg {
to {
background-position: 155px;
}
}
}
}
}

View File

@ -1,284 +0,0 @@
import React, { Fragment } from 'react';
import ReactDOM from 'react-dom';
import { useEmitter } from '../../util';
import { getMemory } from '../../memory';
async function getCurrentTab() {
const [tab] = await browser.tabs.query({
active: true,
windowId: browser.windows.WINDOW_ID_CURRENT,
});
return tab;
}
import './../../styles/global.scss';
import './toolbar.scss';
function isDomainHighlySuspicious(domain: string): boolean {
return (
domain.includes('facebook') ||
domain.includes('twitter') ||
domain.includes('linkedin') ||
false
);
}
const Toolbar = () => {
const [origin, setOrigin] = React.useState<string | null>(null);
const [eventCounts] = useEmitter(getMemory());
const [cookieDomainCopy, setCookieDomainCopy] = React.useState<string | null>(null);
const [_, setMarksOccurrence] = React.useState<boolean>(false);
const [exposedOriginDomainCopy, setExposedOriginDomainCopy] = React.useState<string | null>(
null
);
const first_sentence_cookie = 'Strona dokonała zapisu i odczytu plików Cookie dla domen ';
const first_sentence_history =
'Część informacji o Twojej historii przeglądania została wysłana do ';
React.useEffect(() => {
const listener = async () => {
const tab = await getCurrentTab();
if (tab !== undefined && tab.url) {
const url = new URL(tab.url);
if (url.origin.startsWith('moz-extension')) {
return;
}
setOrigin(url.origin);
} else {
console.warn('Out of the tab scope');
}
};
browser.tabs.onUpdated.addListener(listener);
listener();
return () => {
browser.tabs.onUpdated.removeListener(listener);
};
});
React.useEffect(() => {
if (!origin) return;
const exposedOriginDomains = Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.exposesOrigin())
.sort((cluster1, cluster2) =>
isDomainHighlySuspicious(cluster1.id)
? -1
: isDomainHighlySuspicious(cluster2.id)
? 1
: 0
)
.map((cluster) => cluster.id);
setExposedOriginDomainCopy('');
switch (exposedOriginDomains.length) {
case 0:
break;
case 1:
setExposedOriginDomainCopy(`${exposedOriginDomains[0]}.`);
break;
case 2:
setExposedOriginDomainCopy(
`${exposedOriginDomains[0]} oraz ${exposedOriginDomains[1]}.`
);
break;
case 3:
setExposedOriginDomainCopy(
`${exposedOriginDomains[0]}, ${exposedOriginDomains[1]} oraz ${exposedOriginDomains[2]}.`
);
break;
default:
setExposedOriginDomainCopy(
`${exposedOriginDomains[0]}, ${exposedOriginDomains[1]} (i ${
exposedOriginDomains.length - 2 < 2 ? 2 : exposedOriginDomains.length - 2
} innych).`
);
break;
}
}, [eventCounts['*'], origin]);
React.useEffect(() => {
if (!origin) return;
const cookieDomains = Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.hasCookies())
.sort((cluster1, cluster2) =>
isDomainHighlySuspicious(cluster1.id)
? -1
: isDomainHighlySuspicious(cluster2.id)
? 1
: 0
)
.map((cluster) => cluster.id);
setCookieDomainCopy('');
switch (cookieDomains.length) {
case 0:
break;
case 1:
setCookieDomainCopy(`${cookieDomains[0]}.`);
break;
case 2:
setCookieDomainCopy(`${cookieDomains[0]} oraz ${cookieDomains[1]}.`);
break;
case 3:
setCookieDomainCopy(
`${cookieDomains[0]}, ${cookieDomains[1]} oraz ${cookieDomains[2]}.`
);
break;
default:
setCookieDomainCopy(
`${cookieDomains[0]}, ${cookieDomains[1]} (i ${
cookieDomains.length - 2 < 2 ? 2 : cookieDomains.length - 2
} innych).`
);
break;
}
}, [eventCounts['*'], origin]);
React.useEffect(() => {
if (!origin) return;
for (const cluster of Object.values(getMemory().getClustersForOrigin(origin))) {
if (cluster.hasMarks()) {
return setMarksOccurrence(true);
}
}
return setMarksOccurrence(false);
}, [eventCounts['*']]);
function autoMark() {
if (!origin) return;
for (const cluster of Object.values(getMemory().getClustersForOrigin(origin))) {
cluster.autoMark();
}
return setMarksOccurrence(true);
}
return (
<div className="toolbar">
<header className={origin ? 'header' : 'header header--no-page'}>
<img src="../../assets/icon-addon.svg" height={32}></img>
<div className="webpage-metadata">
{origin ? (
<>
<span>Analiza strony</span>
<span className="webpage-metadata--hyperlink">{origin}</span>
</>
) : (
<span>Przejdź do wybranej strony internetowej</span>
)}
</div>
{origin ? (
<a href="https://internet-czas-dzialac.pl">
<img src="/assets/icons/info_circle_outline.svg" width="20" height="20" />
</a>
) : null}
</header>
{origin ? (
<Fragment>
{' '}
<section className="summary">
<div className="counters-wrapper">
<div className="counters">
<div className="counter counter--cookies">
<img
src="/assets/icons/cookie.svg#color"
width="24"
height="24"
/>
<span data-event={`${eventCounts['*']}`}>
{
Object.values(
getMemory().getClustersForOrigin(origin)
).filter((cluster) => cluster.hasCookies()).length
}
</span>
</div>
<div className="counter counter--browser-history">
<img
src="/assets/icons/warning.svg#color"
width="24"
height="24"
/>
<span data-event={`${eventCounts['*']}`}>
{
Object.values(
getMemory().getClustersForOrigin(origin)
).filter((cluster) => cluster.exposesOrigin()).length
}
</span>
</div>
</div>
<div className="big-counter" data-event={`${eventCounts['*']}`}>
{Object.values(getMemory().getClustersForOrigin(origin)).length}
</div>
</div>
<span className="notice">Liczba wykrytych domen podmiotów trzecich</span>
</section>
<section className="details">
{cookieDomainCopy ? (
<p
data-event={`${eventCounts['*']}`}
title={Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.hasCookies())
.map((domain) => domain.id)
.join(', ')}
>
{first_sentence_cookie}
<strong>{cookieDomainCopy}</strong>
</p>
) : null}
{exposedOriginDomainCopy ? (
<p
data-event={`${eventCounts['*']}`}
title={Object.values(getMemory().getClustersForOrigin(origin))
.filter((cluster) => cluster.exposesOrigin())
.map((domain) => domain.id)
.join(', ')}
>
{first_sentence_history}
<strong>{exposedOriginDomainCopy}</strong>
</p>
) : null}
</section>
{exposedOriginDomainCopy || cookieDomainCopy ? (
<Fragment>
<section className="about">
<p>
Takie przetwarzanie danych może być niezgodne z prawem. Przejdź
do analizy aby pomóc ustalić, czy ta strona nie narusza RODO lub
ustawy Prawo Telekomunikacyjne.
</p>
</section>
<section className="actions">
<button
className="button button--report"
onClick={() => {
autoMark();
window.open(
`/components/sidebar/sidebar.html?origin=${origin}`,
'new_tab'
);
window.close(); // close toolbar popup
}}
>
Przejdź do analizy
</button>
</section>
</Fragment>
) : (
<Fragment>
<section className="about about__no-errors">
<p>Nie znaleziono problemów na tej stronie.</p>
</section>
</Fragment>
)}
</Fragment>
) : null}
</div>
);
};
ReactDOM.render(<Toolbar />, document.getElementById('toolbar'));

View File

@ -1,13 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>RENTGEN DIAG</title>
</head>
<body>
<div id="app"></div>
</body>
<script src="/node_modules/react/umd/react.production.min.js"></script>
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
<script src="/node_modules/survey-react/survey.react.min.js"></script>
<script src="./lib/diag.js"></script>
</html>

View File

@ -1,65 +0,0 @@
import React, { Fragment } from 'react';
import ReactDOM from 'react-dom';
import EmailContent from './components/report-window/email-content';
import { makeFakeClusters } from './components/report-window/fake-clusters';
class ErrorBoundary extends React.Component<any, { hasError: boolean; error: any }> {
constructor(props: any) {
super(props);
this.state = { hasError: false, error: null };
}
static getDerivedStateFromError(error: any) {
return { hasError: true, error };
}
render() {
if (this.state.hasError) {
return <h1>Something went wrong.</h1>;
}
return this.props.children;
}
}
function Diag() {
const [json, setjson] = React.useState(
JSON.stringify({ answers: { hosts: {} }, visited_url: '', fake_clusters_data: {} })
);
const { answers, visited_url, fake_clusters_data } = JSON.parse(json);
const fake_clusters = makeFakeClusters(fake_clusters_data);
return (
<div style={{ display: 'grid', gridTemplateColumns: '50% 50%', minHeight: '100vh' }}>
<div>
<textarea
style={{ width: 'calc(100% - 50px)', height: '100%' }}
value={json}
onChange={(e) => {
setjson(e.target.value);
}}
></textarea>
</div>
<div>
<EmailContent
{...{
answers,
visited_url,
clusters: fake_clusters,
scrRequestPath: '/screenshots',
downloadFiles: () => {
alert('download!');
},
user_role: 'user',
}}
/>
</div>
</div>
);
}
ReactDOM.render(
<ErrorBoundary>
<Diag />
</ErrorBoundary>,
document.getElementById('app')
);

View File

@ -1,68 +1,29 @@
import esbuild from 'esbuild'; import esbuild from 'esbuild';
import scss from 'esbuild-plugin-sass'; import scss from 'esbuild-plugin-sass';
import svg from 'esbuild-plugin-svgr';
const watch = process.argv.includes('--watch') && {
onRebuild(error) {
if (error) console.error('[watch] build failed', error);
else console.log('[watch] build finished');
},
};
// see https://github.com/evanw/esbuild/issues/806#issuecomment-779138268
let skipReactImports = {
name: 'skipReactImports',
setup(build) {
build.onResolve({ filter: /^(react(-dom)?|survey-react)$/ }, (args) => {
return {
path: args.path,
namespace: `globalExternal_${args.path}`,
};
});
build.onLoad({ filter: /.*/, namespace: 'globalExternal_react' }, () => {
return {
contents: `module.exports = globalThis.React`,
loader: 'js',
};
});
build.onLoad({ filter: /.*/, namespace: 'globalExternal_react-dom' }, () => {
return {
contents: `module.exports = globalThis.ReactDOM`,
loader: 'js',
};
});
build.onLoad({ filter: /.*/, namespace: 'globalExternal_survey-react' }, () => {
return {
contents: `module.exports = globalThis.Survey`,
loader: 'js',
};
});
},
};
esbuild esbuild
.build({ .build({
entryPoints: [ entryPoints: [
'components/toolbar/toolbar.tsx', 'sidebar/sidebar.tsx',
'components/sidebar/sidebar.tsx', 'test.ts',
'components/report-window/report-window.tsx', 'report-window/report-window.tsx',
'background.ts', 'background.ts',
'diag.tsx',
'styles/global.scss',
'styles/fonts.scss',
], ],
bundle: true, bundle: true,
// minify: true,
outdir: './lib', outdir: './lib',
loader: { '.woff': 'file', '.woff2': 'file' }, loader: { '.woff': 'file', '.woff2': 'file' },
plugins: [scss(), skipReactImports], plugins: [scss(), svg()],
define: { watch: {
PLUGIN_NAME: '"Rentgen"', onRebuild(error, result) {
PLUGIN_URL: '"https://addons.mozilla.org/pl/firefox/addon/rentgen/"', try {
console.log('watch build succeeded:', result);
} catch (error) {
console.error('watch build failed:', error);
}
},
}, },
external: ['react', 'react-dom', 'survey-react'],
watch,
}) })
.then(() => console.log('Add-on was built'))
.catch(() => process.exit(1)); .catch(() => process.exit(1));
// npx esbuild sidebar/sidebar.tsx test.ts --bundle report-window/report-window.tsx --bundle background.ts --bundle --outdir=./lib

View File

@ -1,12 +1,11 @@
'use strict'; import { StolenDataEntry } from "./stolen-data-entry";
import { DataLocation, StolenDataEntry } from './stolen-data-entry';
import { import {
flattenObjectEntries, flattenObjectEntries,
getshorthost, getshorthost,
parseCookie, parseCookie,
Request, Request,
safeDecodeURIComponent, safeDecodeURIComponent,
} from './util'; } from "./util";
type NameValue = { name: string; value: string }; type NameValue = { name: string; value: string };
@ -25,7 +24,7 @@ export type HAREntry = {
params: (NameValue & { params: (NameValue & {
fileName: string; fileName: string;
contentType: string; contentType: string;
comment: ''; comment: "";
})[]; })[];
text: string; text: string;
}; };
@ -41,10 +40,10 @@ export type HAREntry = {
content: { content: {
mimeType: string; mimeType: string;
size: number; size: number;
encoding: 'base64'; encoding: "base64";
text: string; text: string;
}; };
redirectURL: ''; redirectURL: "";
headersSize: number; headersSize: number;
bodySize: number; bodySize: number;
}; // not relevant }; // not relevant
@ -76,100 +75,91 @@ export default class ExtendedRequest {
public tabId: number; public tabId: number;
public url: string; public url: string;
public shorthost: string; public shorthost: string;
public requestHeaders: { name: string; value?: string; binaryValue?: number[] }[] = []; public requestHeaders: Request["requestHeaders"] = [];
public originalURL: string;
public origin: string; public origin: string;
public initialized = false; public initialized = false;
public stolenData: StolenDataEntry[] = []; public stolenData: StolenDataEntry[];
public originalURL: string | null = null; // sometimes we can only establish that the given request applied to a certain origin, not a full URL from the address bar - in case of service workers, for example. Hence the null public originalPathname: string;
public originalPathname: string | null = null; // same as above
public originalHost: string;
public requestBody: RequestBody; public requestBody: RequestBody;
static by_id = {} as Record<string, ExtendedRequest>; static by_id = {} as Record<string, ExtendedRequest>;
public data: Request;
constructor(data: Request) { constructor(public data: Request) {
this.tabId = data.tabId; this.tabId = data.tabId;
this.url = data.url; this.url = data.url;
this.shorthost = getshorthost(data.url); this.shorthost = getshorthost(data.url);
this.requestBody = ((data as any).requestBody as undefined | RequestBody) || {}; this.requestBody =
((data as any).requestBody as undefined | RequestBody) || {};
if (this.url.includes("criteo")) {
console.log(this);
}
ExtendedRequest.by_id[data.requestId] = this; ExtendedRequest.by_id[data.requestId] = this;
this.data = Object.assign({}, data);
(this.data as any).frameAncestors = [
...((data as any)?.frameAncestors?.map((e: any) => ({ url: e.url })) || []),
]; // making a copy?
// console.log('→→→',(this.data as any).frameAncestors, (data as any).frameAncestors);
let url: string;
let is_full_url = true;
let url_comes_from: string;
if (this.data.type === 'main_frame') {
url = this.data.url;
url_comes_from = 'main_frame';
} else if (this.data.frameId === 0 && this.data.documentUrl) {
url = this.data.documentUrl;
url_comes_from = 'documentUrl';
if (this.data.tabId == -1) {
//a service worker?
url_comes_from = 'documentUrl (webworker)';
is_full_url = false;
}
} else if (
(this.data as any)?.frameAncestors &&
(this.data as any).frameAncestors[0] !== undefined
) {
url = (this.data as any).frameAncestors.at(-1).url || '';
url_comes_from = 'frameAncestors';
} else {
url = this.data.documentUrl || this.data.originUrl;
url_comes_from = 'last resort';
} }
this.originalURL = is_full_url ? url : null; addHeaders(headers: Request["requestHeaders"]) {
this.origin = new URL(url).origin; this.requestHeaders = headers;
this.originalHost = new URL(url).host;
this.originalPathname = is_full_url ? new URL(url).pathname : null;
}
addHeaders(headers: Request['requestHeaders']) {
this.requestHeaders = headers || [];
return this; return this;
} }
init() { async init() {
await this.cacheOrigin();
this.initialized = true; this.initialized = true;
this.stolenData = this.getAllStolenData(); this.stolenData = this.getAllStolenData();
} }
async cacheOrigin(): Promise<void> {
let url: string;
if (this.data.tabId && this.data.tabId >= 0) {
const tab = await browser.tabs.get(this.data.tabId);
url = tab.url;
} else if ((this.data as any)?.frameAncestors) {
url = (this.data as any).frameAncestors[0].url || "";
} else {
const headers = Object.fromEntries(
this.requestHeaders.map(({ name, value }) => [name, value])
);
if (headers.Referer) {
url = headers.Referer;
} else {
url = this.data.url;
}
}
this.originalURL = url;
this.origin = new URL(url).origin;
this.originalPathname = new URL(url).pathname;
}
isThirdParty() { isThirdParty() {
const request_url = new URL(this.data.url); const request_url = new URL(this.data.url);
if (request_url.host.includes(this.originalHost)) { const origin_url = new URL(this.originalURL);
if (request_url.host.includes(origin_url.host)) {
return false; return false;
} }
if (getshorthost(request_url.host) == getshorthost(this.originalHost)) { if (getshorthost(request_url.host) == getshorthost(origin_url.host)) {
return false; return false;
} }
return ( return (
request_url.origin != this.origin || request_url.origin != origin_url.origin ||
(this.data as any).urlClassification.thirdParty.length > 0 (this.data as any).urlClassification.thirdParty.length > 0
); );
} }
getReferer() { getReferer() {
return ( return (
this.requestHeaders.filter((h) => h.name === 'Referer')[0]?.value || 'missing-referrer' this.requestHeaders.filter((h) => h.name === "Referer")[0]?.value ||
"missing-referrer"
); );
} }
exposesOriginWhere(): null | DataLocation { exposesOrigin() {
const host = this.originalHost; const url = new URL(this.originalURL);
const path = this.originalPathname || '/'; const host = url.host;
const path = url.pathname;
const shorthost = getshorthost(host); const shorthost = getshorthost(host);
if (this.getReferer().includes(shorthost)) { if (this.getReferer().includes(shorthost)) {
return { path: this.url, source: 'header', key: 'Referer' }; return true;
} }
for (const entry of this.stolenData) { for (const entry of this.stolenData) {
if ( if (
@ -177,14 +167,10 @@ export default class ExtendedRequest {
entry.value.includes(path) || entry.value.includes(path) ||
entry.value.includes(shorthost) entry.value.includes(shorthost)
) { ) {
return entry.toDataLocation(); return true;
} }
} }
return null; return false;
}
exposesOrigin() {
return this.exposesOriginWhere() !== null;
} }
private getAllStolenData(): StolenDataEntry[] { private getAllStolenData(): StolenDataEntry[] {
@ -202,9 +188,12 @@ export default class ExtendedRequest {
return []; return [];
} }
return flattenObjectEntries( return flattenObjectEntries(
Object.entries(parseCookie(this.getCookie())).map(([key, value]) => [key, value || '']), Object.entries(parseCookie(this.getCookie())).map(([key, value]) => [
key,
value || "",
]),
StolenDataEntry.parseValue StolenDataEntry.parseValue
).map(([key, value]) => new StolenDataEntry(this, 'cookie', key, value)); ).map(([key, value]) => new StolenDataEntry(this, "cookie", key, value));
} }
getRequestBodyData(): StolenDataEntry[] { getRequestBodyData(): StolenDataEntry[] {
@ -212,68 +201,78 @@ export default class ExtendedRequest {
Object.entries({ Object.entries({
...this.requestBody.formData, ...this.requestBody.formData,
...Object.fromEntries( ...Object.fromEntries(
Object.entries(this.requestBody.raw || {}).map(([key, value], index) => [ Object.entries(
`${key}.${index}`, this.requestBody.raw || {}
value, ).map(([key, value], index) => [`${key}.${index}`, value])
])
), ),
}).map(([key, value]) => { }).map(([key, value]) => {
// to handle how ocdn.eu encrypts POST body on https://businessinsider.com.pl/ // to handle how ocdn.eu encrypts POST body on https://businessinsider.com.pl/
if ((Array.isArray(value) && value.length === 1 && !value[0]) || !value) { if (
return ['requestBody', key]; (Array.isArray(value) && value.length === 1 && !value[0]) ||
!value
) {
return ["requestBody", key];
} else if (!Array.isArray(value)) { } else if (!Array.isArray(value)) {
return [ return [
'raw', "raw",
String.fromCharCode.apply(null, Array.from(new Uint8Array(value.bytes))), String.fromCharCode.apply(null, new Uint8Array(value.bytes)),
]; ];
} else { } else {
return [key, value || '']; return [key, value || ""];
} }
}), }),
StolenDataEntry.parseValue StolenDataEntry.parseValue
).map(([key, value]) => new StolenDataEntry(this, 'request_body', key, value)); ).map(
([key, value]) => new StolenDataEntry(this, "request_body", key, value)
);
return ret; return ret;
} }
hasReferer() { hasReferer() {
return this.requestHeaders.some((h) => h.name === 'Referer'); return this.requestHeaders.some((h) => h.name === "Referer");
} }
hasCookie() { hasCookie() {
return this.requestHeaders.some((h) => h.name === 'Cookie'); return this.requestHeaders.some((h) => h.name === "Cookie");
} }
getCookie(): string { getCookie(): string {
return this.requestHeaders.find((h) => h.name == 'Cookie')?.value || ''; return this.requestHeaders.find((h) => h.name == "Cookie")?.value;
} }
getPathParams(): StolenDataEntry[] { getPathParams(): StolenDataEntry[] {
const url = new URL(this.data.url); const url = new URL(this.data.url);
const path = url.pathname; const path = url.pathname;
if (!path.includes(';')) { if (!path.includes(";")) {
return []; return [];
} }
return flattenObjectEntries( return flattenObjectEntries(
path path
.split(';') .split(";")
.map((e) => e.split('=')) .map((e) => e.split("="))
.map(([key, value]) => [key, value || '']) .map(([key, value]) => [key, value || ""])
.map(([key, value]) => { .map(([key, value]) => {
return [key, StolenDataEntry.parseValue(safeDecodeURIComponent(value))]; return [
key,
StolenDataEntry.parseValue(safeDecodeURIComponent(value)),
];
}) })
).map(([key, value]) => new StolenDataEntry(this, 'pathname', key, value)); ).map(([key, value]) => new StolenDataEntry(this, "pathname", key, value));
} }
getQueryParams(): StolenDataEntry[] { getQueryParams(): StolenDataEntry[] {
const url = new URL(this.data.url); const url = new URL(this.data.url);
return flattenObjectEntries( return flattenObjectEntries(
(Array.from((url.searchParams as any).entries()) as [string, string][]) Array.from((url.searchParams as any).entries())
.map(([key, value]: [string, string]) => [key, value || '']) .map(([key, value]) => [key, value || ""])
.map(([key, value]) => { .map(([key, value]) => {
return [key, StolenDataEntry.parseValue(safeDecodeURIComponent(value))]; return [
key,
StolenDataEntry.parseValue(safeDecodeURIComponent(value)),
];
}) })
).map(([key, value]) => { ).map(([key, value]) => {
return new StolenDataEntry(this, 'queryparams', key, value); return new StolenDataEntry(this, "queryparams", key, value);
}); });
} }
@ -291,10 +290,10 @@ export default class ExtendedRequest {
.map((header) => { .map((header) => {
return [ return [
header.name, header.name,
StolenDataEntry.parseValue(safeDecodeURIComponent(header.value || '')), StolenDataEntry.parseValue(safeDecodeURIComponent(header.value)),
]; ];
}) })
).map(([key, value]) => new StolenDataEntry(this, 'header', key, value)); ).map(([key, value]) => new StolenDataEntry(this, "header", key, value));
} }
hasMark() { hasMark() {
@ -305,10 +304,6 @@ export default class ExtendedRequest {
return this.stolenData.filter((data) => data.isMarked); return this.stolenData.filter((data) => data.isMarked);
} }
unmarkAllEntries() {
this.stolenData.forEach((entry) => entry.unmark());
}
getHost() { getHost() {
return new URL(this.url).host; return new URL(this.url).host;
} }
@ -321,8 +316,8 @@ export default class ExtendedRequest {
toHAR(): HAREntry { toHAR(): HAREntry {
return { return {
pageref: 'page_1', pageref: "page_1",
startedDateTime: `${new Date().toJSON().replace('Z', '+01:00')}`, startedDateTime: `${new Date().toJSON().replace("Z", "+01:00")}`,
request: { request: {
bodySize: bodySize:
JSON.stringify(this.requestBody.formData || {}).length + JSON.stringify(this.requestBody.formData || {}).length +
@ -332,7 +327,7 @@ export default class ExtendedRequest {
method: this.data.method, method: this.data.method,
url: this.data.url, url: this.data.url,
headersSize: JSON.stringify(this.requestHeaders).length, headersSize: JSON.stringify(this.requestHeaders).length,
httpVersion: 'HTTP/2', httpVersion: "HTTP/2",
headers: this.requestHeaders as NameValue[], headers: this.requestHeaders as NameValue[],
cookies: this.getCookieData().map((cookie) => ({ cookies: this.getCookieData().map((cookie) => ({
name: cookie.name, name: cookie.name,
@ -343,35 +338,35 @@ export default class ExtendedRequest {
value: param.value, value: param.value,
})), })),
postData: { postData: {
mimeType: 'application/x-www-form-urlencoded', mimeType: "application/x-www-form-urlencoded",
params: this.stolenData params: this.stolenData
.filter((e) => e.source == 'request_body') .filter((e) => e.source == "request_body")
.map((e) => ({ .map((e) => ({
name: e.name, name: e.name,
value: e.value, value: e.value,
fileName: '--' + Math.ceil(Math.random() * 1000000000), fileName: "--" + Math.ceil(Math.random() * 1000000000),
contentType: 'text/plain', contentType: "text/plain",
comment: '', comment: "",
})), })),
text: this.stolenData text: this.stolenData
.filter((e) => e.source == 'request_body') .filter((e) => e.source == "request_body")
.map((e) => `${e.name}:\t${StolenDataEntry.parseValue(e.value)}`) .map((e) => `${e.name}:\t${StolenDataEntry.parseValue(e.value)}`)
.join('\n\n'), .join("\n\n"),
}, },
}, },
response: { response: {
status: 200, status: 200,
statusText: 'OK', statusText: "OK",
httpVersion: 'HTTP/2', httpVersion: "HTTP/2",
headers: [], headers: [],
cookies: [], cookies: [],
content: { content: {
mimeType: 'text/plain', mimeType: "text/plain",
size: this.getBalancedPriority(), size: this.getBalancedPriority(),
encoding: 'base64', encoding: "base64",
text: 'ZG9lc24ndCBtYXR0ZXIK', text: "ZG9lc24ndCBtYXR0ZXIK",
}, },
redirectURL: '', redirectURL: "",
headersSize: 15, headersSize: 15,
bodySize: 15, bodySize: 15,
}, },
@ -386,9 +381,9 @@ export default class ExtendedRequest {
receive: 0, receive: 0,
}, },
time: 79, time: 79,
_securityState: 'secure', _securityState: "secure",
serverIPAddress: '31.13.92.36', serverIPAddress: "31.13.92.36",
connection: '443', connection: "443",
}; };
} }
@ -407,10 +402,10 @@ export default class ExtendedRequest {
if (this.hasCookie()) { if (this.hasCookie()) {
result += 50; result += 50;
} }
if (this.stolenData.some((e) => e.classification === 'location')) { if (this.stolenData.some((e) => e.classification === "location")) {
result += 300; result += 300;
} }
if (this.url.includes('facebook')) { if (this.url.includes("facebook")) {
result += 50; result += 50;
} }
return result; return result;

BIN
icons/border-48.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 225 B

BIN
icons/logo-black-square.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

View File

@ -0,0 +1,97 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="2048"
height="2048"
viewBox="0 0 541.86667 541.86667"
version="1.1"
id="svg2399"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)"
sodipodi:docname="logo-black-square.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview2401"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:document-units="mm"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
units="px"
lock-margins="true"
inkscape:zoom="0.083628825"
inkscape:cx="-131.53359"
inkscape:cy="2845.9087"
inkscape:window-width="1920"
inkscape:window-height="1024"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="g5214-0-20-3-1-92" />
<defs
id="defs2396" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(195.39804,196.97992)">
<g
id="g2559">
<rect
y="-196.9799"
x="-195.39803"
height="541.86664"
width="541.86664"
id="rect5174-5-2-1-8-9"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:89.9968;stroke-opacity:1"
inkscape:export-xdpi="562.5"
inkscape:export-ydpi="562.5" />
<g
id="g5216-6-9-9-2-87"
transform="matrix(25.209725,0,0,25.209725,-5013.7768,-42754.638)"
style="fill:#ffffff;fill-opacity:1">
<g
id="g5214-0-20-3-1-92"
transform="translate(-146.29537,198.647)"
style="fill:#ffffff;fill-opacity:1">
<g
id="g17009"
transform="matrix(1.0494588,0,0,1.0494588,-16.219745,-80.475607)">
<text
xml:space="preserve"
style="font-size:13.4678px;line-height:1.25;font-family:Poppins;-inkscape-font-specification:Poppins;word-spacing:0px;stroke-width:0.0935269"
x="338.93002"
y="1510.9918"
id="text3426"><tspan
sodipodi:role="line"
id="tspan3424"
style="font-style:italic;font-variant:normal;font-weight:900;font-stretch:normal;font-size:13.4678px;font-family:Poppins;-inkscape-font-specification:'Poppins Heavy Italic';stroke-width:0.0935269"
x="338.93002"
y="1510.9918">Pr</tspan></text>
<text
xml:space="preserve"
style="font-size:13.4678px;line-height:1.25;font-family:Poppins;-inkscape-font-specification:Poppins;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke-width:0.0935269"
x="352.05331"
y="1510.884"
id="text3426-3"><tspan
sodipodi:role="line"
id="tspan3424-6"
style="font-style:italic;font-variant:normal;font-weight:900;font-stretch:normal;font-size:13.4678px;font-family:Poppins;-inkscape-font-specification:'Poppins Heavy Italic';stroke-width:0.0935269"
x="352.05331"
y="1510.884">.</tspan></text>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

View File

@ -1,30 +1,22 @@
{ {
"description": "Rentgen to wtyczka dla przeglądarek opartych o Firefoxa, która automatycznie wizualizuje, jakie dane zostały ~~wykradzione~~ wysłane do podmiotów trzecich przez odwiedzane strony.",
"manifest_version": 2, "manifest_version": 2,
"name": "Rentgen", "name": "Problematyczne requesty",
"short_name": "Rentgen", "version": "1.0",
"version": "0.1.10",
"author": "Kuba Orlik, Arkadiusz Wieczorek (Internet. Czas działać!)", "description": "",
"homepage_url": "https://git.internet-czas-dzialac.pl/icd/rentgen",
"sidebar_action": {
"default_title": "Problematic requests",
"default_panel": "sidebar/sidebar.html",
"default_icon": "icons/logo-black-square.svg",
"browser_style": true,
"open_at_install": true
},
"background": { "background": {
"scripts": ["lib/background.js"] "scripts": ["lib/background.js"]
}, },
"commands": {
"_execute_sidebar_action": {
"suggested_key": {
"default": "Ctrl+Shift+U"
}
}
},
"browser_action": {
"default_icon": "assets/icon-addon.svg",
"default_title": "Rentgen",
"default_popup": "components/toolbar/toolbar.html"
},
"icons": { "icons": {
"16": "assets/icon-addon.svg", "48": "icons/border-48.png"
"32": "assets/icon-addon.svg",
"64": "assets/icon-addon.svg"
}, },
"permissions": [ "permissions": [
"proxy", "proxy",
@ -35,11 +27,9 @@
"cookies", "cookies",
"privacy" "privacy"
], ],
"browser_specific_settings": { "browser_specific_settings": {
"gecko": { "gecko": {
"id": "rentgen@internet-czas-dzialac.pl", "id": "problematic-requests@internet-czas-dzialac.pl"
"strict_min_version": "91.1.0"
} }
} }
} }

View File

@ -1,20 +1,14 @@
import ExtendedRequest from './extended-request'; import ExtendedRequest from "./extended-request";
import { getshorthost } from './util'; import { getshorthost, makeThrottle } from "./util";
import { RequestCluster } from './request-cluster'; import { EventEmitter } from "events";
import { SaferEmitter } from './safer-emitter'; import { RequestCluster } from "./request-cluster";
function setDomainsCount(counter: number, tabId: number) { export default class Memory extends EventEmitter {
browser.browserAction.setBadgeText({ text: counter < 0 ? '0' : counter.toString(), tabId });
browser.browserAction.setTitle({
title: 'Rentgen',
tabId,
});
}
export default class Memory extends SaferEmitter {
origin_to_history = {} as Record<string, Record<string, RequestCluster>>; origin_to_history = {} as Record<string, Record<string, RequestCluster>>;
private throttle = makeThrottle(200);
async register(request: ExtendedRequest) { async register(request: ExtendedRequest) {
await request.init(); await request.init();
// console.log("registering request for", request.origin);
if (!request.isThirdParty()) { if (!request.isThirdParty()) {
return; return;
} }
@ -27,20 +21,7 @@ export default class Memory extends SaferEmitter {
this.origin_to_history[request.origin][shorthost] = cluster; this.origin_to_history[request.origin][shorthost] = cluster;
} }
this.origin_to_history[request.origin][shorthost].add(request); this.origin_to_history[request.origin][shorthost].add(request);
this.emit('change', shorthost); this.emit("change");
Object.values(this.getClustersForOrigin(request.origin)).some((cluster) =>
cluster.hasCookies()
)
? browser.browserAction.setBadgeBackgroundColor({ color: '#ff726b' })
: browser.browserAction.setBadgeBackgroundColor({ color: '#ffb900' });
if (request.tabId >= 0) {
setDomainsCount(
Object.values(this.getClustersForOrigin(request.origin)).length,
request.tabId
);
}
} }
constructor() { constructor() {
@ -50,24 +31,33 @@ export default class Memory extends SaferEmitter {
async (request) => { async (request) => {
new ExtendedRequest(request); new ExtendedRequest(request);
}, },
{ urls: ['<all_urls>'] }, { urls: ["<all_urls>"] },
['requestBody'] ["requestBody"]
); );
browser.webRequest.onBeforeSendHeaders.addListener( browser.webRequest.onBeforeSendHeaders.addListener(
async (request) => { async (request) => {
const extendedRequest = ExtendedRequest.by_id[request.requestId].addHeaders( const extendedRequest = ExtendedRequest.by_id[
request.requestHeaders || [] request.requestId
); ].addHeaders(request.requestHeaders || []);
this.register(extendedRequest); this.register(extendedRequest);
}, },
{ urls: ['<all_urls>'] }, { urls: ["<all_urls>"] },
['requestHeaders'] ["requestHeaders"]
); );
} }
emit(eventName: string, data = 'any'): boolean { emit(eventName: string, immediate = false) {
setTimeout(() => super.emit(eventName, data), 0); try {
if (immediate) {
super.emit(eventName);
return;
} else {
this.throttle(() => super.emit(eventName));
}
return true; return true;
} catch (e) {
// debugger;
}
} }
getClustersForOrigin(origin: string): Record<string, RequestCluster> { getClustersForOrigin(origin: string): Record<string, RequestCluster> {
@ -78,6 +68,7 @@ export default class Memory extends SaferEmitter {
if (shorthost) { if (shorthost) {
const cookies = await browser.cookies.getAll({ domain: shorthost }); const cookies = await browser.cookies.getAll({ domain: shorthost });
for (const cookie of cookies) { for (const cookie of cookies) {
console.log("removing cookie", cookie.name, "from", cookie.domain);
await browser.cookies.remove({ await browser.cookies.remove({
name: cookie.name, name: cookie.name,
url: `https://${cookie.domain}`, url: `https://${cookie.domain}`,

View File

@ -1,9 +1,9 @@
@import './styles/colors.scss'; @import './sidebar/colors.scss';
.options-container { .options-container {
padding-top: 0.5rem; padding-top: 0.5rem;
span { span {
color: $ultra-black-color; color: $mid-grey;
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 600; font-weight: 600;
} }
@ -17,13 +17,9 @@
.label-checkbox { .label-checkbox {
cursor: pointer; cursor: pointer;
margin-left: 0.5rem; margin-left: 0.5rem;
font-size: 0.875rem;
font-weight: 500;
} }
.input-container { .input-container {
font-size: 0.875rem;
font-weight: 500;
padding-bottom: 0.25rem; padding-bottom: 0.25rem;
} }
@ -31,48 +27,4 @@
width: 3rem; width: 3rem;
} }
} }
.buttons {
display: flex;
flex-flow: column;
padding: 0.5rem 0 1rem;
.button-container {
padding: 0.25rem 0;
}
button {
border: none;
cursor: pointer;
color: $ultra-black-color;
padding: 0;
display: flex;
flex-wrap: nowrap;
line-height: 1.25rem;
background: #fff;
width: 100%;
&:hover {
color: #000;
text-decoration: underline;
svg path {
fill: #000;
}
}
&:disabled {
cursor: not-allowed;
color: $disabled-grey;
svg path {
fill: $disabled-grey;
}
}
span {
padding-left: 0.5rem;
font-size: 0.875rem;
font-weight: 500;
}
}
}
} }

View File

@ -1,4 +1,4 @@
import React, { Fragment } from 'react'; import React from 'react';
import './options.scss'; import './options.scss';
export default function Options({ export default function Options({
@ -10,11 +10,8 @@ export default function Options({
setCookiesOrOriginOnly, setCookiesOrOriginOnly,
warningDataDialogAck, warningDataDialogAck,
setWarningDataDialogAck, setWarningDataDialogAck,
detailsVisibility, logoVisibility,
setDetailsVisibility, setLogoVisibility,
setStolenDataView,
removeCookies,
removeRequests,
}: { }: {
minValueLength: number; minValueLength: number;
setMinValueLength: (n: number) => void; setMinValueLength: (n: number) => void;
@ -24,38 +21,28 @@ export default function Options({
setCookiesOrOriginOnly: (b: boolean) => void; setCookiesOrOriginOnly: (b: boolean) => void;
warningDataDialogAck: boolean; warningDataDialogAck: boolean;
setWarningDataDialogAck: (b: boolean) => void; setWarningDataDialogAck: (b: boolean) => void;
detailsVisibility: boolean; logoVisibility: boolean;
setDetailsVisibility: (b: boolean) => void; setLogoVisibility: (b: boolean) => void;
setStolenDataView: (b: boolean) => void;
removeCookies: () => void;
removeRequests: () => void;
}) { }) {
return ( return (
<Fragment>
<nav>
<button onClick={() => setStolenDataView(true)}>
<img src="/assets/icons/short_left.svg" width="20" height="20" />
<span>Wróć do szczegółów</span>
</button>
</nav>
<div className="options-container"> <div className="options-container">
<span>Interfejs</span> <span>Interfejs</span>
<fieldset> <fieldset>
<div className="input-container"> <div className="input-container">
<input <input
type="checkbox" type="checkbox"
id="detailsVisibility" id="logoVisibility"
checked={detailsVisibility} checked={logoVisibility}
onChange={(e) => { onChange={(e) => {
setDetailsVisibility(e.target.checked); setLogoVisibility(e.target.checked);
localStorage.setItem( localStorage.setItem(
'detailsVisibility', 'logoVisibility',
e.target.checked as unknown as string e.target.checked as unknown as string
); );
}} }}
/> />
<label className="label-checkbox" htmlFor="detailsVisibility"> <label className="label-checkbox" htmlFor="logoVisibility">
Wyświetlaj szczegóły pozyskanych danych Wyświetlaj logo <i>Internet. Czas działać!</i>
</label> </label>
</div> </div>
<div className="input-container"> <div className="input-container">
@ -71,7 +58,10 @@ export default function Options({
); );
}} }}
/> />
<label className="label-checkbox" htmlFor="warningDataDialogAck"> <label
className="label-checkbox"
htmlFor="warningDataDialogAck"
>
Wyświetlaj komunikat o pozyskiwanych danych Wyświetlaj komunikat o pozyskiwanych danych
</label> </label>
</div> </div>
@ -85,12 +75,10 @@ export default function Options({
<input <input
type="number" type="number"
id="minValueLength" id="minValueLength"
min={1}
value={minValueLength} value={minValueLength}
onChange={(e) => { onChange={(e) =>
setMinValueLength(parseInt(e.target.value)); setMinValueLength(parseInt(e.target.value))
localStorage.setItem('minValueLength', e.target.value); }
}}
/> />
</div> </div>
<div className="input-container"> <div className="input-container">
@ -109,29 +97,19 @@ export default function Options({
type="checkbox" type="checkbox"
id="cookiesOrOriginOnly" id="cookiesOrOriginOnly"
checked={cookiesOrOriginOnly} checked={cookiesOrOriginOnly}
onChange={(e) => setCookiesOrOriginOnly(e.target.checked)} onChange={(e) =>
setCookiesOrOriginOnly(e.target.checked)
}
/> />
<label className="label-checkbox" htmlFor="cookiesOrOriginOnly"> <label
Pokazuj tylko dane z cookiesów lub z częścią historii przeglądania className="label-checkbox"
htmlFor="cookiesOrOriginOnly"
>
Pokazuj tylko dane z cookiesów lub z częścią historii
przeglądania
</label> </label>
</div> </div>
</fieldset> </fieldset>
<span>Narzędzia deweloperskie</span>
<div className="buttons">
<div className="button-container">
<button onClick={() => removeRequests()}>
<img src="/assets/icons/trash_full.svg" width="20" height="20" />
<span>Wyczyść historię wtyczki</span>
</button>
</div> </div>
<div className="button-container">
<button onClick={() => removeCookies()}>
<img src="/assets/icons/cookie.svg" width="20" height="20" />
<span>Wyczyść ciasteczka</span>
</button>
</div>
</div>
</div>
</Fragment>
); );
} }

12997
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,55 +1,34 @@
{ {
"name": "rentgen", "name": "problematic-requests",
"version": "0.1.10", "version": "1.0.0",
"description": "Rentgen is an add-on prepared for Firefox-based browsers. This extension will automatically visualize all the data that a given website sends to third parties.", "description": "",
"main": "esbuild.config.js", "main": "esbuild.config.js",
"type": "module", "type": "module",
"scripts": { "scripts": {
"build": "node esbuild.config.js", "build": "node esbuild.config.js",
"watch": "node esbuild.config.js --watch", "watch": "npm run build -- --watch",
"ext-test": "web-ext run", "typecheck": "tsc --noEmit"
"build-addon": "npm i && npm run build && npm run create-package",
"create-package": "web-ext build --ignore-files '!**/node_modules' '!**/node_modules/**/react-dom' '!**/node_modules/**/react-dom/umd' '!**/node_modules/**/*/react-dom.production.min.js' '!**/node_modules/**/react' '!**/node_modules/**/react/umd' '!**/node_modules/**/*/react.production.min.js' '!**/node_modules/**/survey-react' '!**/node_modules/**/survey-react/*.min.js' '!**/node_modules/**/survey-react/*.min.css' --overwrite-dest",
"typecheck": "tsc --noEmit",
"lint": "web-ext lint"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://git.internet-czas-dzialac.pl/icd/rentgen.git" "url": "https://git.internet-czas-dzialac.pl/icd/problematic-requests.git"
}, },
"homepage": "https://git.internet-czas-dzialac.pl/icd/rentgen", "author": "",
"author": "Kuba Orlik, Arkadiusz Wieczorek", "license": "ISC",
"license": "GPL-3.0-or-later",
"dependencies": { "dependencies": {
"@iabtcf/core": "^1.3.1", "@iabtcf/core": "^1.3.1",
"@types/proposal-relative-indexing-method": "^0.1.0", "@types/proposal-relative-indexing-method": "^0.1.0",
"esbuild": "^0.13.3",
"events": "^3.3.0", "events": "^3.3.0",
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"survey-core": "^1.9.8",
"survey-react": "^1.9.8",
"tai-password-strength": "^1.1.3" "tai-password-strength": "^1.1.3"
}, },
"keywords": [
"ciasteczka",
"cookies",
"icd",
"internet czas działać",
"internet-czas-dzialac",
"privacy",
"prywatność",
"rentgen",
"śledzenie",
"tracking"
],
"devDependencies": { "devDependencies": {
"@types/events": "^3.0.0", "@types/events": "^3.0.0",
"@types/react-dom": "^17.0.9", "@types/react-dom": "^17.0.9",
"addons-linter": "^4.7.0",
"esbuild": "^0.14.14",
"esbuild-plugin-sass": "^1.0.1", "esbuild-plugin-sass": "^1.0.1",
"typescript": "^4.6.4", "esbuild-plugin-svgr": "^1.0.0",
"web-ext": "^6.7.0",
"web-ext-types": "^3.2.1" "web-ext-types": "^3.2.1"
} }
} }

View File

@ -0,0 +1,42 @@
import React from 'react';
import { RequestCluster } from '../request-cluster';
import { Classifications, Sources } from '../stolen-data-entry';
const emailClassifications: Record<keyof typeof Classifications, string> = {
id: 'mój identyfikator internetowy',
history: 'część mojej historii przeglądania',
location: 'informacje na temat mojej lokalizacji geograficznej',
};
const emailSources: Record<Sources, string> = {
header: 'w nagłówku HTTP',
cookie: 'z pliku Cookie',
pathname: 'jako części adresu URL',
queryparams: 'jako część adresu URL (query-params)',
request_body: 'w body zapytania POST',
};
export default function DomainSummary({
cluster,
}: {
cluster: RequestCluster;
}) {
return (
<li>
Właścicielowi domeny <strong>{cluster.id}</strong> zostały
ujawnione:{' '}
<ul>
{cluster.representativeStolenData
.filter((entry) => entry.isMarked)
.map((entry) => (
<li key={entry.id}>
{emailClassifications[entry.classification]}{' '}
{emailSources[entry.source]} (nazwa:{' '}
<code>{entry.name}</code>, wartość:{' '}
<code>{entry.getValuePreview()}</code>)
</li>
))}
</ul>
</li>
);
}

View File

@ -0,0 +1,232 @@
import React from 'react';
import { useState } from 'react';
import { RequestCluster } from '../request-cluster';
import { StolenDataEntry } from '../stolen-data-entry';
import { getDate, toBase64 } from '../util';
import DomainSummary from './domain-summary';
type PopupState = 'not_clicked' | 'clicked_but_no_reject_all';
export default function EmailTemplate1({
entries,
clusters,
}: {
entries: StolenDataEntry[];
clusters: Record<string, RequestCluster>;
version: number;
}): JSX.Element {
const [popupState, setPopupState] = useState<PopupState>('not_clicked');
const [acceptAllName, setAcceptAllName] = useState<string>(
'Zaakceptuj wszystkie'
);
const [popupScreenshotBase64, setPopupScreenshotBase64] =
useState<string>(null);
return (
<div>
<label htmlFor="popupState">Status okienka o rodo:</label>
<select
id="popupState"
value={popupState}
onChange={(e) => setPopupState(e.target.value as PopupState)}
>
<option value="not_clicked">Nic nie kliknięte</option>
<option value="clicked_but_no_reject_all">
Kliknięte "akceptuj wszystkie", ale nie było opcji "Odrzuć
wszystkie"
</option>
</select>
{popupState === 'clicked_but_no_reject_all' ? (
<>
<div>
<label htmlFor="acceptAllName">
Tekst na przycisku do zatwierdzania wszystkich zgód:
</label>
<input
{...{
type: 'text',
value: acceptAllName,
onChange: (e) =>
setAcceptAllName(e.target.value),
}}
/>
</div>
<div>
<label htmlFor="popup-screenshot">
Zrzut ekranu z tego, jak wyglądał popup przed
kliknięciem {acceptAllName}:
</label>
<input
{...{
type: 'file',
id: 'popup-screenshot',
onChange: async (e) => {
setPopupScreenshotBase64(
await toBase64(e.target.files[0])
);
},
}}
/>
</div>
</>
) : null}
<p>
Dzień dobry, w dniu {getDate()} odwiedziłem stronę{' '}
{entries[0].request.originalURL}. Strona ta wysłała moje dane
osobowe do podmiotów trzecich - bez mojej zgody.{' '}
</p>
<ul>
{Object.values(clusters)
.filter((cluster) => cluster.hasMarks())
.map((cluster) => (
<DomainSummary cluster={cluster} />
))}
</ul>
<p>
{' '}
Dane te zostały wysłane przez Państwa stronę - a mówiąc
dokładniej, przez zamieszczone przez Państwa na tej stronie
skrypty.
</p>
{popupState === 'not_clicked' ? (
<p>
Nastąpiło to, zanim zdążyłem w ogóle przeczytać treść
wyskakującego okienka ze zgodami i zanim miałem szansę
wyrazić sprzeciw takiemu przetwarzaniu danych osobowych.
</p>
) : null}
{popupState === 'clicked_but_no_reject_all' ? (
<p>
O ile po wejściu na stronę wcisnąłem w wyskakującym okienku
przycisk {acceptAllName}, o tyle nie stanowi to według
mnie ważnej w świetle RODO zgody, gdyż brakowało w tym
okienku równie łatwo osiągalnego przycisku, którego
kliknięcie skutkowałoby zasygnalizowaniem braku mojej zgody
na takie przetwarzanie moich danych. Mówiąc wprost -
wyrażenie zgody było łatwiejsze niż jej niewyrażenie.
Niewyrażenie zgody wiąże się z negatywną konsekwencją
konieczności przechodzenia przez dodatkowe kroki w
wyskakującym okienku. Zatem tak otrzymana przez Państwo moja
zgoda nie jest poprawną podstawą prawną do przetwarzania
moich danych osobowych, gdyż nie spełnia warunku
dobrowolności wspomnianego w Art. 4. pkt 11{' '}
<em>
rozporządzenia Parlamentu Europejskiego i Rady (UE)
2016/679 z dnia 27 kwietnia 2016 r. w sprawie ochrony
osób fizycznych w związku z przetwarzaniem danych
osobowych i w sprawie swobodnego przepływu takich danych
oraz uchylenia dyrektywy 95/46/WE
</em>
.{<img {...{ src: popupScreenshotBase64 }} />}
</p>
) : null}
<p>
Udokumentowałem to na zrzutach ekranu z mojej przeglądarki
internetowej, które to zrzuty przesyłam w załączeniu.
</p>
<p>
Wiem, że nie wszystkie rodzaje przetwarzania danych wymagają
zgody użytkownika. W kontekście stron internetowych z
wymienionych w Art. 6. pkt 1. RODO mogą mieć zastosowanie albo
zgoda (Art. 6. pkt 1. lit. a)), albo niezbędność tego
przetwarzania do wykonania umowy (Art. 6. pkt 1. lit. b)), albo
uzasadniony interes (Art. 6. pkt 1. lit. f)). Wiem też, że każda
z tych podstaw prawnych ma moc dopiero po spełnieniu określonych
warunków.
</p>
<p>
Nie widzę ważnej podstawy prawnej legalizującej procesy
przetwarzania moich danych osobowych, jakie wymieniłem powyżej
(na pewno nie jest to przetwarzanie konieczne do wyświetlenia
strony z technicznego punktu widzenia). Jeżeli takie przesłanki
legalizujące jednak występują, proszę o ich wskazanie,
<strong>
{' '}
dla każdego z celów i podmiotów z <em>osobna</em>
</strong>
.
</p>
<p>
Jeżeli wskazaną przez Państwa przesłanką legalizującą dany
element procesu przetwarzania danych osobowych przez Państwa
stronę jest Art 6. pkt 1 lit. a) RODO (zgoda), na mocy Art. 7
pkt 1 RODO proszę o wykazanie, że udzieliłem Państwu zgodę na
takie przetwarzanie moich danych osobowych zanim to
przetwarzanie nastąpiło, oraz że ta zgoda jest ważna w świetle
RODO (odnosząc się w szczególności do art. 7 ust. 3 RODO). Z
góry zaznaczam, że ustawienia przeglądarki nie stanowią ważnej
w świetle RODO zgody.
</p>
<p>
Jeżeli wskazaną przez Państwa przesłanką legalizującą dany
element procesu przetwarzania danych osobowych przez Państwa
stronę jest Art 6. pkt 1 lit. b) RODO (niezbędność takiego
przetwarzania do wykonania umowy), proszę o wskazanie, w jaki
sposób ta konieczność zachodzi, oraz co sprawia, że Państwa
zdaniem nie można wykonać umowy związanej z wyświetleniem
Państwa strony bez przekazywania identyfikatora internetowego z
plików Cookies lub historii przeglądania w nagłówku Referer do
wskazanych podmiotów trzecich.
</p>
<p>
Jeżeli wskazaną przez Państwa przesłanką legalizującą dany
element procesu przetwarzania danych osobowych przez Państwa
stronę jest Art 6. pkt 1 lit. f) RODO (uzasadniony interes),
proszę o wskazanie, jaki to jest{' '}
<strong>konkretny interes</strong> (prosze o bardziej dokładny
opis niż np. tylko "marketing"), oraz o wynik testu równowagi
pomiędzy Państwa interesem a moimi podstawowymi wolnościami i
prawami - ze wskazaniem tego, co sprawia, że w Państwa ocenie
Państwa uzasadniony interes przeważa moje prawa i interesy w
kontekście wspomnianych powyżej procesów przetwarzania danych.
Proszę też pamiętać, że aby w ramach danego celu przetwarzania
powołać się na prawnie uzasadniony interes, powinni mi Państo
umożliwić wyrażenie sprzeciwu wobec przetwarzania moich danych w
tym celu <em>przed</em> rozpoczęciem przetwarzania - zob.{' '}
<a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
Wytyczne 8/2020 Europejskiej Rady Ochrony Danych dotyczące
targetowania użytkowników mediów społecznościowych
</a>
</p>
<p>
Niniejszym zwracam się także z żądaniem ujawnienia tożsamości
podmiotów, które właścicielami wyżej wymienionych domen, abym
mógł zapoznać się z ich politykami prywatności i zwrócić się do
tych podmiotów o usunięcie z ich baz wysłanych przez Państwa
stronę moich danych.
</p>
<p>
Proszę też o wysłanie kopii danych zebranych na mój temat i
wysłanych do wyżej wymienionych podmiotów.
</p>
<p>
W odpowiedzi proszę się nie powoływać na IAB Europe i ich
rzekomą renomę w tworzeniu rozwiązań zgodnych z RODO. IAB chroni
interes reklamodawców, a nie Użytkowników, i ich rozwiązania
(np. TCF) {' '}
<a href="https://panoptykon.org/search/site/IAB">
notorycznie niezgodne z RODO i pozbawione szacunku dla
Użytkowników
</a>
.
</p>
<p>
Apeluję także o wprowadzenie stosownych zmian na stronie tak,
aby nie pozostawiać cienia wątpliwości odnośnie tego, na mocy
jakiej przesłanki legalizującej dane przetwarzane przez
wspomniane podmioty trzecie, lub tak, aby te dane po prostu nie
były wysyłane. Pomoże to zachować prywatność innym użytkownikom
Państwa strony. Polecam Państwa uwadze oficjalne wytyczne EROD
dotyczące zgody w kontekście RODO:
https://edpb.europa.eu/sites/default/files/files/file1/edpb_guidelines_202005_consent_pl.pdf
). Aby na przykład zapobiec automatycznemu wysyłaniu historii
przeglądania do podmiotów trzecich przez Państwa stronę, można
po prostu ustawić odpowiednio treść nagłówka{' '}
<a href="https://developer.mozilla.org/pl/docs/Web/HTTP/Headers/Referrer-Policy">
Referrer-Policy{' '}
</a>
.
</p>
</div>
);
}

View File

@ -0,0 +1,170 @@
import React from 'react';
import { Dispatch, SetStateAction } from 'react';
import { toBase64 } from '../util';
import { EmailTemplate2Config } from './email-template-2';
export default function EmailTemplate2Controls({
config,
setConfig,
}: {
config: EmailTemplate2Config;
setConfig: Dispatch<SetStateAction<EmailTemplate2Config>>;
}): JSX.Element {
return (
<div>
<div>
<label htmlFor="poup_type">Typ okienka o RODO: </label>
<select
id="poup_type"
value={config.popup_type}
onChange={(e) =>
setConfig((v) => ({
...v,
popup_type: e.target
.value as EmailTemplate2Config['popup_type'],
}))
}
>
<option value="none">Brak jakiejkolwiek informacji</option>
<option value="passive_cookie_banner">
Pasywne powiadomienie o cookiesach
</option>
<option value="consent">Okienko z pytaniem o zgodę</option>
</select>
</div>
{config.popup_type !== 'none' ? (
<div>
<label htmlFor="popup_screenshot">
Zrzut ekranu okienka o RODO:
</label>
<input
{...{
type: 'file',
id: 'popup_screenshot',
onChange: async (e) => {
const popup_screenshot_base64 = await toBase64(
e.target.files[0]
);
setConfig((v) => ({
...v,
popup_screenshot_base64,
}));
},
}}
/>
</div>
) : (
''
)}
{config.popup_type === 'consent' ? (
<div>
<label htmlFor="acceptAllName">
Tekst na przycisku do zatwierdzania wszystkich zgód:
</label>
<input
{...{
type: 'text',
value: config.popup_accept_all_text,
onChange: (e) =>
setConfig((v) => ({
...v,
popup_accept_all_text: e.target.value,
})),
}}
/>
</div>
) : (
''
)}
<div>
<label htmlFor="popup_action">
Czy coś klikn*ł*m w informacjach o RODO?
</label>
<select
id="popup_action"
value={config.popup_type}
onChange={(e) =>
setConfig((v) => ({
...v,
popup_action: e.target
.value as EmailTemplate2Config['popup_action'],
}))
}
>
<option value="ignored">Nic nie klin*ł*m</option>
<option value="accepted">
Kliknięte {config.popup_accept_all_text}
</option>
<option value="closed">
Zamkn*ł*m okienko (np. przyciskiem "X")
</option>
</select>
</div>
{config.popup_action === 'closed' ? (
<div>
<label htmlFor="popup_closed_how">
Jak okienko zostało zamknięte? Poprzez
</label>
<input
id="popup_closed_how"
type="text"
placeholder="kliknięcie przycisku „X”"
value={config.popup_closed_how}
style={{ width: '300px' }}
onChange={(e) =>
setConfig((v) => ({
...v,
popup_closed_how: e.target.value,
}))
}
/>
</div>
) : (
''
)}
{config.popup_type !== 'none' ? (
<div>
<input
type="checkbox"
id="popup_mentions_passive_consent"
checked={config.popup_mentions_passive_consent}
onChange={(e) =>
setConfig((v) => ({
...v,
popup_mentions_passive_consent:
e.target.checked,
}))
}
/>
<label htmlFor="popup_mentions_passive_consent">
okienko wspomina o pasywnej zgodzie (np. korzystając ze
strony wyrażasz zgodę)
</label>
</div>
) : (
''
)}
{config.popup_mentions_passive_consent ? (
<div>
<label htmlFor="popup_passive_consent_text">
Jak okienko próbuje wmówić Ci, że wyrażasz zgodę?
Przeklej z treści okienka:
</label>
<input
id="popup_passive_consent_text"
placeholder="Korzystając ze strony wyrażasz zgodę"
value={config.popup_passive_consent_text}
onChange={(e) =>
setConfig((v) => ({
...v,
popup_passive_consent_text: e.target.value,
}))
}
/>
</div>
) : (
''
)}
</div>
);
}

View File

@ -0,0 +1,488 @@
import React, { useState } from 'react';
import { RequestCluster } from '../request-cluster';
import { StolenDataEntry } from '../stolen-data-entry';
import { getDate, unique } from '../util';
import DomainSummary from './domain-summary';
import EmailTemplate2Controls from './email-template-2-controls';
export type EmailTemplate2Config = {
popup_type: 'none' | 'passive_cookie_banner' | 'consent';
popup_action: 'ignored' | 'accepted' | 'closed';
popup_closed_how: string;
popup_screenshot_base64: string | null;
popup_accept_all_text: string;
popup_mentions_passive_consent: boolean;
popup_passive_consent_text: string;
};
function ClusterRangeSummary({ cluster }: { cluster: RequestCluster }) {
const range = unique(
cluster.getMarkedEntries().map((entry) => entry.classification)
);
const has_cookie_ids = cluster
.getMarkedEntries()
.filter((entry) => entry.source === 'cookie')
.some((entry) => entry.classification == 'id');
return (
<>
{[
range.includes('id')
? 'Pańskiego identyfikatora internetowego' +
(has_cookie_ids ? ' z cookie' : '')
: '',
range.includes('history')
? 'części Pańskiej historii przeglądania'
: '',
range.includes('location')
? 'informacji na temat Pana położenia'
: '',
]
.filter((e) => e !== '')
.join(', ')}
</>
);
}
function Placeholder({ children }: { children: string }) {
return (
<span
style={{
textDecoration: 'underline',
fontSize: '0.8em',
position: 'relative',
textUnderlineOffset: '4px',
bottom: '3px',
}}
>
<span
dangerouslySetInnerHTML={{ __html: '&nbsp;'.repeat(12) }}
></span>
<span style={{ color: 'gray' }}>({children})</span>
<span
dangerouslySetInnerHTML={{ __html: '&nbsp;'.repeat(12) }}
></span>
</span>
);
}
function Base64Image({ base64 }: { base64: string }) {
return <img style={{ maxWidth: '100%' }} {...{ src: base64 }} />;
}
export default function EmailTemplate2({
entries,
clusters,
}: {
entries: StolenDataEntry[];
clusters: Record<string, RequestCluster>;
version: number;
}): JSX.Element {
const [config, setConfig] = useState<EmailTemplate2Config>({
popup_type: 'none',
popup_action: 'ignored',
popup_screenshot_base64: null,
popup_accept_all_text: 'Zaakceptuj wszystkie',
popup_mentions_passive_consent: false,
popup_passive_consent_text: '',
popup_closed_how: 'kliknięcie przycisku „X”',
});
const visited_url = entries[0].request.originalURL;
return (
<>
<EmailTemplate2Controls {...{ config, setConfig }} />
<article
style={{
boxShadow: '0 20px 40px rgba(0,0,0,.2)',
padding: '4rem 3rem',
borderRadius: '0.25rem',
margin: '2rem 0',
color: 'hsl(240, 5.7%, 15.8%);',
}}
>
<p>
Dzień dobry, w dniu {getDate()} odwiedziłem stronę{' '}
{visited_url}.
</p>
{config.popup_type === 'none' ? (
<p>
Nie ukazał mi się na stronie żaden mechanizm pozyskujący
zgodę na przetwarzanie moich danych osobowych lub
umożliwiający mi wyrażenie sprzeciwu wobec przetwarzania
przez stronę moich danych osobowych w zakresie
wykraczającym poza procesy konieczne do wyświetlenia
strony
</p>
) : config.popup_type == 'passive_cookie_banner' ? (
<>
<p>
Na stronie była widoczna informacja o plikach
Cookie.{' '}
</p>
<p>
<Base64Image
{...{ base64: config.popup_screenshot_base64 }}
/>
</p>
</>
) : (
<>
<p>
Ukazało mi się okienko z informacjami i pytaniami
dotyczącymi sposobów, w jaki strona przetwarza moje
dane osobowe.{' '}
</p>
<p>
<Base64Image
{...{ base64: config.popup_screenshot_base64 }}
/>
</p>
<p>
{config.popup_action === 'ignored'
? /* HTML */ `Nie kliknąłem żadnego przycisku w
tym okienku. W szczególności nie kliknąłem
przycisku ${config.popup_accept_all_text}.`
: config.popup_action === 'accepted'
? `Kliknąłem na widoczną w tym okienku opcję „${config.popup_accept_all_text}”.`
: ''}
</p>
</>
)}
<p>
W tym samym czasie rejestrowałem ruch sieciowy generowany
przez stronę za pomocą narzędzi w przeglądarce Firefox.
Okazało się, że Państwa strona wysłała była moje dane
osobowe do następujących podmiotów:
</p>
<ul>
{Object.values(clusters)
.filter((cluster) => cluster.hasMarks())
.map((cluster) => (
<DomainSummary cluster={cluster} key={cluster.id} />
))}
</ul>
{config.popup_action === 'ignored' ? (
<p>
Dane te zostały wysłane, zanim kliknąłem cokolwiek na
tej stronie.
</p>
) : config.popup_action === 'accepted' ? (
<p>
Dane te zostały wysłane po tym, jak kliknąłem przycisk
{config.popup_accept_all_text}
</p>
) : (
''
)}
<p>
W załączeniu przesyłam część zrzutów ekranu dokumentujących
fakt wysłania tych danych przez Państwa stronę.{' '}
</p>
<h3>Podstawa prawna</h3>
<p>
Ustawa Prawo Telekomunikacyjne w art. 173 reguluje warunki,
które musi spełnić administrator strony, aby jego strona
mogła zapisywać i czytać treść plików cookie. Nie reguluje
jednak tego, jakim podmiotom i w jakim zakresie dane mogą
być <em>ujawniane</em> przez stronę. Tym zajmuje się
Rozporządzenie 2016/679 Parlamentu Europejskiego i Rady (UE)
z dnia 27 kwietnia 2016 r. w sprawie ochrony osób fizycznych
w związku z przetwarzaniem danych osobowych i w sprawie
swobodnego przepływu takich danych oraz uchylenia dyrektywy
95/46/WE (ogólne rozporządzenie o ochronie danych) RODO.
Zapis/odczyt plików cookie a ujawnianie ich treści podmiotom
trzecim to dwa różne procesy. Niniejsza wiadomość i pytania
w niej zawarte dotyczą właśnie <em>ujawniania</em> moich
danych osobowych (pochodzących m.in. z Cookies) podmiotom
trzecim.
</p>
<p>
W kontekście stron internetowych właściwie dopuszczalne
tylko trzy z sześciu wymienionych w Art. 6 pkt 1 RODO
podstaw prawnych dla przetwarzania danych osobowych:
</p>
<ol>
<li>
Zgoda &mdash; osoba, której dane dotyczą wyraziła
zgodę na przetwarzanie swoich danych osobowych w jednym
lub większej liczbie określonych celów (
<em>Art. 6 pkt 1 lit. a)</em>).
</li>
<li>
Niezbędność &mdash; przetwarzanie jest niezbędne do
wykonania umowy, której stroną jest osoba, której dane
dotyczą, lub do podjęcia działań na żądanie osoby,
której dane dotyczą, przed zawarciem umowy (
<em>Art. 6 pkt 1 lit. b)</em>);{' '}
</li>
<li>
Uzasadniony Interes &mdash; przetwarzanie jest
niezbędne do celów wynikających z prawnie uzasadnionych
interesów realizowanych przez administratora lub przez
stronę trzecią, z wyjątkiem sytuacji, w których
nadrzędny charakter wobec tych interesów mają interesy
lub podstawowe prawa i wolności osoby, której dane
dotyczą, wymagające ochrony danych osobowych, w
szczególności gdy osoba, której dane dotyczą, jest
dzieckiem (<em>Art. 6 pkt 1 lit. f)</em>
);
</li>
</ol>
<p>
W przypadku opisywanej przeze mnie mojej wizyty na Państwa
stronie nie ma zastosowania Zgoda, gdyż{' '}
{config.popup_action === 'ignored' ? (
<>
nie wyrażałem żadnej zgody na takie przetwarzanie
moich danych
{config.popup_type === 'consent' ? (
<>
&mdash; w szczególności nie kliknąłem
przycisku {config.popup_accept_all_text}
</>
) : (
''
)}
.
</>
) : config.popup_action === 'accepted' ? (
<>
o ile po wejściu na stronę wcisnąłem w wyskakującym
okienku przycisk {config.popup_accept_all_text}, o
tyle nie stanowi to według mnie ważnej w świetle
RODO zgody, gdyż brakowało w tym okienku równie
łatwo osiągalnego przycisku, którego kliknięcie
skutkowałoby zasygnalizowaniem braku mojej zgody na
takie przetwarzanie moich danych. Mówiąc wprost
&mdash; wyrażenie zgody było łatwiejsze niż jej
niewyrażenie. Niewyrażenie zgody wiąże się z
negatywną konsekwencją konieczności przechodzenia
przez dodatkowe kroki w wyskakującym okienku. Zatem
tak otrzymana przez Państwo moja zgoda nie jest
poprawną podstawą prawną do przetwarzania moich
danych osobowych, gdyż nie spełnia warunku
dobrowolności wspomnianego w motywie (42) RODO.
</>
) : config.popup_action === 'closed' ? (
<>
zamknąłem okienko pytające o zgodę poprzez{' '}
{config.popup_closed_how}. Nie może być to uznane za
zgodę, bo nie spełnia to warunku jednoznaczności
opisanego w motywie (32) Rozporządzenia 2016/679.{' '}
</>
) : (
''
)}{' '}
Za zgodę nie można też uznać posiadania włączonej obsługi
cookies w przeglądarce (gdyż aby zgoda była ważna, musi być
szczegółowa dla każdego celów z osobna), jakichkolwiek
innych ustawień przeglądarki, ani pasywnych działań z mojej
strony (np. kontynuowanie korzystania ze strony)
{config.popup_mentions_passive_consent ? (
<>
{' '}
&mdash; nieprawdą więc jest zawarty na Państwa
stronie komunikat
{config.popup_passive_consent_text.trim()} (por.
paragraf 97.{' '}
<a href="https://edpb.europa.eu/sites/default/files/files/file1/edpb_guidelines_202005_consent_pl.pdf">
oficjalnych wytycznych EROD dotyczących zgody na
mocy rozporządzenia 2016/679
</a>
)
</>
) : (
''
)}
.
</p>
<p>
W mojej ocenie Niezbędność nie ma zastosowania co do
opisanych powyżej sposobów przetwarzania danych. Nie widzę,
co miałoby sprawiać, aby wysyłanie moich danych osobowych do
wspomnianych powyżej podmiotów trzecich było konieczne do
wyświetlenia Państwa strony na ekranie mojego komputera
(zob.{' '}
<a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
Wytyczne 8/2020 EROD dotyczące targetowania użytkowników
mediów społecznościowych
</a>
, par. 49);.{' '}
</p>
<p>
Pozostaje zatem Uzasadniony Interes. Aby Administrator
mógł używać uzasadnionego interesu jako podstawy prawnej
targetowania użytkowników Sieci, muszą zostać spełnione
m.in. następujące warunki:{' '}
</p>
<ol>
<li>
Administrator danych lub podmiot trzeci, któremu dane
ujawniane musi{' '}
<strong>
faktycznie realizować dany konkretny uzasadniony
interes
</strong>{' '}
(
<a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
Wyrok TSUE z dnia 29 lipca 2019 r. w sprawie Fashion
ID, C-40/17, ECLI:EU:C:2019:629
</a>
, pkt 95.)
</li>
<li>
Takie przetwarzanie danych jest{' '}
<strong>konieczne</strong> dla potrzeb wynikających z
danego uzasadnionego interesu (
<a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
Wyrok TSUE z dnia 29 lipca 2019 r. w sprawie Fashion
ID, C-40/17, ECLI:EU:C:2019:629
</a>
, pkt 95.)
</li>
<li>
Wybrany uzasadniony interes musi mieć pierwszeństwo nad
prawami i wolnościami osoby, której dotyczą przetwarzane
dane (
<a href="https://curia.europa.eu/juris/document/document.jsf?text=&docid=216555&pageIndex=0&doclang=PL&mode=lst&dir=&occ=first&part=1&cid=1254905">
Wyrok TSUE z dnia 29 lipca 2019 r. w sprawie Fashion
ID, C-40/17, ECLI:EU:C:2019:629
</a>
, pkt 95.)
</li>
<li>
Osoby, których dane dotyczą, powinny mieć możliwość
wyrażenia sprzeciwu wobec przetwarzania ich danych do
celów związanych z targetowaniem{' '}
<strong>przed rozpoczęciem przetwarzania</strong> (zob.{' '}
<a href="https://edpb.europa.eu/system/files/2021-11/edpb_guidelines_082020_on_the_targeting_of_social_media_users_pl_0.pdf">
Wytyczne 8/2020 EROD dotyczące targetowania
użytkowników mediów społecznościowych
</a>
, par. 54);
</li>
</ol>
{config.popup_action !== 'accepted' ? (
<p>
Moje dane zostały ujawnione podmiotom trzecim tuż po
włączeniu strony, zatem nie jest spełniony warunek 4.
Apeluję o wdrożenie zmian na stronie, które sprawią, że
dopiero po świadomym niewyrażeniu sprzeciwu przez
użytkownika aktywowane procesy przetwarzania danych
osobowych, których podstawą prawną jest uzasadniony
interes.
</p>
) : (
''
)}
<p>
Jeżeli istnieją jednak inne niż uzasadniony interes ważne
podstawy prawne do takiego przetwarzania moich danych
osobowych przez Państwa stronę, proszę o ich wskazanie,{' '}
<em>dla każdego z wymienionych podmiotów z osobna</em>.
(Przypominam, że Art. 173 ustawy Prawo Telekomunikacyjne nie
ma tutaj zastosowania, ponieważ nie pytam o zapis/odczyt
plików na moim komputerze, tylko o ujawnianie moich danych
osobowych podmiotom trzecim). W przeciwnym wypadku, aby
ustalić, czy moje dane były przez Państwa przetwarzane na
mocy uzasadnionego interesu zgodnie z prawem, proszę o
wypełnienie następującego szablonu (lub udzielenie tych
samych informacji w innej postaci, przy zachowaniu zakresu i
szczegółowości informacji:
</p>
<div style={{ border: '1px solid black', padding: '1rem' }}>
<p>
W dniu {getDate()} strona {visited_url}:
</p>
<ul>
{Object.values(clusters)
.filter((cluster) => cluster.hasMarks())
.map((cluster) => (
<li
key={cluster.id}
style={{ paddingBottom: '1rem' }}
>
ujawniła pańskie dane w zakresie{' '}
<em>
<ClusterRangeSummary {...{ cluster }} />
</em>{' '}
firmie{' '}
<Placeholder>nazwa firmy</Placeholder>,
która jest właścicielem domeny{' '}
<strong>{cluster.id}</strong> i swoją
politykę prywatności publikuje pod adresem{' '}
<Placeholder>
adres URL polityki prywatności tej firmy
</Placeholder>
. Podstawą prawną takiego przetwarzania
danych przez naszą stronę jest uzasadniony
interes:{' '}
<Placeholder>
na czym polega ten uzasadniony interes,
tzn. bieżące działania podejmowane przez
podmiot realizujący ten interes lub
korzyści dla podmiotu realizującego ten
interes oczekiwane w bardzo bliskiej
przyszłości
</Placeholder>{' '}
realizowany przez{' '}
<Placeholder>
kogo? jaki podmiot podejmuje wspomniane
działania lub jest beneficjentem
wspomnianych korzyści?
</Placeholder>
. Ujawnienie{' '}
<ClusterRangeSummary {...{ cluster }} />{' '}
temu podmiotowi przez naszą stronę było
konieczne dla potrzeb wynikających z tego
interesu, ponieważ
<Placeholder>
uzasadnienie konieczności
</Placeholder>
.<br />
</li>
))}
</ul>
</div>
<p>
Proszę w szczególności zwrócić uwagę na podanie adresów do
polityk prywatności tych firm, abym wiedział, jak
skontaktować się z nimi i wnioskować o usunięcie z ich baz
wysłanych przez Państwa stronę moich danych. )
</p>
<p>
W odpowiedzi proszę się nie powoływać na IAB Europe i ich
rzekomą renomę w tworzeniu rozwiązań zgodnych z RODO. IAB
chroni interes reklamodawców, a nie Użytkowników, i ich
rozwiązania (np. TCF) {' '}
<a href="https://panoptykon.org/search/site/IAB">
notorycznie niezgodne z RODO i pozbawione szacunku dla
Użytkowników
</a>
.
</p>
<p>
Apeluję także o wprowadzenie stosownych zmian na stronie
tak, aby nie pozostawiać cienia wątpliwości odnośnie tego,
na mocy jakiej przesłanki legalizującej dane przetwarzane
przez wspomniane podmioty trzecie, lub tak, aby te dane po
prostu nie były wysyłane. Pomoże to zachować prywatność
innym użytkownikom Państwa strony. Polecam Państwa uwadze
<a href="https://edpb.europa.eu/sites/default/files/files/file1/edpb_guidelines_202005_consent_pl.pdf">
{' '}
oficjalne wytyczne EROD dotyczące zgody w kontekście
RODO
</a>
. Aby na przykład zapobiec automatycznemu wysyłaniu historii
przeglądania do podmiotów trzecich przez Państwa stronę,
można po prostu ustawić odpowiednio treść nagłówka{' '}
<a href="https://developer.mozilla.org/pl/docs/Web/HTTP/Headers/Referrer-Policy">
Referrer-Policy{' '}
</a>
.
</p>
</article>
</>
);
}

View File

@ -0,0 +1,33 @@
import React, { useState } from 'react';
import { RequestCluster } from '../request-cluster';
import { StolenDataEntry } from '../stolen-data-entry';
import EmailTemplate1 from './email-template-1';
import EmailTemplate2 from './email-template-2';
export default function EmailTemplate({
entries,
clusters,
version,
}: {
entries: StolenDataEntry[];
clusters: Record<string, RequestCluster>;
version: number;
}) {
const [templateVersion, setTemplateVersion] = useState('2');
return (
<div>
<select
value={templateVersion}
onChange={(e) => setTemplateVersion(e.target.value)}
>
<option value="1">wersja 1</option>
<option value="2">wersja 2</option>
</select>
{templateVersion === '1' ? (
<EmailTemplate1 {...{ entries, clusters, version }} />
) : (
<EmailTemplate2 {...{ entries, clusters, version }} />
)}
</div>
);
}

View File

@ -1,24 +1,25 @@
import React from 'react'; import React, { useEffect, useState } from 'react';
import { HAREntry } from '../../extended-request'; import { HAREntry } from '../extended-request';
import { StolenDataEntry } from '../../stolen-data-entry'; import { StolenDataEntry } from '../stolen-data-entry';
import { getshorthost, unique } from '../../util'; import { getshorthost, unique } from '../util';
function handleNewFile( function handleNewFile(
element: HTMLInputElement, element: HTMLInputElement,
entries: StolenDataEntry[], entries: StolenDataEntry[],
setFiltered: (arg0: Blob) => void setFiltered: (Blob) => void
): void { ): void {
const reader = new FileReader(); const reader = new FileReader();
reader.addEventListener('load', () => { reader.addEventListener('load', () => {
const content = JSON.parse(reader.result as string); const content = JSON.parse(reader.result as string);
content.log.entries = content.log.entries.filter((har_entry: HAREntry) => content.log.entries = content.log.entries.filter(
(har_entry: HAREntry) =>
entries.some((entry) => entry.matchesHAREntry(har_entry)) entries.some((entry) => entry.matchesHAREntry(har_entry))
); );
setFiltered(new Blob([JSON.stringify(content)], { type: 'application/json' })); setFiltered(
new Blob([JSON.stringify(content)], { type: 'application/json' })
);
}); });
const file = element?.files?.[0]; reader.readAsText(element.files[0]);
if (!file) throw new Error('file empty?');
reader.readAsText(file);
} }
function generateFakeHAR(entries: StolenDataEntry[]) { function generateFakeHAR(entries: StolenDataEntry[]) {
@ -29,7 +30,10 @@ function generateFakeHAR(entries: StolenDataEntry[]) {
} else if (request1.shorthost > request2.shorthost) { } else if (request1.shorthost > request2.shorthost) {
return 1; return 1;
} else { } else {
return request2.getBalancedPriority() - request1.getBalancedPriority(); return (
request2.getBalancedPriority() -
request1.getBalancedPriority()
);
} }
}) })
.filter((_, index, array) => { .filter((_, index, array) => {
@ -39,7 +43,10 @@ function generateFakeHAR(entries: StolenDataEntry[]) {
} }
return true; return true;
}) })
.sort((entry1, entry2) => entry2.getBalancedPriority() - entry1.getBalancedPriority()); .sort(
(entry1, entry2) =>
entry2.getBalancedPriority() - entry1.getBalancedPriority()
);
return { return {
log: { log: {
@ -68,11 +75,16 @@ function generateFakeHAR(entries: StolenDataEntry[]) {
}; };
} }
export default function HARConverter({ entries }: { entries: StolenDataEntry[] }) { export default function HARConverter({
const [filtered, setFiltered] = React.useState<Blob | null>(null); entries,
const [filename, setFilename] = React.useState(''); }: {
const [fakeHAR, setFakeHAR] = React.useState<ReturnType<typeof generateFakeHAR>>(); entries: StolenDataEntry[];
React.useEffect(() => { }) {
const [filtered, setFiltered] = useState<Blob | null>(null);
const [filename, setFilename] = useState('');
const [fakeHAR, setFakeHAR] =
useState<ReturnType<typeof generateFakeHAR>>();
useEffect(() => {
setFakeHAR(generateFakeHAR(entries)); setFakeHAR(generateFakeHAR(entries));
}, []); }, []);
@ -82,11 +94,8 @@ export default function HARConverter({ entries }: { entries: StolenDataEntry[] }
type="file" type="file"
accept=".har" accept=".har"
onChange={(e) => { onChange={(e) => {
const file = e.target?.files?.[0]; setFilename(e.target.files[0].name);
if (file) {
setFilename(file.name);
handleNewFile(e.target, entries, setFiltered); handleNewFile(e.target, entries, setFiltered);
}
}} }}
/> />
{(filtered && ( {(filtered && (
@ -105,7 +114,7 @@ export default function HARConverter({ entries }: { entries: StolenDataEntry[] }
}) })
)} )}
download={`${getshorthost( download={`${getshorthost(
entries[0].request.origin entries[0].request.originalURL
)}-${new Date().toJSON()}-trimmed.har`} )}-${new Date().toJSON()}-trimmed.har`}
> >
Pobierz "zredukowany" HAR Pobierz "zredukowany" HAR

View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Treść maila do zgłoszenia</title>
</head>
<body>
<div
id="app"
style="max-width: 50rem; margin: 0 auto; padding: 1rem 0rem 2rem;"
></div>
<style>
tr:hover {
background-color: hsla(0, 0%, 0%, 0.1);
}
</style>
<script src="/lib/report-window/report-window.js"></script>
</body>
</html>

View File

@ -0,0 +1,127 @@
import React, { useEffect, useState } from 'react';
import ReactDOM from 'react-dom';
import { getMemory } from '../memory';
import { Classifications, StolenDataEntry } from '../stolen-data-entry';
import { reduceConcat, useEmitter } from '../util';
import EmailTemplate from './email-template';
import HARConverter from './har-converter';
function DataPreview({
entries,
refresh,
}: {
entries: StolenDataEntry[];
refresh: () => void;
}) {
// currently not used, maybe scraped entirely in the future
return (
<table>
<thead>
<tr>
<th>Adres docelowy</th>
<th>Źródło danych</th>
<th>Treść danych</th>
<th>Klasyfikacja</th>
</tr>
</thead>
<tbody>
{entries.map((entry) => (
<tr
key={entry.id}
style={{
backgroundColor:
entry.classification == 'id'
? 'yellow'
: 'white',
}}
>
<td>{entry.request.shorthost}</td>
<td style={{ overflowWrap: 'anywhere' }}>
{entry.source}:{entry.name}
</td>
<td
style={{
width: '400px',
overflowWrap: 'anywhere',
backgroundColor: entry.isRelatedToID()
? '#ffff0054'
: 'white',
}}
>
{entry.getValuePreview()}
{/* always gonna have
one key, because unwrapEntry is called above */}
</td>
<td>
<select
value={entry.classification}
onChange={(e) => {
entry.classification = e.target
.value as keyof typeof Classifications;
refresh();
}}
>
{[
['history', 'Historia przeglądania'],
['id', 'Identyfikator internetowy'],
['location', 'Lokalizacja'],
].map(([key, name]) => (
<option key={key} value={key}>
{name}
</option>
))}
</select>
</td>
</tr>
))}
</tbody>
</table>
);
}
function Report() {
console.time('getOrigin');
const origin = new URL(document.location.toString()).searchParams.get(
'origin'
);
console.timeEnd('getOrigin');
console.time('useMemory');
const [counter, setCounter] = useEmitter(getMemory());
console.timeEnd('useMemory');
function refresh() {
setCounter((c) => c + 1);
}
console.time('getClustersForOrigin');
const clusters = getMemory().getClustersForOrigin(origin);
console.timeEnd('getClustersForOrigin');
const [entries, setEntries] = useState<StolenDataEntry[]>([]);
console.time('useEffect report-window');
useEffect(() => {
setEntries(
Object.values(clusters)
.map((cluster) => {
cluster.calculateRepresentativeStolenData();
return cluster.representativeStolenData;
})
.reduce(reduceConcat, [])
.filter((entry) => entry.isMarked)
);
}, []);
console.timeEnd('useEffect report-window');
if (entries.length == 0) {
return <>Wczytywanie...</>;
}
console.time('rendering template');
const result = (
<div {...{ 'data-version': counter }}>
{/*<DataPreview {...{entries, refresh}} */}
<h1>Generuj treść maila dla {origin}</h1>
<EmailTemplate {...{ entries, clusters, version: counter }} />
<HARConverter {...{ entries }} />
</div>
);
console.timeEnd('rendering template');
return result;
}
ReactDOM.render(<Report />, document.getElementById('app'));

View File

@ -1,29 +1,26 @@
import { FakeRequestClusterData } from './components/report-window/fake-clusters'; import { EventEmitter } from 'events';
import ExtendedRequest from './extended-request'; import ExtendedRequest from './extended-request';
import { SaferEmitter } from './safer-emitter'; import { Sources, StolenDataEntry } from './stolen-data-entry';
import { DataLocation, Sources, StolenDataEntry } from './stolen-data-entry';
import { allSubhosts, isSameURL, reduceConcat, unique } from './util'; import { allSubhosts, isSameURL, reduceConcat, unique } from './util';
const source_priority: Array<Sources> = ['cookie', 'pathname', 'queryparams', 'header']; const source_priority: Array<Sources> = [
'cookie',
'pathname',
'queryparams',
'header',
];
export class RequestCluster extends SaferEmitter { export class RequestCluster extends EventEmitter {
public requests: ExtendedRequest[] = []; public requests: ExtendedRequest[] = [];
public representativeStolenData: StolenDataEntry[] = []; public representativeStolenData: StolenDataEntry[] = [];
public expanded: boolean = false; public expanded: boolean;
public lastModified: number = 0;
public lastFullUrl: string | null = null;
constructor(public id: string) { constructor(public id: string) {
super(); super();
} }
add(request: ExtendedRequest) { add(request: ExtendedRequest) {
this.requests.push(request); this.requests.push(request);
this.emit('change'); this.emit('change');
this.lastModified = Date.now();
if (request.originalURL) {
this.lastFullUrl = request.originalURL;
}
} }
toggleExpanded(state: boolean) { toggleExpanded(state: boolean) {
@ -40,10 +37,6 @@ export class RequestCluster extends SaferEmitter {
return false; return false;
} }
hasMarkedCookies() {
return this.getMarkedEntries().some((entry) => entry.source === 'cookie');
}
calculateRepresentativeStolenData( calculateRepresentativeStolenData(
filter: { filter: {
minValueLength: number; minValueLength: number;
@ -100,7 +93,8 @@ export class RequestCluster extends SaferEmitter {
return true; return true;
} }
if ( if (
array[index].getValuePreview() === array[index - 1].getValuePreview() || array[index].getValuePreview() ===
array[index - 1].getValuePreview() ||
isSameURL(array[index].value, array[index - 1].value) isSameURL(array[index].value, array[index - 1].value)
) { ) {
return false; return false;
@ -132,7 +126,9 @@ export class RequestCluster extends SaferEmitter {
return true; return true;
} }
}) })
.sort((entry1, entry2) => (entry1.getPriority() > entry2.getPriority() ? -1 : 1)); .sort((entry1, entry2) =>
entry1.getPriority() > entry2.getPriority() ? -1 : 1
);
return this.representativeStolenData; return this.representativeStolenData;
} }
@ -169,16 +165,12 @@ export class RequestCluster extends SaferEmitter {
} }
getMarkedEntries(): StolenDataEntry[] { getMarkedEntries(): StolenDataEntry[] {
return this.requests.map((request) => request.getMarkedEntries()).reduce(reduceConcat, []);
}
exposesOriginWhere(): DataLocation[] {
return this.requests return this.requests
.map((request) => request.exposesOriginWhere()) .map((request) => request.getMarkedEntries())
.filter((l) => l !== null) as DataLocation[]; .reduce(reduceConcat, []);
} }
exposesOrigin(): boolean { exposesOrigin() {
return this.requests.some((request) => request.exposesOrigin()); return this.requests.some((request) => request.exposesOrigin());
} }
@ -188,35 +180,4 @@ export class RequestCluster extends SaferEmitter {
entry.autoMark(); entry.autoMark();
}); });
} }
undoMark() {
this.calculateRepresentativeStolenData();
this.requests.forEach((request) => request.unmarkAllEntries());
}
getDataTypeDescription(noun = 'Twojej') {
let types_of_data: string[] = [];
if (this.exposesOrigin()) {
types_of_data.push(`część ${noun} historii przeglądania`);
}
if (this.hasMarkedCookies()) {
types_of_data.push('unikalne ID z cookies');
}
if (types_of_data.length > 1) {
types_of_data[types_of_data.length - 1] =
'oraz ' + types_of_data[types_of_data.length - 1];
}
return types_of_data.join(', ');
}
makeDataForFake(): FakeRequestClusterData {
return {
id: this.id,
hasCookies: this.hasCookies(),
hasMarkedCookies: this.hasMarkedCookies(),
hasMarks: this.hasMarks(),
exposesOriginWhere: this.exposesOriginWhere(),
exposesOrigin: this.exposesOrigin(),
};
}
} }

View File

@ -1,56 +0,0 @@
import EventEmitter from 'events';
export class SaferEmitter extends EventEmitter {
emit(type: string, ...args: unknown[]) {
let doError = type === 'error';
let events = (this as any)._events;
if (events !== undefined) doError = doError && events.error === undefined;
else if (!doError) return false;
// If there is no 'error' event listener then throw.
if (doError) {
let er;
if (args.length > 0) er = args[0];
if (er instanceof Error) {
// Note: The comments on the `throw` lines are intentional, they show
// up in Node's output if this results in an unhandled exception.
throw er; // Unhandled 'error' event
}
// At least give some kind of context to the user
let err = new Error('Unhandled error.' + (er ? ' (' + (er as any).message + ')' : ''));
(err as any).context = er;
throw err; // Unhandled 'error' event
}
let handler = events[type];
if (handler === undefined) return false;
if (typeof handler === 'function') {
try {
Reflect.apply(handler, this, args);
} catch (error) {
events[type] = undefined;
}
} else {
let listeners = [...handler];
listeners
.filter((e) => {
try {
e.call;
} catch (error) {
return false;
}
return true;
})
.forEach((listener) => {
try {
Reflect.apply(listener, this, args);
} catch (error) {
console.error(error);
}
});
}
return true;
}
}

BIN
screenshot.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 638 KiB

7
sidebar/colors.scss Normal file
View File

@ -0,0 +1,7 @@
$mid-grey: #2e3a59;
$disabled-grey: #8a949f;
$light-grey: #d1d1d1;
$blue: #0048D9;
$icd-yellow: #ffee2c;
$pale-yellow: #fff8e5;
$contrast-yellow: #ffb900;

49
sidebar/fonts.scss Normal file
View File

@ -0,0 +1,49 @@
@font-face {
font-family: 'Fira Code';
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Light.woff2') format('woff2'),
url('./../assets/fonts/fira-code/woff/FiraCode-Light.woff') format('woff');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Fira Code';
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Regular.woff2') format('woff2'),
url('./../assets/fonts/fira-code/woff/FiraCode-Regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Fira Code';
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Medium.woff2') format('woff2'),
url('./../assets/fonts/fira-code/woff/FiraCode-Medium.woff') format('woff');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Fira Code';
src: url('./../assets/fonts/fira-code/woff2/FiraCode-SemiBold.woff2') format('woff2'),
url('./../assets/fonts/fira-code/woff/FiraCode-SemiBold.woff') format('woff');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Fira Code';
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Bold.woff2') format('woff2'),
url('./../assets/fonts/fira-code/woff/FiraCode-Bold.woff') format('woff');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Fira Code VF';
src: url('./../assets/fonts/fira-code/woff2/FiraCode-VF.woff2')
format('woff2-variations'),
url('./../assets/fonts/fira-code/woff/FiraCode-VF.woff') format('woff-variations');
/* font-weight requires a range: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide#Using_a_variable_font_font-face_changes */
font-weight: 300 700;
font-style: normal;
}

View File

@ -10,9 +10,14 @@
user-select: none; user-select: none;
} }
body {
min-width: 24rem;
}
html { html {
font-size: 1rem; font-size: 1rem;
font-family: 'OpenSans'; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
} }
button { button {

25
sidebar/sidebar.html Normal file
View File

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
</style>
</head>
<body>
<div id="app"></div>
<link
rel="stylesheet"
href="/lib/sidebar/global.css"
>
<link
rel="stylesheet"
href="/lib/sidebar/sidebar.css"
>
<script src="/lib/sidebar/sidebar.js"></script>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show More