diff --git a/public/sprite.svg b/public/sprite.svg
index 962c088b..11e74fc6 100644
--- a/public/sprite.svg
+++ b/public/sprite.svg
@@ -10,10 +10,10 @@
-
-
-
-
+
+
+
+
@@ -21,10 +21,10 @@
-
+
-
-
-
-
+
+
+
+
diff --git a/src/components/App.jsx b/src/components/App.jsx
index 62834288..dbe23a5f 100644
--- a/src/components/App.jsx
+++ b/src/components/App.jsx
@@ -18,6 +18,7 @@ import { useCurrentWallet, useSetCurrentWallet, useSetCurrentWalletInfo } from '
import { useSessionConnectionError } from '../context/ServiceInfoContext'
import { setSession, clearSession } from '../session'
import Onboarding from './Onboarding'
+import Sprite from './Sprite'
import { routes } from '../constants/routes'
export default function App() {
@@ -188,7 +189,12 @@ export default function App() {
-
•
+
+
+
{websocketConnected ? t('footer.connected') : t('footer.disconnected')}
diff --git a/src/components/App.test.jsx b/src/components/App.test.jsx
index 60cbf71d..4b00c422 100644
--- a/src/components/App.test.jsx
+++ b/src/components/App.test.jsx
@@ -68,8 +68,8 @@ describe('
', () => {
render(
)
})
- expect(screen.getByText('•').classList.contains('text-danger')).toBe(true)
- expect(screen.getByText('•').classList.contains('text-success')).toBe(false)
+ expect(screen.getByTestId('connection-indicator-icon').classList.contains('text-danger')).toBe(true)
+ expect(screen.getByTestId('connection-indicator-icon').classList.contains('text-success')).toBe(false)
expect(screen.getByText('footer.disconnected')).toBeInTheDocument()
expect(screen.queryByText('footer.connected')).not.toBeInTheDocument()
@@ -77,7 +77,7 @@ describe('
', () => {
expect(screen.queryByText('footer.disconnected')).not.toBeInTheDocument()
expect(screen.getByText('footer.connected')).toBeInTheDocument()
- expect(screen.getByText('•').classList.contains('text-success')).toBe(true)
- expect(screen.getByText('•').classList.contains('text-danger')).toBe(false)
+ expect(screen.getByTestId('connection-indicator-icon').classList.contains('text-success')).toBe(true)
+ expect(screen.getByTestId('connection-indicator-icon').classList.contains('text-danger')).toBe(false)
})
})
diff --git a/src/components/CurrentWalletMagic.jsx b/src/components/CurrentWalletMagic.jsx
index 6d36914b..1a2a8269 100644
--- a/src/components/CurrentWalletMagic.jsx
+++ b/src/components/CurrentWalletMagic.jsx
@@ -124,17 +124,23 @@ export default function CurrentWalletMagic() {
/>
-
- {/* Always receive on first mixdepth. */}
-
- {t('current_wallet.button_deposit')}
-
-
{/* Todo: Withdrawing needs to factor in the privacy levels as well.
Depending on the mixdepth/account there will be different amounts available. */}
- {t('current_wallet.button_withdraw')}
+
+
+
{t('current_wallet.button_withdraw')}
+
+
+
+
+ {/* Always receive on first mixdepth. */}
+
+
+
+
{t('current_wallet.button_deposit')}
+
diff --git a/src/components/Earn.jsx b/src/components/Earn.jsx
index 66a4e7db..5052f138 100644
--- a/src/components/Earn.jsx
+++ b/src/components/Earn.jsx
@@ -254,9 +254,9 @@ export default function Earn() {
-
- {t('earn.alert_coinjoin_in_progress')}
-
+
+ {t('earn.alert_coinjoin_in_progress')}
+
{alert &&
{alert.message}}
diff --git a/src/components/Send.css b/src/components/Send.css
index a9bd72ff..14f5a6de 100644
--- a/src/components/Send.css
+++ b/src/components/Send.css
@@ -58,7 +58,7 @@ input::-webkit-inner-spin-button {
color: var(--bs-black);
font-size: 0.8rem;
height: 1rem;
- padding-right: 0;
+ padding: 0;
box-shadow: none;
}
diff --git a/src/components/Send.jsx b/src/components/Send.jsx
index 6654cf37..c2370fcb 100644
--- a/src/components/Send.jsx
+++ b/src/components/Send.jsx
@@ -167,10 +167,10 @@ export default function Send() {
const [alert, setAlert] = useState(null)
const [isLoading, setIsLoading] = useState(true)
const [isSending, setIsSending] = useState(false)
- const [isCoinjoin, setIsCoinjoin] = useState(false)
const [isCoinjoinOptionEnabled, setIsCoinjoinOptionEnabled] = useState(
serviceInfo && !serviceInfo.makerRunning && !serviceInfo.coinjoinInProgress
)
+ const [isCoinjoin, setIsCoinjoin] = useState(isCoinjoinOptionEnabled)
const [minNumCollaborators, setMinNumCollaborators] = useState(MINIMUM_MAKERS_DEFAULT_VAL)
const [utxos, setUtxos] = useState(null)
const [isSweep, setIsSweep] = useState(false)
@@ -418,7 +418,7 @@ export default function Send() {
if (!breakdown) return null
return (
-
+
@@ -426,7 +426,7 @@ export default function Send() {
{t('send.button_sweep_amount_breakdown')}
-
+
@@ -509,12 +509,10 @@ export default function Send() {
-
-
- {serviceInfo?.makerRunning && t('send.text_maker_running')}
- {serviceInfo?.coinjoinInProgress && t('send.text_coinjoin_already_running')}
-
-
+
+ {serviceInfo?.makerRunning && t('send.text_maker_running')}
+ {serviceInfo?.coinjoinInProgress && t('send.text_coinjoin_already_running')}
+
{alert && (
@@ -524,19 +522,6 @@ export default function Send() {
)}
-
- {t('send.label_recipient')}
- setDestination(e.target.value)}
- isInvalid={destination !== null && !isValidAddress(destination)}
- />
- {t('send.feedback_invalid_recipient')}
-
{settings.useAdvancedWalletMode ? t('send.label_account_dev_mode') : t('send.label_account')}
@@ -561,7 +546,7 @@ export default function Send() {
))}
-
+
{t('send.label_amount')}
{isSweep && frozenOrLockedWarning()}
+
+ {t('send.label_recipient')}
+ setDestination(e.target.value)}
+ isInvalid={destination !== null && !isValidAddress(destination)}
+ />
+ {t('send.feedback_invalid_recipient')}
+
{isCoinjoinOptionEnabled && (
- setIsCoinjoin(isToggled)} />
+ setIsCoinjoin(isToggled)}
+ />
)}
diff --git a/src/i18n/locales/en/translation.json b/src/i18n/locales/en/translation.json
index a7a8312f..29db3510 100644
--- a/src/i18n/locales/en/translation.json
+++ b/src/i18n/locales/en/translation.json
@@ -109,8 +109,8 @@
},
"current_wallet": {
"text_loading": "Loading",
- "button_deposit": "Deposit",
- "button_withdraw": "Withdraw",
+ "button_deposit": "Receive",
+ "button_withdraw": "Send",
"button_switch_wallet": "Switch wallet",
"error_loading_failed": "Loading wallet failed."
},
diff --git a/src/index.css b/src/index.css
index ac92007f..46bf07f4 100644
--- a/src/index.css
+++ b/src/index.css
@@ -428,6 +428,12 @@ h2 {
box-shadow: none;
}
+.alert-info {
+ color: var(--bs-white);
+ background-color: var(--bs-gray-800);
+ border-color: var(--bs-gray-900);
+}
+
.modal-header {
background-color: var(--bs-gray-800);
color: var(--bs-white);
@@ -438,6 +444,7 @@ h2 {
url('data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23fff%27%3e%3cpath d=%27M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z%27/%3e%3c/svg%3e')
center/1em auto no-repeat;
}
+
/* Privacy Level Styles */
.privacy-level-4 {
@@ -577,6 +584,10 @@ h2 {
border-color: var(--bs-gray-800);
}
+:root[data-theme='dark'] .accordion-button.collapsed::after {
+ background-image: url('data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23fff%27%3e%3cpath fill-rule=%27evenodd%27 d=%27M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z%27/%3e%3c/svg%3e');
+}
+
:root[data-theme='dark'] .btn-outline-dark:hover {
background-color: var(--bs-gray-dark) !important;
border-color: var(--bs-gray-dark) !important;
@@ -602,3 +613,12 @@ h2 {
:root[data-theme='dark'] .modal-header .btn-close {
background-color: var(--bs-gray-900) !important;
}
+
+:root[data-theme='dark'] .form-control:disabled,
+.form-control[readonly] {
+ background-color: var(--bs-gray-500);
+}
+
+:root[data-theme='dark'] .form-control:disabled::placeholder {
+ color: var(--bs-gray-600);
+}