From 1e48f8b5c5bae7ddcac873caeb5bdd4910740c72 Mon Sep 17 00:00:00 2001 From: adz Date: Wed, 24 Apr 2024 14:25:31 +0200 Subject: [PATCH 1/5] Introduce new Spinner component: --- src/renderer/components/QrReader/index.tsx | 2 +- src/renderer/components/Spinner/index.tsx | 11 ++++++++++ .../components/Spinner/styles.module.scss | 20 +++++++++++++++++++ 3 files changed, 32 insertions(+), 1 deletion(-) create mode 100644 src/renderer/components/Spinner/index.tsx create mode 100644 src/renderer/components/Spinner/styles.module.scss diff --git a/src/renderer/components/QrReader/index.tsx b/src/renderer/components/QrReader/index.tsx index a5978e714d..1a2eae7d9f 100644 --- a/src/renderer/components/QrReader/index.tsx +++ b/src/renderer/components/QrReader/index.tsx @@ -7,9 +7,9 @@ import React, { } from 'react' import scanQrCode from 'jsqr' import classNames from 'classnames' -import { Spinner } from '@blueprintjs/core' import Icon from '../Icon' +import Spinner from '../Spinner' import useTranslationFunction from '../../hooks/useTranslationFunction' import { ContextMenuContext } from '../../contexts/ContextMenuContext' import { ScreenContext } from '../../contexts/ScreenContext' diff --git a/src/renderer/components/Spinner/index.tsx b/src/renderer/components/Spinner/index.tsx new file mode 100644 index 0000000000..bd70cfb82a --- /dev/null +++ b/src/renderer/components/Spinner/index.tsx @@ -0,0 +1,11 @@ +import React from 'react' + +import styles from './styles.module.scss' + +type Props = { + size?: number +} + +export default function Spinner({ size = 50 }: Props) { + return
+} diff --git a/src/renderer/components/Spinner/styles.module.scss b/src/renderer/components/Spinner/styles.module.scss new file mode 100644 index 0000000000..62e5130a18 --- /dev/null +++ b/src/renderer/components/Spinner/styles.module.scss @@ -0,0 +1,20 @@ +@keyframes spin { + to { + transform: rotate(1turn) + } +} + +.spinner { + aspect-ratio: 1; + background: var(--colorPrimary); + border-radius: 50%; + padding: 8px; + --_m: + conic-gradient(#0000 10%, #000), + linear-gradient(#000 0 0) content-box; + -webkit-mask: var(--_m); + mask: var(--_m); + -webkit-mask-composite: source-out; + mask-composite: subtract; + animation: spin 1.5s infinite linear; +} From 2b3a12d9ff5f3285e45cf99bceee8ca4adfd0d8c Mon Sep 17 00:00:00 2001 From: adz Date: Wed, 24 Apr 2024 14:26:15 +0200 Subject: [PATCH 2/5] Add entry to CHANGELOG.md --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index daa601bd4b..90a2b187f7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ - add window titlebar for html_email- and help window #3770 #3778 - add quick key `Cmd+W`/`Ctrl+W` to close webxdc-, html_email- and help-window #3770 #3778 - Accept images from clipboard in QR reader #3762 +- Introduce new `Spinner` component #3786 ### Changed - Update translations (2024-04-04) #3746 From b0ceeff5301846664b8d02dffa54289a7d3e70a9 Mon Sep 17 00:00:00 2001 From: adz Date: Wed, 24 Apr 2024 15:45:15 +0200 Subject: [PATCH 3/5] Make linter happy --- .../components/Spinner/styles.module.scss | 10 ++++---- .../UnsafeTranslationWithLink/index.tsx | 23 +++++++++++++++++++ .../styles.module.scss | 5 ++++ 3 files changed, 32 insertions(+), 6 deletions(-) create mode 100644 src/renderer/components/UnsafeTranslationWithLink/index.tsx create mode 100644 src/renderer/components/UnsafeTranslationWithLink/styles.module.scss diff --git a/src/renderer/components/Spinner/styles.module.scss b/src/renderer/components/Spinner/styles.module.scss index 62e5130a18..f4a9a91410 100644 --- a/src/renderer/components/Spinner/styles.module.scss +++ b/src/renderer/components/Spinner/styles.module.scss @@ -1,6 +1,6 @@ @keyframes spin { to { - transform: rotate(1turn) + transform: rotate(1turn); } } @@ -9,12 +9,10 @@ background: var(--colorPrimary); border-radius: 50%; padding: 8px; - --_m: - conic-gradient(#0000 10%, #000), - linear-gradient(#000 0 0) content-box; + --_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box; -webkit-mask: var(--_m); - mask: var(--_m); + mask: var(--_m); -webkit-mask-composite: source-out; - mask-composite: subtract; + mask-composite: subtract; animation: spin 1.5s infinite linear; } diff --git a/src/renderer/components/UnsafeTranslationWithLink/index.tsx b/src/renderer/components/UnsafeTranslationWithLink/index.tsx new file mode 100644 index 0000000000..f2afe25ec3 --- /dev/null +++ b/src/renderer/components/UnsafeTranslationWithLink/index.tsx @@ -0,0 +1,23 @@ +import React from 'react' + +import useTranslationFunction from '../../hooks/useTranslationFunction' + +import styles from './styles.module.scss' + +type Props = { + txKey: string + url: string +} + +export default function UnsafeTranslationWithLink({ txKey, url }: Props) { + const tx = useTranslationFunction() + + return ( + `, '']), + }} + /> + ) +} diff --git a/src/renderer/components/UnsafeTranslationWithLink/styles.module.scss b/src/renderer/components/UnsafeTranslationWithLink/styles.module.scss new file mode 100644 index 0000000000..30b8d1edd1 --- /dev/null +++ b/src/renderer/components/UnsafeTranslationWithLink/styles.module.scss @@ -0,0 +1,5 @@ +.unsafeTranslationWithLink { + a { + position: absolute; + } +} From 52ca9391d1af3022e7c8f343dc46f31662f310aa Mon Sep 17 00:00:00 2001 From: adz Date: Wed, 24 Apr 2024 15:46:01 +0200 Subject: [PATCH 4/5] Remove accidentially added file --- .../UnsafeTranslationWithLink/index.tsx | 23 ------------------- 1 file changed, 23 deletions(-) delete mode 100644 src/renderer/components/UnsafeTranslationWithLink/index.tsx diff --git a/src/renderer/components/UnsafeTranslationWithLink/index.tsx b/src/renderer/components/UnsafeTranslationWithLink/index.tsx deleted file mode 100644 index f2afe25ec3..0000000000 --- a/src/renderer/components/UnsafeTranslationWithLink/index.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react' - -import useTranslationFunction from '../../hooks/useTranslationFunction' - -import styles from './styles.module.scss' - -type Props = { - txKey: string - url: string -} - -export default function UnsafeTranslationWithLink({ txKey, url }: Props) { - const tx = useTranslationFunction() - - return ( - `, '']), - }} - /> - ) -} From 213df0dcf56f833106d1a42f46ab3f540bb8cdf8 Mon Sep 17 00:00:00 2001 From: adz Date: Wed, 24 Apr 2024 15:46:24 +0200 Subject: [PATCH 5/5] Remove accidentially added file --- .../components/UnsafeTranslationWithLink/styles.module.scss | 5 ----- 1 file changed, 5 deletions(-) delete mode 100644 src/renderer/components/UnsafeTranslationWithLink/styles.module.scss diff --git a/src/renderer/components/UnsafeTranslationWithLink/styles.module.scss b/src/renderer/components/UnsafeTranslationWithLink/styles.module.scss deleted file mode 100644 index 30b8d1edd1..0000000000 --- a/src/renderer/components/UnsafeTranslationWithLink/styles.module.scss +++ /dev/null @@ -1,5 +0,0 @@ -.unsafeTranslationWithLink { - a { - position: absolute; - } -}