Compare commits
No commits in common. "develop" and "3a7096f92f4ef751ebc3d75f6cb2f2c281053600" have entirely different histories.
develop
...
3a7096f92f
2
.gitignore
vendored
@ -3,5 +3,3 @@ node_modules
|
||||
sidebar.js
|
||||
/web-ext-artifacts/
|
||||
lib/*
|
||||
/yarn-error.log
|
||||
/rentgen.zip
|
||||
|
@ -1,5 +1,5 @@
|
||||
trailingComma: "es5"
|
||||
tabWidth: 4
|
||||
printWidth: 100
|
||||
printWidth: 80
|
||||
semi: true
|
||||
singleQuote: true
|
||||
|
9
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
{
|
||||
"cSpell.words": [
|
||||
"ECLI",
|
||||
"EROD",
|
||||
"targetowania",
|
||||
"targetowaniem",
|
||||
"TSUE"
|
||||
]
|
||||
}
|
119
README.md
@ -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:**
|
||||

|
||||
|
||||
- analysis of web traffic generated by the visited website;
|
||||
- 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.
|
||||
# PL
|
||||
|
||||
## 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
|
||||
|
||||
### 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.
|
||||
|
||||
---
|
||||
### TODO:
|
||||
|
||||
- Używać https://github.com/InteractiveAdvertisingBureau/iabtcf-es/tree/master/modules/core#iabtcfcore do wizualizacji "zgód" zebranych przez CMP-y od IAB
|
||||
|
Before Width: | Height: | Size: 460 KiB |
Before Width: | Height: | Size: 21 KiB |
@ -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 |
@ -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 |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 240 B |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 2.9 KiB |
@ -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 |
@ -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 |
@ -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 |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 492 B |
@ -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 |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 331 B |
@ -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 |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 2.5 KiB |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.83 11L11.41 7.41L10 6L4 12L10 18L11.41 16.59L7.83 13H20V11H7.83Z" fill="#2E3A59"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 198 B |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 334 B |
@ -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"
|
||||
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 width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/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"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 590 B |
Before Width: | Height: | Size: 480 KiB |
Before Width: | Height: | Size: 526 KiB |
Before Width: | Height: | Size: 414 KiB |
Before Width: | Height: | Size: 275 KiB |
Before Width: | Height: | Size: 316 KiB |
Before Width: | Height: | Size: 139 KiB |
Before Width: | Height: | Size: 215 KiB |
Before Width: | Height: | Size: 362 KiB |
Before Width: | Height: | Size: 468 KiB |
Before Width: | Height: | Size: 752 KiB |
Before Width: | Height: | Size: 346 KiB |
BIN
border-48.png
Normal file
After Width: | Height: | Size: 225 B |
@ -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());
|
||||
}
|
@ -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;
|
||||
}
|
||||
}
|
@ -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 są 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 są
|
||||
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 ją 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>
|
||||
);
|
||||
}
|
@ -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 tę 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>
|
||||
</>
|
||||
);
|
||||
}
|
@ -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ą
|
||||
ją 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>
|
||||
</>
|
||||
),
|
||||
};
|
@ -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;
|
||||
}
|
||||
}
|
@ -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 są 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} tę
|
||||
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),
|
||||
],
|
||||
};
|
||||
}
|
@ -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;
|
||||
}
|
@ -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 są
|
||||
właścicielami domen:
|
||||
</p>
|
||||
) : (
|
||||
<p>
|
||||
Państwa strona ujawnia dane użytkowników podmiotom, które są
|
||||
właścicielami następujących domen:
|
||||
</p>
|
||||
)
|
||||
) : (
|
||||
<p>
|
||||
Poprzez skrypty osadzone na stronie dane osobowe użytkownika końcowego są
|
||||
przekazywane podmiotom, którzy są właścicielami następujacych domen:
|
||||
</p>
|
||||
)}
|
||||
{this.getRangeDescription()}
|
||||
<p>
|
||||
Na stronie brakuje jednak jakichkolwiek informacji o tym, jakie są cele
|
||||
przetwarzania takich danych oraz jakie są 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;
|
||||
}
|
||||
}
|
@ -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>
|
||||
);
|
||||
}
|
||||
}
|
@ -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 są 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>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
@ -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 są 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 tę 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>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
@ -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 są 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>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
@ -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 są 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 są 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 są cele
|
||||
ujawniania wyżej opisanych danych wyżej opisanym podmiotom trzecim.
|
||||
</p>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
@ -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)}) są 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>
|
||||
) : (
|
||||
''
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
@ -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} />;
|
||||
}
|
@ -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;
|
@ -1,3 +0,0 @@
|
||||
export function reportIntro(visited_url: string) {
|
||||
return <h2>Analiza skryptów śledzących na {visited_url} - raport</h2>;
|
||||
}
|
@ -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>
|
@ -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;
|
||||
}
|
@ -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'));
|
@ -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;
|
||||
}
|
||||
}
|
@ -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ć tę 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 są wysyłane do żadnych podmiotów trzecich i są
|
||||
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 są 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>
|
||||
);
|
||||
}
|
@ -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;
|
||||
}
|
@ -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;
|
||||
}
|
@ -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>
|
@ -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'));
|
@ -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>
|
||||
);
|
||||
}
|
@ -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>
|
||||
);
|
||||
}
|
@ -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>
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -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'));
|
13
diag.html
@ -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>
|
65
diag.tsx
@ -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')
|
||||
);
|
@ -1,68 +1,29 @@
|
||||
import esbuild from 'esbuild';
|
||||
import scss from 'esbuild-plugin-sass';
|
||||
|
||||
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',
|
||||
};
|
||||
});
|
||||
},
|
||||
};
|
||||
import svg from 'esbuild-plugin-svgr';
|
||||
|
||||
esbuild
|
||||
.build({
|
||||
entryPoints: [
|
||||
'components/toolbar/toolbar.tsx',
|
||||
'components/sidebar/sidebar.tsx',
|
||||
'components/report-window/report-window.tsx',
|
||||
'sidebar/sidebar.tsx',
|
||||
'test.ts',
|
||||
'report-window/report-window.tsx',
|
||||
'background.ts',
|
||||
'diag.tsx',
|
||||
'styles/global.scss',
|
||||
'styles/fonts.scss',
|
||||
],
|
||||
bundle: true,
|
||||
// minify: true,
|
||||
outdir: './lib',
|
||||
loader: { '.woff': 'file', '.woff2': 'file' },
|
||||
plugins: [scss(), skipReactImports],
|
||||
define: {
|
||||
PLUGIN_NAME: '"Rentgen"',
|
||||
PLUGIN_URL: '"https://addons.mozilla.org/pl/firefox/addon/rentgen/"',
|
||||
plugins: [scss(), svg()],
|
||||
watch: {
|
||||
onRebuild(error, result) {
|
||||
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));
|
||||
|
||||
// npx esbuild sidebar/sidebar.tsx test.ts --bundle report-window/report-window.tsx --bundle background.ts --bundle --outdir=./lib
|
||||
|
@ -1,418 +1,413 @@
|
||||
'use strict';
|
||||
import { DataLocation, StolenDataEntry } from './stolen-data-entry';
|
||||
import { StolenDataEntry } from "./stolen-data-entry";
|
||||
import {
|
||||
flattenObjectEntries,
|
||||
getshorthost,
|
||||
parseCookie,
|
||||
Request,
|
||||
safeDecodeURIComponent,
|
||||
} from './util';
|
||||
flattenObjectEntries,
|
||||
getshorthost,
|
||||
parseCookie,
|
||||
Request,
|
||||
safeDecodeURIComponent,
|
||||
} from "./util";
|
||||
|
||||
type NameValue = { name: string; value: string };
|
||||
|
||||
export type HAREntry = {
|
||||
pageref: string;
|
||||
startedDateTime: string;
|
||||
request: {
|
||||
bodySize: number;
|
||||
cookies: NameValue[];
|
||||
headers: NameValue[];
|
||||
headersSize: number;
|
||||
httpVersion: string;
|
||||
method: string;
|
||||
postData?: {
|
||||
mimeType: string;
|
||||
params: (NameValue & {
|
||||
fileName: string;
|
||||
contentType: string;
|
||||
comment: '';
|
||||
})[];
|
||||
text: string;
|
||||
};
|
||||
queryString: NameValue[];
|
||||
url: string;
|
||||
pageref: string;
|
||||
startedDateTime: string;
|
||||
request: {
|
||||
bodySize: number;
|
||||
cookies: NameValue[];
|
||||
headers: NameValue[];
|
||||
headersSize: number;
|
||||
httpVersion: string;
|
||||
method: string;
|
||||
postData?: {
|
||||
mimeType: string;
|
||||
params: (NameValue & {
|
||||
fileName: string;
|
||||
contentType: string;
|
||||
comment: "";
|
||||
})[];
|
||||
text: string;
|
||||
};
|
||||
response: {
|
||||
status: number;
|
||||
statusText: string;
|
||||
httpVersion: string;
|
||||
headers: NameValue[];
|
||||
cookies: NameValue[];
|
||||
content: {
|
||||
mimeType: string;
|
||||
size: number;
|
||||
encoding: 'base64';
|
||||
text: string;
|
||||
};
|
||||
redirectURL: '';
|
||||
headersSize: number;
|
||||
bodySize: number;
|
||||
}; // not relevant
|
||||
cache: {};
|
||||
timings: {};
|
||||
time: number;
|
||||
_securityState: string;
|
||||
serverIPAddress: string;
|
||||
connection: string;
|
||||
queryString: NameValue[];
|
||||
url: string;
|
||||
};
|
||||
response: {
|
||||
status: number;
|
||||
statusText: string;
|
||||
httpVersion: string;
|
||||
headers: NameValue[];
|
||||
cookies: NameValue[];
|
||||
content: {
|
||||
mimeType: string;
|
||||
size: number;
|
||||
encoding: "base64";
|
||||
text: string;
|
||||
};
|
||||
redirectURL: "";
|
||||
headersSize: number;
|
||||
bodySize: number;
|
||||
}; // not relevant
|
||||
cache: {};
|
||||
timings: {};
|
||||
time: number;
|
||||
_securityState: string;
|
||||
serverIPAddress: string;
|
||||
connection: string;
|
||||
};
|
||||
|
||||
const whitelisted_cookies = [
|
||||
/^Accept.*$/,
|
||||
/^Host$/,
|
||||
/^Connection$/,
|
||||
/^Sec-Fetch-.*$/,
|
||||
/^Content-Type$/,
|
||||
/^Cookie$/, // we're extracting it in getCookie separately anyway
|
||||
/^User-Agent$/,
|
||||
/^Accept.*$/,
|
||||
/^Host$/,
|
||||
/^Connection$/,
|
||||
/^Sec-Fetch-.*$/,
|
||||
/^Content-Type$/,
|
||||
/^Cookie$/, // we're extracting it in getCookie separately anyway
|
||||
/^User-Agent$/,
|
||||
];
|
||||
|
||||
type RequestBody = {
|
||||
error?: string;
|
||||
formData?: Record<string, string[]>;
|
||||
raw?: { bytes: ArrayBuffer; file?: string }[];
|
||||
error?: string;
|
||||
formData?: Record<string, string[]>;
|
||||
raw?: { bytes: ArrayBuffer; file?: string }[];
|
||||
};
|
||||
|
||||
export default class ExtendedRequest {
|
||||
public tabId: number;
|
||||
public url: string;
|
||||
public shorthost: string;
|
||||
public requestHeaders: { name: string; value?: string; binaryValue?: number[] }[] = [];
|
||||
public origin: string;
|
||||
public initialized = false;
|
||||
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 | null = null; // same as above
|
||||
public originalHost: string;
|
||||
public requestBody: RequestBody;
|
||||
public tabId: number;
|
||||
public url: string;
|
||||
public shorthost: string;
|
||||
public requestHeaders: Request["requestHeaders"] = [];
|
||||
public originalURL: string;
|
||||
public origin: string;
|
||||
public initialized = false;
|
||||
public stolenData: StolenDataEntry[];
|
||||
public originalPathname: string;
|
||||
public requestBody: RequestBody;
|
||||
|
||||
static by_id = {} as Record<string, ExtendedRequest>;
|
||||
public data: Request;
|
||||
static by_id = {} as Record<string, ExtendedRequest>;
|
||||
|
||||
constructor(data: Request) {
|
||||
this.tabId = data.tabId;
|
||||
this.url = data.url;
|
||||
this.shorthost = getshorthost(data.url);
|
||||
this.requestBody = ((data as any).requestBody as undefined | RequestBody) || {};
|
||||
ExtendedRequest.by_id[data.requestId] = this;
|
||||
constructor(public data: Request) {
|
||||
this.tabId = data.tabId;
|
||||
this.url = data.url;
|
||||
this.shorthost = getshorthost(data.url);
|
||||
this.requestBody =
|
||||
((data as any).requestBody as undefined | RequestBody) || {};
|
||||
if (this.url.includes("criteo")) {
|
||||
console.log(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?
|
||||
addHeaders(headers: Request["requestHeaders"]) {
|
||||
this.requestHeaders = headers;
|
||||
return this;
|
||||
}
|
||||
|
||||
// console.log('→→→',(this.data as any).frameAncestors, (data as any).frameAncestors);
|
||||
async init() {
|
||||
await this.cacheOrigin();
|
||||
this.initialized = true;
|
||||
this.stolenData = this.getAllStolenData();
|
||||
}
|
||||
|
||||
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
|
||||
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() {
|
||||
const request_url = new URL(this.data.url);
|
||||
const origin_url = new URL(this.originalURL);
|
||||
if (request_url.host.includes(origin_url.host)) {
|
||||
return false;
|
||||
}
|
||||
if (getshorthost(request_url.host) == getshorthost(origin_url.host)) {
|
||||
return false;
|
||||
}
|
||||
return (
|
||||
request_url.origin != origin_url.origin ||
|
||||
(this.data as any).urlClassification.thirdParty.length > 0
|
||||
);
|
||||
}
|
||||
|
||||
getReferer() {
|
||||
return (
|
||||
this.requestHeaders.filter((h) => h.name === "Referer")[0]?.value ||
|
||||
"missing-referrer"
|
||||
);
|
||||
}
|
||||
|
||||
exposesOrigin() {
|
||||
const url = new URL(this.originalURL);
|
||||
const host = url.host;
|
||||
const path = url.pathname;
|
||||
const shorthost = getshorthost(host);
|
||||
if (this.getReferer().includes(shorthost)) {
|
||||
return true;
|
||||
}
|
||||
for (const entry of this.stolenData) {
|
||||
if (
|
||||
entry.value.includes(host) ||
|
||||
entry.value.includes(path) ||
|
||||
entry.value.includes(shorthost)
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
private getAllStolenData(): StolenDataEntry[] {
|
||||
return [
|
||||
...this.getPathParams(),
|
||||
...this.getCookieData(),
|
||||
...this.getQueryParams(),
|
||||
...this.getHeadersData(),
|
||||
...this.getRequestBodyData(),
|
||||
];
|
||||
}
|
||||
|
||||
getCookieData(): StolenDataEntry[] {
|
||||
if (!this.hasCookie() || this.getCookie() === undefined) {
|
||||
return [];
|
||||
}
|
||||
return flattenObjectEntries(
|
||||
Object.entries(parseCookie(this.getCookie())).map(([key, value]) => [
|
||||
key,
|
||||
value || "",
|
||||
]),
|
||||
StolenDataEntry.parseValue
|
||||
).map(([key, value]) => new StolenDataEntry(this, "cookie", key, value));
|
||||
}
|
||||
|
||||
getRequestBodyData(): StolenDataEntry[] {
|
||||
const ret = flattenObjectEntries(
|
||||
Object.entries({
|
||||
...this.requestBody.formData,
|
||||
...Object.fromEntries(
|
||||
Object.entries(
|
||||
this.requestBody.raw || {}
|
||||
).map(([key, value], index) => [`${key}.${index}`, value])
|
||||
),
|
||||
}).map(([key, value]) => {
|
||||
// to handle how ocdn.eu encrypts POST body on https://businessinsider.com.pl/
|
||||
if (
|
||||
(Array.isArray(value) && value.length === 1 && !value[0]) ||
|
||||
!value
|
||||
) {
|
||||
url = (this.data as any).frameAncestors.at(-1).url || '';
|
||||
url_comes_from = 'frameAncestors';
|
||||
return ["requestBody", key];
|
||||
} else if (!Array.isArray(value)) {
|
||||
return [
|
||||
"raw",
|
||||
String.fromCharCode.apply(null, new Uint8Array(value.bytes)),
|
||||
];
|
||||
} else {
|
||||
url = this.data.documentUrl || this.data.originUrl;
|
||||
url_comes_from = 'last resort';
|
||||
return [key, value || ""];
|
||||
}
|
||||
}),
|
||||
StolenDataEntry.parseValue
|
||||
).map(
|
||||
([key, value]) => new StolenDataEntry(this, "request_body", key, value)
|
||||
);
|
||||
return ret;
|
||||
}
|
||||
|
||||
this.originalURL = is_full_url ? url : null;
|
||||
this.origin = new URL(url).origin;
|
||||
hasReferer() {
|
||||
return this.requestHeaders.some((h) => h.name === "Referer");
|
||||
}
|
||||
|
||||
this.originalHost = new URL(url).host;
|
||||
this.originalPathname = is_full_url ? new URL(url).pathname : null;
|
||||
hasCookie() {
|
||||
return this.requestHeaders.some((h) => h.name === "Cookie");
|
||||
}
|
||||
|
||||
getCookie(): string {
|
||||
return this.requestHeaders.find((h) => h.name == "Cookie")?.value;
|
||||
}
|
||||
|
||||
getPathParams(): StolenDataEntry[] {
|
||||
const url = new URL(this.data.url);
|
||||
const path = url.pathname;
|
||||
if (!path.includes(";")) {
|
||||
return [];
|
||||
}
|
||||
return flattenObjectEntries(
|
||||
path
|
||||
.split(";")
|
||||
.map((e) => e.split("="))
|
||||
.map(([key, value]) => [key, value || ""])
|
||||
.map(([key, value]) => {
|
||||
return [
|
||||
key,
|
||||
StolenDataEntry.parseValue(safeDecodeURIComponent(value)),
|
||||
];
|
||||
})
|
||||
).map(([key, value]) => new StolenDataEntry(this, "pathname", key, value));
|
||||
}
|
||||
|
||||
addHeaders(headers: Request['requestHeaders']) {
|
||||
this.requestHeaders = headers || [];
|
||||
return this;
|
||||
}
|
||||
getQueryParams(): StolenDataEntry[] {
|
||||
const url = new URL(this.data.url);
|
||||
return flattenObjectEntries(
|
||||
Array.from((url.searchParams as any).entries())
|
||||
.map(([key, value]) => [key, value || ""])
|
||||
.map(([key, value]) => {
|
||||
return [
|
||||
key,
|
||||
StolenDataEntry.parseValue(safeDecodeURIComponent(value)),
|
||||
];
|
||||
})
|
||||
).map(([key, value]) => {
|
||||
return new StolenDataEntry(this, "queryparams", key, value);
|
||||
});
|
||||
}
|
||||
|
||||
init() {
|
||||
this.initialized = true;
|
||||
this.stolenData = this.getAllStolenData();
|
||||
}
|
||||
|
||||
isThirdParty() {
|
||||
const request_url = new URL(this.data.url);
|
||||
if (request_url.host.includes(this.originalHost)) {
|
||||
return false;
|
||||
}
|
||||
if (getshorthost(request_url.host) == getshorthost(this.originalHost)) {
|
||||
return false;
|
||||
}
|
||||
return (
|
||||
request_url.origin != this.origin ||
|
||||
(this.data as any).urlClassification.thirdParty.length > 0
|
||||
);
|
||||
}
|
||||
|
||||
getReferer() {
|
||||
return (
|
||||
this.requestHeaders.filter((h) => h.name === 'Referer')[0]?.value || 'missing-referrer'
|
||||
);
|
||||
}
|
||||
|
||||
exposesOriginWhere(): null | DataLocation {
|
||||
const host = this.originalHost;
|
||||
const path = this.originalPathname || '/';
|
||||
const shorthost = getshorthost(host);
|
||||
if (this.getReferer().includes(shorthost)) {
|
||||
return { path: this.url, source: 'header', key: 'Referer' };
|
||||
}
|
||||
for (const entry of this.stolenData) {
|
||||
if (
|
||||
entry.value.includes(host) ||
|
||||
entry.value.includes(path) ||
|
||||
entry.value.includes(shorthost)
|
||||
) {
|
||||
return entry.toDataLocation();
|
||||
getHeadersData(): StolenDataEntry[] {
|
||||
return flattenObjectEntries(
|
||||
this.requestHeaders
|
||||
.filter((header) => {
|
||||
for (const regex of whitelisted_cookies) {
|
||||
if (regex.test(header.name)) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.map((header) => {
|
||||
return [
|
||||
header.name,
|
||||
StolenDataEntry.parseValue(safeDecodeURIComponent(header.value)),
|
||||
];
|
||||
})
|
||||
).map(([key, value]) => new StolenDataEntry(this, "header", key, value));
|
||||
}
|
||||
|
||||
exposesOrigin() {
|
||||
return this.exposesOriginWhere() !== null;
|
||||
}
|
||||
hasMark() {
|
||||
return this.stolenData.some((data) => data.isMarked);
|
||||
}
|
||||
|
||||
private getAllStolenData(): StolenDataEntry[] {
|
||||
return [
|
||||
...this.getPathParams(),
|
||||
...this.getCookieData(),
|
||||
...this.getQueryParams(),
|
||||
...this.getHeadersData(),
|
||||
...this.getRequestBodyData(),
|
||||
];
|
||||
}
|
||||
getMarkedEntries() {
|
||||
return this.stolenData.filter((data) => data.isMarked);
|
||||
}
|
||||
|
||||
getCookieData(): StolenDataEntry[] {
|
||||
if (!this.hasCookie() || this.getCookie() === undefined) {
|
||||
return [];
|
||||
}
|
||||
return flattenObjectEntries(
|
||||
Object.entries(parseCookie(this.getCookie())).map(([key, value]) => [key, value || '']),
|
||||
StolenDataEntry.parseValue
|
||||
).map(([key, value]) => new StolenDataEntry(this, 'cookie', key, value));
|
||||
}
|
||||
getHost() {
|
||||
return new URL(this.url).host;
|
||||
}
|
||||
|
||||
getRequestBodyData(): StolenDataEntry[] {
|
||||
const ret = flattenObjectEntries(
|
||||
Object.entries({
|
||||
...this.requestBody.formData,
|
||||
...Object.fromEntries(
|
||||
Object.entries(this.requestBody.raw || {}).map(([key, value], index) => [
|
||||
`${key}.${index}`,
|
||||
value,
|
||||
])
|
||||
),
|
||||
}).map(([key, value]) => {
|
||||
// to handle how ocdn.eu encrypts POST body on https://businessinsider.com.pl/
|
||||
if ((Array.isArray(value) && value.length === 1 && !value[0]) || !value) {
|
||||
return ['requestBody', key];
|
||||
} else if (!Array.isArray(value)) {
|
||||
return [
|
||||
'raw',
|
||||
String.fromCharCode.apply(null, Array.from(new Uint8Array(value.bytes))),
|
||||
];
|
||||
} else {
|
||||
return [key, value || ''];
|
||||
}
|
||||
}),
|
||||
StolenDataEntry.parseValue
|
||||
).map(([key, value]) => new StolenDataEntry(this, 'request_body', key, value));
|
||||
return ret;
|
||||
}
|
||||
matchesHAREntry(har: HAREntry): boolean {
|
||||
const rq = this.data;
|
||||
const hrq = har.request;
|
||||
return rq.url == hrq.url;
|
||||
}
|
||||
|
||||
hasReferer() {
|
||||
return this.requestHeaders.some((h) => h.name === 'Referer');
|
||||
}
|
||||
toHAR(): HAREntry {
|
||||
return {
|
||||
pageref: "page_1",
|
||||
startedDateTime: `${new Date().toJSON().replace("Z", "+01:00")}`,
|
||||
request: {
|
||||
bodySize:
|
||||
JSON.stringify(this.requestBody.formData || {}).length +
|
||||
(this.requestBody.raw || [])
|
||||
.map((e) => e.bytes.byteLength)
|
||||
.reduce((a, b) => a + b, 0),
|
||||
method: this.data.method,
|
||||
url: this.data.url,
|
||||
headersSize: JSON.stringify(this.requestHeaders).length,
|
||||
httpVersion: "HTTP/2",
|
||||
headers: this.requestHeaders as NameValue[],
|
||||
cookies: this.getCookieData().map((cookie) => ({
|
||||
name: cookie.name,
|
||||
value: cookie.value,
|
||||
})),
|
||||
queryString: this.getQueryParams().map((param) => ({
|
||||
name: param.name,
|
||||
value: param.value,
|
||||
})),
|
||||
postData: {
|
||||
mimeType: "application/x-www-form-urlencoded",
|
||||
params: this.stolenData
|
||||
.filter((e) => e.source == "request_body")
|
||||
.map((e) => ({
|
||||
name: e.name,
|
||||
value: e.value,
|
||||
fileName: "--" + Math.ceil(Math.random() * 1000000000),
|
||||
contentType: "text/plain",
|
||||
comment: "",
|
||||
})),
|
||||
text: this.stolenData
|
||||
.filter((e) => e.source == "request_body")
|
||||
.map((e) => `${e.name}:\t${StolenDataEntry.parseValue(e.value)}`)
|
||||
.join("\n\n"),
|
||||
},
|
||||
},
|
||||
response: {
|
||||
status: 200,
|
||||
statusText: "OK",
|
||||
httpVersion: "HTTP/2",
|
||||
headers: [],
|
||||
cookies: [],
|
||||
content: {
|
||||
mimeType: "text/plain",
|
||||
size: this.getBalancedPriority(),
|
||||
encoding: "base64",
|
||||
text: "ZG9lc24ndCBtYXR0ZXIK",
|
||||
},
|
||||
redirectURL: "",
|
||||
headersSize: 15,
|
||||
bodySize: 15,
|
||||
},
|
||||
cache: {},
|
||||
timings: {
|
||||
blocked: -1,
|
||||
dns: 0,
|
||||
connect: 0,
|
||||
ssl: 0,
|
||||
send: 0,
|
||||
wait: 79,
|
||||
receive: 0,
|
||||
},
|
||||
time: 79,
|
||||
_securityState: "secure",
|
||||
serverIPAddress: "31.13.92.36",
|
||||
connection: "443",
|
||||
};
|
||||
}
|
||||
|
||||
hasCookie() {
|
||||
return this.requestHeaders.some((h) => h.name === 'Cookie');
|
||||
}
|
||||
getMaxPriority(): number {
|
||||
return Math.max(...this.stolenData.map((entry) => entry.getPriority()));
|
||||
}
|
||||
|
||||
getCookie(): string {
|
||||
return this.requestHeaders.find((h) => h.name == 'Cookie')?.value || '';
|
||||
getBalancedPriority(): number {
|
||||
let result = 0;
|
||||
if (this.stolenData.some((e) => e.exposesPath())) {
|
||||
result += 50;
|
||||
}
|
||||
|
||||
getPathParams(): StolenDataEntry[] {
|
||||
const url = new URL(this.data.url);
|
||||
const path = url.pathname;
|
||||
if (!path.includes(';')) {
|
||||
return [];
|
||||
}
|
||||
return flattenObjectEntries(
|
||||
path
|
||||
.split(';')
|
||||
.map((e) => e.split('='))
|
||||
.map(([key, value]) => [key, value || ''])
|
||||
.map(([key, value]) => {
|
||||
return [key, StolenDataEntry.parseValue(safeDecodeURIComponent(value))];
|
||||
})
|
||||
).map(([key, value]) => new StolenDataEntry(this, 'pathname', key, value));
|
||||
if (this.stolenData.some((e) => e.exposesHost())) {
|
||||
result += 50;
|
||||
}
|
||||
|
||||
getQueryParams(): StolenDataEntry[] {
|
||||
const url = new URL(this.data.url);
|
||||
return flattenObjectEntries(
|
||||
(Array.from((url.searchParams as any).entries()) as [string, string][])
|
||||
.map(([key, value]: [string, string]) => [key, value || ''])
|
||||
.map(([key, value]) => {
|
||||
return [key, StolenDataEntry.parseValue(safeDecodeURIComponent(value))];
|
||||
})
|
||||
).map(([key, value]) => {
|
||||
return new StolenDataEntry(this, 'queryparams', key, value);
|
||||
});
|
||||
if (this.hasCookie()) {
|
||||
result += 50;
|
||||
}
|
||||
|
||||
getHeadersData(): StolenDataEntry[] {
|
||||
return flattenObjectEntries(
|
||||
this.requestHeaders
|
||||
.filter((header) => {
|
||||
for (const regex of whitelisted_cookies) {
|
||||
if (regex.test(header.name)) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.map((header) => {
|
||||
return [
|
||||
header.name,
|
||||
StolenDataEntry.parseValue(safeDecodeURIComponent(header.value || '')),
|
||||
];
|
||||
})
|
||||
).map(([key, value]) => new StolenDataEntry(this, 'header', key, value));
|
||||
if (this.stolenData.some((e) => e.classification === "location")) {
|
||||
result += 300;
|
||||
}
|
||||
|
||||
hasMark() {
|
||||
return this.stolenData.some((data) => data.isMarked);
|
||||
}
|
||||
|
||||
getMarkedEntries() {
|
||||
return this.stolenData.filter((data) => data.isMarked);
|
||||
}
|
||||
|
||||
unmarkAllEntries() {
|
||||
this.stolenData.forEach((entry) => entry.unmark());
|
||||
}
|
||||
|
||||
getHost() {
|
||||
return new URL(this.url).host;
|
||||
}
|
||||
|
||||
matchesHAREntry(har: HAREntry): boolean {
|
||||
const rq = this.data;
|
||||
const hrq = har.request;
|
||||
return rq.url == hrq.url;
|
||||
}
|
||||
|
||||
toHAR(): HAREntry {
|
||||
return {
|
||||
pageref: 'page_1',
|
||||
startedDateTime: `${new Date().toJSON().replace('Z', '+01:00')}`,
|
||||
request: {
|
||||
bodySize:
|
||||
JSON.stringify(this.requestBody.formData || {}).length +
|
||||
(this.requestBody.raw || [])
|
||||
.map((e) => e.bytes.byteLength)
|
||||
.reduce((a, b) => a + b, 0),
|
||||
method: this.data.method,
|
||||
url: this.data.url,
|
||||
headersSize: JSON.stringify(this.requestHeaders).length,
|
||||
httpVersion: 'HTTP/2',
|
||||
headers: this.requestHeaders as NameValue[],
|
||||
cookies: this.getCookieData().map((cookie) => ({
|
||||
name: cookie.name,
|
||||
value: cookie.value,
|
||||
})),
|
||||
queryString: this.getQueryParams().map((param) => ({
|
||||
name: param.name,
|
||||
value: param.value,
|
||||
})),
|
||||
postData: {
|
||||
mimeType: 'application/x-www-form-urlencoded',
|
||||
params: this.stolenData
|
||||
.filter((e) => e.source == 'request_body')
|
||||
.map((e) => ({
|
||||
name: e.name,
|
||||
value: e.value,
|
||||
fileName: '--' + Math.ceil(Math.random() * 1000000000),
|
||||
contentType: 'text/plain',
|
||||
comment: '',
|
||||
})),
|
||||
text: this.stolenData
|
||||
.filter((e) => e.source == 'request_body')
|
||||
.map((e) => `${e.name}:\t${StolenDataEntry.parseValue(e.value)}`)
|
||||
.join('\n\n'),
|
||||
},
|
||||
},
|
||||
response: {
|
||||
status: 200,
|
||||
statusText: 'OK',
|
||||
httpVersion: 'HTTP/2',
|
||||
headers: [],
|
||||
cookies: [],
|
||||
content: {
|
||||
mimeType: 'text/plain',
|
||||
size: this.getBalancedPriority(),
|
||||
encoding: 'base64',
|
||||
text: 'ZG9lc24ndCBtYXR0ZXIK',
|
||||
},
|
||||
redirectURL: '',
|
||||
headersSize: 15,
|
||||
bodySize: 15,
|
||||
},
|
||||
cache: {},
|
||||
timings: {
|
||||
blocked: -1,
|
||||
dns: 0,
|
||||
connect: 0,
|
||||
ssl: 0,
|
||||
send: 0,
|
||||
wait: 79,
|
||||
receive: 0,
|
||||
},
|
||||
time: 79,
|
||||
_securityState: 'secure',
|
||||
serverIPAddress: '31.13.92.36',
|
||||
connection: '443',
|
||||
};
|
||||
}
|
||||
|
||||
getMaxPriority(): number {
|
||||
return Math.max(...this.stolenData.map((entry) => entry.getPriority()));
|
||||
}
|
||||
|
||||
getBalancedPriority(): number {
|
||||
let result = 0;
|
||||
if (this.stolenData.some((e) => e.exposesPath())) {
|
||||
result += 50;
|
||||
}
|
||||
if (this.stolenData.some((e) => e.exposesHost())) {
|
||||
result += 50;
|
||||
}
|
||||
if (this.hasCookie()) {
|
||||
result += 50;
|
||||
}
|
||||
if (this.stolenData.some((e) => e.classification === 'location')) {
|
||||
result += 300;
|
||||
}
|
||||
if (this.url.includes('facebook')) {
|
||||
result += 50;
|
||||
}
|
||||
return result;
|
||||
if (this.url.includes("facebook")) {
|
||||
result += 50;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
|
BIN
icons/border-48.png
Normal file
After Width: | Height: | Size: 225 B |
BIN
icons/logo-black-square.png
Normal file
After Width: | Height: | Size: 62 KiB |
97
icons/logo-black-square.svg
Normal 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 |
@ -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,
|
||||
"name": "Rentgen",
|
||||
"short_name": "Rentgen",
|
||||
"version": "0.1.10",
|
||||
"author": "Kuba Orlik, Arkadiusz Wieczorek (Internet. Czas działać!)",
|
||||
"homepage_url": "https://git.internet-czas-dzialac.pl/icd/rentgen",
|
||||
"name": "Problematyczne requesty",
|
||||
"version": "1.0",
|
||||
|
||||
"description": "",
|
||||
|
||||
"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": {
|
||||
"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": {
|
||||
"16": "assets/icon-addon.svg",
|
||||
"32": "assets/icon-addon.svg",
|
||||
"64": "assets/icon-addon.svg"
|
||||
"48": "icons/border-48.png"
|
||||
},
|
||||
"permissions": [
|
||||
"proxy",
|
||||
@ -35,11 +27,9 @@
|
||||
"cookies",
|
||||
"privacy"
|
||||
],
|
||||
|
||||
"browser_specific_settings": {
|
||||
"gecko": {
|
||||
"id": "rentgen@internet-czas-dzialac.pl",
|
||||
"strict_min_version": "91.1.0"
|
||||
"id": "problematic-requests@internet-czas-dzialac.pl"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
175
memory.ts
@ -1,110 +1,101 @@
|
||||
import ExtendedRequest from './extended-request';
|
||||
import { getshorthost } from './util';
|
||||
import { RequestCluster } from './request-cluster';
|
||||
import { SaferEmitter } from './safer-emitter';
|
||||
import ExtendedRequest from "./extended-request";
|
||||
import { getshorthost, makeThrottle } from "./util";
|
||||
import { EventEmitter } from "events";
|
||||
import { RequestCluster } from "./request-cluster";
|
||||
|
||||
function setDomainsCount(counter: number, tabId: number) {
|
||||
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>>;
|
||||
async register(request: ExtendedRequest) {
|
||||
await request.init();
|
||||
if (!request.isThirdParty()) {
|
||||
return;
|
||||
}
|
||||
if (!this.origin_to_history[request.origin]) {
|
||||
this.origin_to_history[request.origin] = {};
|
||||
}
|
||||
const shorthost = getshorthost(new URL(request.url).host);
|
||||
if (!this.origin_to_history[request.origin][shorthost]) {
|
||||
const cluster = new RequestCluster(shorthost);
|
||||
this.origin_to_history[request.origin][shorthost] = cluster;
|
||||
}
|
||||
this.origin_to_history[request.origin][shorthost].add(request);
|
||||
this.emit('change', shorthost);
|
||||
|
||||
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
|
||||
);
|
||||
}
|
||||
export default class Memory extends EventEmitter {
|
||||
origin_to_history = {} as Record<string, Record<string, RequestCluster>>;
|
||||
private throttle = makeThrottle(200);
|
||||
async register(request: ExtendedRequest) {
|
||||
await request.init();
|
||||
// console.log("registering request for", request.origin);
|
||||
if (!request.isThirdParty()) {
|
||||
return;
|
||||
}
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
browser.webRequest.onBeforeRequest.addListener(
|
||||
async (request) => {
|
||||
new ExtendedRequest(request);
|
||||
},
|
||||
{ urls: ['<all_urls>'] },
|
||||
['requestBody']
|
||||
);
|
||||
browser.webRequest.onBeforeSendHeaders.addListener(
|
||||
async (request) => {
|
||||
const extendedRequest = ExtendedRequest.by_id[request.requestId].addHeaders(
|
||||
request.requestHeaders || []
|
||||
);
|
||||
this.register(extendedRequest);
|
||||
},
|
||||
{ urls: ['<all_urls>'] },
|
||||
['requestHeaders']
|
||||
);
|
||||
if (!this.origin_to_history[request.origin]) {
|
||||
this.origin_to_history[request.origin] = {};
|
||||
}
|
||||
|
||||
emit(eventName: string, data = 'any'): boolean {
|
||||
setTimeout(() => super.emit(eventName, data), 0);
|
||||
return true;
|
||||
const shorthost = getshorthost(new URL(request.url).host);
|
||||
if (!this.origin_to_history[request.origin][shorthost]) {
|
||||
const cluster = new RequestCluster(shorthost);
|
||||
this.origin_to_history[request.origin][shorthost] = cluster;
|
||||
}
|
||||
this.origin_to_history[request.origin][shorthost].add(request);
|
||||
this.emit("change");
|
||||
}
|
||||
|
||||
getClustersForOrigin(origin: string): Record<string, RequestCluster> {
|
||||
return this.origin_to_history[origin] || {};
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
browser.webRequest.onBeforeRequest.addListener(
|
||||
async (request) => {
|
||||
new ExtendedRequest(request);
|
||||
},
|
||||
{ urls: ["<all_urls>"] },
|
||||
["requestBody"]
|
||||
);
|
||||
browser.webRequest.onBeforeSendHeaders.addListener(
|
||||
async (request) => {
|
||||
const extendedRequest = ExtendedRequest.by_id[
|
||||
request.requestId
|
||||
].addHeaders(request.requestHeaders || []);
|
||||
this.register(extendedRequest);
|
||||
},
|
||||
{ urls: ["<all_urls>"] },
|
||||
["requestHeaders"]
|
||||
);
|
||||
}
|
||||
|
||||
emit(eventName: string, immediate = false) {
|
||||
try {
|
||||
if (immediate) {
|
||||
super.emit(eventName);
|
||||
return;
|
||||
} else {
|
||||
this.throttle(() => super.emit(eventName));
|
||||
}
|
||||
return true;
|
||||
} catch (e) {
|
||||
// debugger;
|
||||
}
|
||||
}
|
||||
|
||||
async removeCookiesFor(origin: string, shorthost?: string): Promise<void> {
|
||||
if (shorthost) {
|
||||
const cookies = await browser.cookies.getAll({ domain: shorthost });
|
||||
for (const cookie of cookies) {
|
||||
await browser.cookies.remove({
|
||||
name: cookie.name,
|
||||
url: `https://${cookie.domain}`,
|
||||
});
|
||||
}
|
||||
} else {
|
||||
const clusters = this.getClustersForOrigin(origin);
|
||||
getClustersForOrigin(origin: string): Record<string, RequestCluster> {
|
||||
return this.origin_to_history[origin] || {};
|
||||
}
|
||||
|
||||
await Promise.all(
|
||||
Object.values(clusters)
|
||||
.filter((cluster) => !shorthost || cluster.id === shorthost)
|
||||
.map((cluster) => this.removeCookiesFor(origin, cluster.id))
|
||||
);
|
||||
}
|
||||
async removeCookiesFor(origin: string, shorthost?: string): Promise<void> {
|
||||
if (shorthost) {
|
||||
const cookies = await browser.cookies.getAll({ domain: shorthost });
|
||||
for (const cookie of cookies) {
|
||||
console.log("removing cookie", cookie.name, "from", cookie.domain);
|
||||
await browser.cookies.remove({
|
||||
name: cookie.name,
|
||||
url: `https://${cookie.domain}`,
|
||||
});
|
||||
}
|
||||
} else {
|
||||
const clusters = this.getClustersForOrigin(origin);
|
||||
|
||||
await Promise.all(
|
||||
Object.values(clusters)
|
||||
.filter((cluster) => !shorthost || cluster.id === shorthost)
|
||||
.map((cluster) => this.removeCookiesFor(origin, cluster.id))
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async removeRequestsFor(origin: string) {
|
||||
this.origin_to_history[origin] = {};
|
||||
}
|
||||
async removeRequestsFor(origin: string) {
|
||||
this.origin_to_history[origin] = {};
|
||||
}
|
||||
}
|
||||
|
||||
export function init() {
|
||||
const memory = new Memory();
|
||||
const memory = new Memory();
|
||||
|
||||
(window as any).memory = memory;
|
||||
(window as any).memory = memory;
|
||||
}
|
||||
|
||||
export function getMemory(): Memory {
|
||||
return (browser.extension.getBackgroundPage().window as any).memory as Memory;
|
||||
return (browser.extension.getBackgroundPage().window as any).memory as Memory;
|
||||
}
|
||||
|
52
options.scss
@ -1,9 +1,9 @@
|
||||
@import './styles/colors.scss';
|
||||
@import './sidebar/colors.scss';
|
||||
|
||||
.options-container {
|
||||
padding-top: 0.5rem;
|
||||
span {
|
||||
color: $ultra-black-color;
|
||||
color: $mid-grey;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
@ -17,13 +17,9 @@
|
||||
.label-checkbox {
|
||||
cursor: pointer;
|
||||
margin-left: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.input-container {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
@ -31,48 +27,4 @@
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
202
options.tsx
@ -1,4 +1,4 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import React from 'react';
|
||||
import './options.scss';
|
||||
|
||||
export default function Options({
|
||||
@ -10,11 +10,8 @@ export default function Options({
|
||||
setCookiesOrOriginOnly,
|
||||
warningDataDialogAck,
|
||||
setWarningDataDialogAck,
|
||||
detailsVisibility,
|
||||
setDetailsVisibility,
|
||||
setStolenDataView,
|
||||
removeCookies,
|
||||
removeRequests,
|
||||
logoVisibility,
|
||||
setLogoVisibility,
|
||||
}: {
|
||||
minValueLength: number;
|
||||
setMinValueLength: (n: number) => void;
|
||||
@ -24,114 +21,95 @@ export default function Options({
|
||||
setCookiesOrOriginOnly: (b: boolean) => void;
|
||||
warningDataDialogAck: boolean;
|
||||
setWarningDataDialogAck: (b: boolean) => void;
|
||||
detailsVisibility: boolean;
|
||||
setDetailsVisibility: (b: boolean) => void;
|
||||
setStolenDataView: (b: boolean) => void;
|
||||
removeCookies: () => void;
|
||||
removeRequests: () => void;
|
||||
logoVisibility: boolean;
|
||||
setLogoVisibility: (b: boolean) => void;
|
||||
}) {
|
||||
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">
|
||||
<span>Interfejs</span>
|
||||
<fieldset>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="detailsVisibility"
|
||||
checked={detailsVisibility}
|
||||
onChange={(e) => {
|
||||
setDetailsVisibility(e.target.checked);
|
||||
localStorage.setItem(
|
||||
'detailsVisibility',
|
||||
e.target.checked as unknown as string
|
||||
);
|
||||
}}
|
||||
/>
|
||||
<label className="label-checkbox" htmlFor="detailsVisibility">
|
||||
Wyświetlaj szczegóły pozyskanych danych
|
||||
</label>
|
||||
</div>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="warningDataDialogAck"
|
||||
checked={warningDataDialogAck}
|
||||
onChange={(e) => {
|
||||
setWarningDataDialogAck(e.target.checked);
|
||||
localStorage.setItem(
|
||||
'warningDataDialogAck',
|
||||
e.target.checked as unknown as string
|
||||
);
|
||||
}}
|
||||
/>
|
||||
<label className="label-checkbox" htmlFor="warningDataDialogAck">
|
||||
Wyświetlaj komunikat o pozyskiwanych danych
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<span>Ustawienia zaawansowane</span>
|
||||
<fieldset>
|
||||
<div className="input-container">
|
||||
<label htmlFor="minValueLength">
|
||||
Pokazuj tylko wartości o długości co najmniej{' '}
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
id="minValueLength"
|
||||
min={1}
|
||||
value={minValueLength}
|
||||
onChange={(e) => {
|
||||
setMinValueLength(parseInt(e.target.value));
|
||||
localStorage.setItem('minValueLength', e.target.value);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="cookiesOnly"
|
||||
checked={cookiesOnly}
|
||||
onChange={(e) => setCookiesOnly(e.target.checked)}
|
||||
/>
|
||||
<label className="label-checkbox" htmlFor="cookiesOnly">
|
||||
Pokazuj tylko dane z cookiesów
|
||||
</label>
|
||||
</div>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="cookiesOrOriginOnly"
|
||||
checked={cookiesOrOriginOnly}
|
||||
onChange={(e) => setCookiesOrOriginOnly(e.target.checked)}
|
||||
/>
|
||||
<label className="label-checkbox" htmlFor="cookiesOrOriginOnly">
|
||||
Pokazuj tylko dane z cookiesów lub z częścią historii przeglądania
|
||||
</label>
|
||||
</div>
|
||||
</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 className="button-container">
|
||||
<button onClick={() => removeCookies()}>
|
||||
<img src="/assets/icons/cookie.svg" width="20" height="20" />
|
||||
<span>Wyczyść ciasteczka</span>
|
||||
</button>
|
||||
</div>
|
||||
<div className="options-container">
|
||||
<span>Interfejs</span>
|
||||
<fieldset>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="logoVisibility"
|
||||
checked={logoVisibility}
|
||||
onChange={(e) => {
|
||||
setLogoVisibility(e.target.checked);
|
||||
localStorage.setItem(
|
||||
'logoVisibility',
|
||||
e.target.checked as unknown as string
|
||||
);
|
||||
}}
|
||||
/>
|
||||
<label className="label-checkbox" htmlFor="logoVisibility">
|
||||
Wyświetlaj logo <i>Internet. Czas działać!</i>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</Fragment>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="warningDataDialogAck"
|
||||
checked={warningDataDialogAck}
|
||||
onChange={(e) => {
|
||||
setWarningDataDialogAck(e.target.checked);
|
||||
localStorage.setItem(
|
||||
'warningDataDialogAck',
|
||||
e.target.checked as unknown as string
|
||||
);
|
||||
}}
|
||||
/>
|
||||
<label
|
||||
className="label-checkbox"
|
||||
htmlFor="warningDataDialogAck"
|
||||
>
|
||||
Wyświetlaj komunikat o pozyskiwanych danych
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<span>Ustawienia zaawansowane</span>
|
||||
<fieldset>
|
||||
<div className="input-container">
|
||||
<label htmlFor="minValueLength">
|
||||
Pokazuj tylko wartości o długości co najmniej{' '}
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
id="minValueLength"
|
||||
value={minValueLength}
|
||||
onChange={(e) =>
|
||||
setMinValueLength(parseInt(e.target.value))
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="cookiesOnly"
|
||||
checked={cookiesOnly}
|
||||
onChange={(e) => setCookiesOnly(e.target.checked)}
|
||||
/>
|
||||
<label className="label-checkbox" htmlFor="cookiesOnly">
|
||||
Pokazuj tylko dane z cookiesów
|
||||
</label>
|
||||
</div>
|
||||
<div className="input-container">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="cookiesOrOriginOnly"
|
||||
checked={cookiesOrOriginOnly}
|
||||
onChange={(e) =>
|
||||
setCookiesOrOriginOnly(e.target.checked)
|
||||
}
|
||||
/>
|
||||
<label
|
||||
className="label-checkbox"
|
||||
htmlFor="cookiesOrOriginOnly"
|
||||
>
|
||||
Pokazuj tylko dane z cookiesów lub z częścią historii
|
||||
przeglądania
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
15707
package-lock.json
generated
85
package.json
@ -1,55 +1,34 @@
|
||||
{
|
||||
"name": "rentgen",
|
||||
"version": "0.1.10",
|
||||
"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.",
|
||||
"main": "esbuild.config.js",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"build": "node esbuild.config.js",
|
||||
"watch": "node esbuild.config.js --watch",
|
||||
"ext-test": "web-ext run",
|
||||
"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": {
|
||||
"type": "git",
|
||||
"url": "https://git.internet-czas-dzialac.pl/icd/rentgen.git"
|
||||
},
|
||||
"homepage": "https://git.internet-czas-dzialac.pl/icd/rentgen",
|
||||
"author": "Kuba Orlik, Arkadiusz Wieczorek",
|
||||
"license": "GPL-3.0-or-later",
|
||||
"dependencies": {
|
||||
"@iabtcf/core": "^1.3.1",
|
||||
"@types/proposal-relative-indexing-method": "^0.1.0",
|
||||
"events": "^3.3.0",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"survey-core": "^1.9.8",
|
||||
"survey-react": "^1.9.8",
|
||||
"tai-password-strength": "^1.1.3"
|
||||
},
|
||||
"keywords": [
|
||||
"ciasteczka",
|
||||
"cookies",
|
||||
"icd",
|
||||
"internet czas działać",
|
||||
"internet-czas-dzialac",
|
||||
"privacy",
|
||||
"prywatność",
|
||||
"rentgen",
|
||||
"śledzenie",
|
||||
"tracking"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@types/events": "^3.0.0",
|
||||
"@types/react-dom": "^17.0.9",
|
||||
"addons-linter": "^4.7.0",
|
||||
"esbuild": "^0.14.14",
|
||||
"esbuild-plugin-sass": "^1.0.1",
|
||||
"typescript": "^4.6.4",
|
||||
"web-ext": "^6.7.0",
|
||||
"web-ext-types": "^3.2.1"
|
||||
}
|
||||
"name": "problematic-requests",
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"main": "esbuild.config.js",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"build": "node esbuild.config.js",
|
||||
"watch": "npm run build -- --watch",
|
||||
"typecheck": "tsc --noEmit"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://git.internet-czas-dzialac.pl/icd/problematic-requests.git"
|
||||
},
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@iabtcf/core": "^1.3.1",
|
||||
"@types/proposal-relative-indexing-method": "^0.1.0",
|
||||
"esbuild": "^0.13.3",
|
||||
"events": "^3.3.0",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"tai-password-strength": "^1.1.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/events": "^3.0.0",
|
||||
"@types/react-dom": "^17.0.9",
|
||||
"esbuild-plugin-sass": "^1.0.1",
|
||||
"esbuild-plugin-svgr": "^1.0.0",
|
||||
"web-ext-types": "^3.2.1"
|
||||
}
|
||||
}
|
||||
|
42
report-window/domain-summary.tsx
Normal 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>
|
||||
);
|
||||
}
|
232
report-window/email-template-1.tsx
Normal 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 są 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) są{' '}
|
||||
<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 są 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>
|
||||
);
|
||||
}
|
170
report-window/email-template-2-controls.tsx
Normal 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>
|
||||
);
|
||||
}
|
488
report-window/email-template-2.tsx
Normal 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: ' '.repeat(12) }}
|
||||
></span>
|
||||
<span style={{ color: 'gray' }}>({children})</span>
|
||||
<span
|
||||
dangerouslySetInnerHTML={{ __html: ' '.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 tę 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 są 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” — 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ść” — 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” — 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' ? (
|
||||
<>
|
||||
— 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
|
||||
— 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 ? (
|
||||
<>
|
||||
{' '}
|
||||
— 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 są
|
||||
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 są 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) są{' '}
|
||||
<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 są 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>
|
||||
</>
|
||||
);
|
||||
}
|
33
report-window/email-template.tsx
Normal 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>
|
||||
);
|
||||
}
|
@ -1,24 +1,25 @@
|
||||
import React from 'react';
|
||||
import { HAREntry } from '../../extended-request';
|
||||
import { StolenDataEntry } from '../../stolen-data-entry';
|
||||
import { getshorthost, unique } from '../../util';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { HAREntry } from '../extended-request';
|
||||
import { StolenDataEntry } from '../stolen-data-entry';
|
||||
import { getshorthost, unique } from '../util';
|
||||
|
||||
function handleNewFile(
|
||||
element: HTMLInputElement,
|
||||
entries: StolenDataEntry[],
|
||||
setFiltered: (arg0: Blob) => void
|
||||
setFiltered: (Blob) => void
|
||||
): void {
|
||||
const reader = new FileReader();
|
||||
reader.addEventListener('load', () => {
|
||||
const content = JSON.parse(reader.result as string);
|
||||
content.log.entries = content.log.entries.filter((har_entry: HAREntry) =>
|
||||
entries.some((entry) => entry.matchesHAREntry(har_entry))
|
||||
content.log.entries = content.log.entries.filter(
|
||||
(har_entry: HAREntry) =>
|
||||
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];
|
||||
if (!file) throw new Error('file empty?');
|
||||
reader.readAsText(file);
|
||||
reader.readAsText(element.files[0]);
|
||||
}
|
||||
|
||||
function generateFakeHAR(entries: StolenDataEntry[]) {
|
||||
@ -29,7 +30,10 @@ function generateFakeHAR(entries: StolenDataEntry[]) {
|
||||
} else if (request1.shorthost > request2.shorthost) {
|
||||
return 1;
|
||||
} else {
|
||||
return request2.getBalancedPriority() - request1.getBalancedPriority();
|
||||
return (
|
||||
request2.getBalancedPriority() -
|
||||
request1.getBalancedPriority()
|
||||
);
|
||||
}
|
||||
})
|
||||
.filter((_, index, array) => {
|
||||
@ -39,7 +43,10 @@ function generateFakeHAR(entries: StolenDataEntry[]) {
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.sort((entry1, entry2) => entry2.getBalancedPriority() - entry1.getBalancedPriority());
|
||||
.sort(
|
||||
(entry1, entry2) =>
|
||||
entry2.getBalancedPriority() - entry1.getBalancedPriority()
|
||||
);
|
||||
|
||||
return {
|
||||
log: {
|
||||
@ -68,11 +75,16 @@ function generateFakeHAR(entries: StolenDataEntry[]) {
|
||||
};
|
||||
}
|
||||
|
||||
export default function HARConverter({ entries }: { entries: StolenDataEntry[] }) {
|
||||
const [filtered, setFiltered] = React.useState<Blob | null>(null);
|
||||
const [filename, setFilename] = React.useState('');
|
||||
const [fakeHAR, setFakeHAR] = React.useState<ReturnType<typeof generateFakeHAR>>();
|
||||
React.useEffect(() => {
|
||||
export default function HARConverter({
|
||||
entries,
|
||||
}: {
|
||||
entries: StolenDataEntry[];
|
||||
}) {
|
||||
const [filtered, setFiltered] = useState<Blob | null>(null);
|
||||
const [filename, setFilename] = useState('');
|
||||
const [fakeHAR, setFakeHAR] =
|
||||
useState<ReturnType<typeof generateFakeHAR>>();
|
||||
useEffect(() => {
|
||||
setFakeHAR(generateFakeHAR(entries));
|
||||
}, []);
|
||||
|
||||
@ -82,11 +94,8 @@ export default function HARConverter({ entries }: { entries: StolenDataEntry[] }
|
||||
type="file"
|
||||
accept=".har"
|
||||
onChange={(e) => {
|
||||
const file = e.target?.files?.[0];
|
||||
if (file) {
|
||||
setFilename(file.name);
|
||||
handleNewFile(e.target, entries, setFiltered);
|
||||
}
|
||||
setFilename(e.target.files[0].name);
|
||||
handleNewFile(e.target, entries, setFiltered);
|
||||
}}
|
||||
/>
|
||||
{(filtered && (
|
||||
@ -105,7 +114,7 @@ export default function HARConverter({ entries }: { entries: StolenDataEntry[] }
|
||||
})
|
||||
)}
|
||||
download={`${getshorthost(
|
||||
entries[0].request.origin
|
||||
entries[0].request.originalURL
|
||||
)}-${new Date().toJSON()}-trimmed.har`}
|
||||
>
|
||||
Pobierz "zredukowany" HAR
|
22
report-window/report-window.html
Normal 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>
|
127
report-window/report-window.tsx
Normal 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'));
|
@ -1,29 +1,26 @@
|
||||
import { FakeRequestClusterData } from './components/report-window/fake-clusters';
|
||||
import { EventEmitter } from 'events';
|
||||
import ExtendedRequest from './extended-request';
|
||||
import { SaferEmitter } from './safer-emitter';
|
||||
import { DataLocation, Sources, StolenDataEntry } from './stolen-data-entry';
|
||||
import { Sources, StolenDataEntry } from './stolen-data-entry';
|
||||
|
||||
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 representativeStolenData: StolenDataEntry[] = [];
|
||||
public expanded: boolean = false;
|
||||
public lastModified: number = 0;
|
||||
public lastFullUrl: string | null = null;
|
||||
public expanded: boolean;
|
||||
constructor(public id: string) {
|
||||
super();
|
||||
}
|
||||
|
||||
add(request: ExtendedRequest) {
|
||||
this.requests.push(request);
|
||||
this.emit('change');
|
||||
this.lastModified = Date.now();
|
||||
if (request.originalURL) {
|
||||
this.lastFullUrl = request.originalURL;
|
||||
}
|
||||
}
|
||||
|
||||
toggleExpanded(state: boolean) {
|
||||
@ -40,10 +37,6 @@ export class RequestCluster extends SaferEmitter {
|
||||
return false;
|
||||
}
|
||||
|
||||
hasMarkedCookies() {
|
||||
return this.getMarkedEntries().some((entry) => entry.source === 'cookie');
|
||||
}
|
||||
|
||||
calculateRepresentativeStolenData(
|
||||
filter: {
|
||||
minValueLength: number;
|
||||
@ -100,7 +93,8 @@ export class RequestCluster extends SaferEmitter {
|
||||
return true;
|
||||
}
|
||||
if (
|
||||
array[index].getValuePreview() === array[index - 1].getValuePreview() ||
|
||||
array[index].getValuePreview() ===
|
||||
array[index - 1].getValuePreview() ||
|
||||
isSameURL(array[index].value, array[index - 1].value)
|
||||
) {
|
||||
return false;
|
||||
@ -132,7 +126,9 @@ export class RequestCluster extends SaferEmitter {
|
||||
return true;
|
||||
}
|
||||
})
|
||||
.sort((entry1, entry2) => (entry1.getPriority() > entry2.getPriority() ? -1 : 1));
|
||||
.sort((entry1, entry2) =>
|
||||
entry1.getPriority() > entry2.getPriority() ? -1 : 1
|
||||
);
|
||||
return this.representativeStolenData;
|
||||
}
|
||||
|
||||
@ -169,16 +165,12 @@ export class RequestCluster extends SaferEmitter {
|
||||
}
|
||||
|
||||
getMarkedEntries(): StolenDataEntry[] {
|
||||
return this.requests.map((request) => request.getMarkedEntries()).reduce(reduceConcat, []);
|
||||
}
|
||||
|
||||
exposesOriginWhere(): DataLocation[] {
|
||||
return this.requests
|
||||
.map((request) => request.exposesOriginWhere())
|
||||
.filter((l) => l !== null) as DataLocation[];
|
||||
.map((request) => request.getMarkedEntries())
|
||||
.reduce(reduceConcat, []);
|
||||
}
|
||||
|
||||
exposesOrigin(): boolean {
|
||||
exposesOrigin() {
|
||||
return this.requests.some((request) => request.exposesOrigin());
|
||||
}
|
||||
|
||||
@ -188,35 +180,4 @@ export class RequestCluster extends SaferEmitter {
|
||||
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(),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
@ -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
After Width: | Height: | Size: 638 KiB |
7
sidebar/colors.scss
Normal 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
@ -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;
|
||||
}
|
@ -10,9 +10,14 @@
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
body {
|
||||
min-width: 24rem;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 1rem;
|
||||
font-family: 'OpenSans';
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
|
||||
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
|
||||
button {
|
25
sidebar/sidebar.html
Normal 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>
|