diff --git a/options.scss b/options.scss index 7fb38c8..81a71d6 100644 --- a/options.scss +++ b/options.scss @@ -9,7 +9,7 @@ } fieldset { - padding: 0.5rem 0; + padding: 0.5rem 0 1rem; border: none; display: flex; flex-flow: column; @@ -19,8 +19,8 @@ margin-left: 0.5rem; } - .input-container{ - padding-bottom: .25rem; + .input-container { + padding-bottom: 0.25rem; } #minValueLength { diff --git a/options.tsx b/options.tsx index 695c921..951aec3 100644 --- a/options.tsx +++ b/options.tsx @@ -8,8 +8,8 @@ export default function Options({ setCookiesOnly, cookiesOrOriginOnly, setCookiesOrOriginOnly, - readWarningDataDialog, - setReadWarningDataDialog, + warningDataDialogAck, + setWarningDataDialogAck, logoVisibility, setLogoVisibility, }: { @@ -19,47 +19,25 @@ export default function Options({ setCookiesOnly: (b: boolean) => void; cookiesOrOriginOnly: boolean; setCookiesOrOriginOnly: (b: boolean) => void; - readWarningDataDialog: string; - setReadWarningDataDialog: (s: string) => void; - logoVisibility: string; - setLogoVisibility: (s: string) => void; + warningDataDialogAck: boolean; + setWarningDataDialogAck: (b: boolean) => void; + logoVisibility: boolean; + setLogoVisibility: (b: boolean) => void; }) { return (
- Ustawienia interfejsu + Interfejs
-
- { - setReadWarningDataDialog( - e.target.checked ? '0' : '1' - ); - localStorage.setItem( - 'readWarningDataDialog', - e.target.checked ? '0' : '1' - ); - }} - /> - -
{ - setLogoVisibility(e.target.checked ? '1' : '0'); + setLogoVisibility(e.target.checked); localStorage.setItem( 'logoVisibility', - e.target.checked ? '1' : '0' + e.target.checked as unknown as string ); }} /> @@ -67,6 +45,26 @@ export default function Options({ Wyświetlaj logo Internet. Czas działać!
+
+ { + setWarningDataDialogAck(e.target.checked); + localStorage.setItem( + 'warningDataDialogAck', + e.target.checked as unknown as string + ); + }} + /> + +
Ustawienia zaawansowane
diff --git a/sidebar/sidebar.scss b/sidebar/sidebar.scss index 4a4c089..b964a62 100644 --- a/sidebar/sidebar.scss +++ b/sidebar/sidebar.scss @@ -3,17 +3,20 @@ .sidebar { .header { display: grid; - grid-template-columns: 6.67rem 1fr 1rem; - align-items: flex-start; + grid-template-columns: 6.67rem 1fr 1.25rem; + align-items: center; max-height: 3.5rem; - padding-top: 0.5rem; - padding-bottom: 0.5rem; + min-height: 3.5rem; border-bottom: 1px solid $light-grey; position: sticky; top: 0; background: #fff; z-index: 1; + &--without-logo { + grid-template-columns: 1fr 1.25rem; + } + .webpage-metadata { word-break: break-all; display: flex; @@ -24,7 +27,10 @@ justify-content: center; padding-left: 1rem; color: #000; - // height: 1rem; + + &--without-logo { + padding-left: 0; + } &--hyperlink { font-weight: 400; diff --git a/sidebar/sidebar.tsx b/sidebar/sidebar.tsx index e06f8ed..8e75107 100644 --- a/sidebar/sidebar.tsx +++ b/sidebar/sidebar.tsx @@ -31,11 +31,19 @@ const Sidebar = () => { useState(false); const [counter, setCounter] = useEmitter(getMemory()); const [marksOccurrence, setMarksOccurrence] = useState(false); - const [readWarningDataDialog, setReadWarningDataDialog] = useState< - string | null - >(localStorage.getItem('readWarningDataDialog')); - const [logoVisibility, setLogoVisibility] = useState( - localStorage.getItem('setLogoVisibility') + const [warningDataDialogAck, setWarningDataDialogAck] = useState( + localStorage.getItem('warningDataDialogAck') === null + ? true + : localStorage.getItem('warningDataDialogAck') == 'true' + ? true + : false + ); + const [logoVisibility, setLogoVisibility] = useState( + localStorage.getItem('logoVisibility') === null + ? true + : localStorage.getItem('logoVisibility') == 'true' + ? true + : false ); useEffect(() => { @@ -76,12 +84,23 @@ const Sidebar = () => { Wybierz aktywną kartę{" "}
*/} -
+
-
+
{origin ? ( Analiza strony @@ -167,7 +186,7 @@ const Sidebar = () => {
{stolenDataView ? ( - {readWarningDataDialog != '1' ? ( + {warningDataDialogAck ? (
Uwaga! Niekoniecznie każda @@ -178,10 +197,10 @@ const Sidebar = () => {