diff --git a/src/frontend/src/flows/addDevice/manage/pollForTentativeDevice.ts b/src/frontend/src/flows/addDevice/manage/pollForTentativeDevice.ts
index 3a172618f3..61c6297045 100644
--- a/src/frontend/src/flows/addDevice/manage/pollForTentativeDevice.ts
+++ b/src/frontend/src/flows/addDevice/manage/pollForTentativeDevice.ts
@@ -26,7 +26,7 @@ const pageContent = (userNumber: bigint) => {
Open
${LEGACY_II_URL}
-
+
Open this link on the device you want to add.
diff --git a/src/frontend/src/flows/manage/index.ts b/src/frontend/src/flows/manage/index.ts
index f21e7bad8b..6fd4ec4e68 100644
--- a/src/frontend/src/flows/manage/index.ts
+++ b/src/frontend/src/flows/manage/index.ts
@@ -203,7 +203,7 @@ const devicesSection = ({
Added devices
-
+
You can register up to ${MAX_AUTHENTICATORS} authenticator
devices (recovery devices excluded)
(${_authenticators.length}/${MAX_AUTHENTICATORS})
@@ -235,11 +235,11 @@ const devicesSection = ({
${device.warn !== undefined
? html`
- ${warningIcon}${warningIcon}${device.warn}
diff --git a/src/frontend/src/styles/main.css b/src/frontend/src/styles/main.css
index 02ca706151..97bf80a50d 100644
--- a/src/frontend/src/styles/main.css
+++ b/src/frontend/src/styles/main.css
@@ -575,6 +575,11 @@ a:hover,
padding: var(--rs-card-bezel-narrow);
}
+.c-card--tight {
+ padding: calc(var(--rs-card-bezel-narrow) * 0.5)
+ calc(var(--rs-card-bezel-narrow) * 0.6);
+}
+
.c-card--background {
padding: calc(var(--rs-card-bezel) * 0.3);
background: rgba(255, 255, 255, 0.2);
@@ -1296,11 +1301,15 @@ a:hover,
max-width: 20rem;
transition: opacity 0.2s ease-in;
background-color: var(--rc-background);
+
+ overflow-wrap: break-word;
+ word-wrap: break-word;
+ hyphens: auto;
}
-.c-tooltip__message--right {
- right: 0;
+.c-tooltip--left .c-tooltip__message {
left: auto;
+ right: 0;
}
/* chasm: alternative to tooltips, where the card opens to reveal details */