diff --git a/assets/icons/close_big.svg b/assets/icons/close_big.svg new file mode 100644 index 0000000..d1cf7fb --- /dev/null +++ b/assets/icons/close_big.svg @@ -0,0 +1,3 @@ + + + diff --git a/manifest.json b/manifest.json index f9086cc..048c123 100644 --- a/manifest.json +++ b/manifest.json @@ -3,10 +3,10 @@ "name": "Problematyczne requesty", "version": "1.0", - "description": "Adds a red border to all webpages matching mozilla.org.", + "description": "", "sidebar_action": { - "default_title": "ICD Skaner", + "default_title": "ICD", "default_panel": "sidebar/sidebar.html", "default_icon": "sidebar_icon.png" }, diff --git a/options.scss b/options.scss new file mode 100644 index 0000000..7fb38c8 --- /dev/null +++ b/options.scss @@ -0,0 +1,30 @@ +@import './sidebar/colors.scss'; + +.options-container { + padding-top: 0.5rem; + span { + color: $mid-grey; + font-size: 0.875rem; + font-weight: 600; + } + + fieldset { + padding: 0.5rem 0; + border: none; + display: flex; + flex-flow: column; + + .label-checkbox { + cursor: pointer; + margin-left: 0.5rem; + } + + .input-container{ + padding-bottom: .25rem; + } + + #minValueLength { + width: 3rem; + } + } +} diff --git a/options.tsx b/options.tsx index 7e2817c..61e0e90 100644 --- a/options.tsx +++ b/options.tsx @@ -1,50 +1,96 @@ -import React from "react"; +import React from 'react'; +import './options.scss'; export default function Options({ - minValueLength, - setMinValueLength, - cookiesOnly, - setCookiesOnly, - cookiesOrOriginOnly, - setCookiesOrOriginOnly, + minValueLength, + setMinValueLength, + cookiesOnly, + setCookiesOnly, + cookiesOrOriginOnly, + setCookiesOrOriginOnly, + readWarningDataDialog, + setReadWarningDataDialog, }: { - minValueLength: number; - setMinValueLength: (n: number) => void; - cookiesOnly: boolean; - setCookiesOnly: (b: boolean) => void; - cookiesOrOriginOnly: boolean; - setCookiesOrOriginOnly: (b: boolean) => void; + minValueLength: number; + setMinValueLength: (n: number) => void; + cookiesOnly: boolean; + setCookiesOnly: (b: boolean) => void; + cookiesOrOriginOnly: boolean; + setCookiesOrOriginOnly: (b: boolean) => void; + readWarningDataDialog: string; + setReadWarningDataDialog: (s: string) => void; }) { - return ( -
-

Zaawansowane ustawienia 馃挍

- - setMinValueLength(parseInt(e.target.value))} - /> -
- setCookiesOnly(e.target.checked)} - /> - -
- setCookiesOrOriginOnly(e.target.checked)} - /> - -
- ); + return ( +
+ Ustawienia interfejsu +
+
+ { + setReadWarningDataDialog( + e.target.checked ? '0' : '1' + ); + localStorage.setItem( + 'readWarningDataDialog', + e.target.checked ? '0' : '1' + ); + }} + /> + +
+
+ Ustawienia zaawansowane +
+
+ + + setMinValueLength(parseInt(e.target.value)) + } + /> +
+
+ setCookiesOnly(e.target.checked)} + /> + +
+
+ + setCookiesOrOriginOnly(e.target.checked) + } + /> + +
+
+
+ ); } diff --git a/sidebar/colors.scss b/sidebar/colors.scss index f95e614..d5d7687 100644 --- a/sidebar/colors.scss +++ b/sidebar/colors.scss @@ -3,3 +3,5 @@ $disabled-grey: #8a949f; $light-grey: #d1d1d1; $blue: #0048D9; $icd-yellow: #ffee2c; +$pale-yellow: #fff8e5; +$contrast-yellow: #ffb900; diff --git a/sidebar/sidebar.scss b/sidebar/sidebar.scss index 45c45af..c839db6 100644 --- a/sidebar/sidebar.scss +++ b/sidebar/sidebar.scss @@ -79,4 +79,30 @@ } } } + + .warning-container { + background-color: $pale-yellow; + border-left: 4px solid $contrast-yellow; + margin-top: 0.5rem; + font-size: 0.875rem; + display: grid; + grid-template-columns: calc(100% - 2rem) 2rem; + align-items: flex-start; + + span { + padding: 1rem; + } + + button { + justify-content: flex-end; + border: none; + cursor: pointer; + color: $mid-grey; + line-height: 1.25rem; + background: transparent; + padding: 0.5rem 0.5rem; + display: flex; + align-self: flex-start; + } + } } diff --git a/sidebar/sidebar.tsx b/sidebar/sidebar.tsx index db68f4c..aed7ec8 100644 --- a/sidebar/sidebar.tsx +++ b/sidebar/sidebar.tsx @@ -9,6 +9,7 @@ import SettingsIcon from '../assets/icons/settings.svg'; import TrashIcon from '../assets/icons/trash_full.svg'; import MailIcon from '../assets/icons/mail.svg'; import ShortLeftIcon from '../assets/icons/short_left.svg'; +import CloseBigIcon from '../assets/icons/close_big.svg'; async function getCurrentTab() { const [tab] = await browser.tabs.query({ @@ -30,6 +31,9 @@ const Sidebar = () => { useState(false); const [counter, setCounter] = useEmitter(getMemory()); const [marksOccurrence, setMarksOccurrence] = useState(false); + const [readWarningDataDialog, setReadWarningDataDialog] = useState< + string | null + >(localStorage.getItem('readWarningDataDialog')); useEffect(() => { const listener = async (data: any) => { @@ -91,18 +95,15 @@ const Sidebar = () => { )} - + + + + ) : null}
{stolenDataView ? ( - setCounter((c) => c + 1)} - minValueLength={minValueLength} - cookiesOnly={cookiesOnly} - cookiesOrOriginOnly={cookiesOrOriginOnly} - /> + + {readWarningDataDialog != '1' ? ( +
+ + Uwaga! Niekoniecznie ka偶da + przechwycona 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. + + +
+ ) : null} + setCounter((c) => c + 1)} + minValueLength={minValueLength} + cookiesOnly={cookiesOnly} + cookiesOrOriginOnly={cookiesOrOriginOnly} + /> + ) : ( { setCookiesOnly={setCookiesOnly} cookiesOrOriginOnly={cookiesOrOriginOnly} setCookiesOrOriginOnly={setCookiesOrOriginOnly} + readWarningDataDialog={readWarningDataDialog} + setReadWarningDataDialog={setReadWarningDataDialog} /> )}
diff --git a/sidebar/stolen-data.tsx b/sidebar/stolen-data.tsx index ac14064..c39a4f1 100644 --- a/sidebar/stolen-data.tsx +++ b/sidebar/stolen-data.tsx @@ -83,7 +83,7 @@ export function StolenData({ Zaznacz automatycznie */} - Domeny, kt贸re pozyska艂y informacje + Domeny oraz przes艂ane informacje {clusters.map((cluster) => { return (