fix: underline links from being applied everywhere

.changeset/underline_links_setting_no_longer_affects_the_entire_app.md

@@ -0,0 +1,7 @@
+---
+default: patch
+---
+
+# "Underline Links" setting no longer affects the entire app
+
+The "Underline Links" accessibility setting was incorrectly applying link underlines globally, including to buttons in the Lobby and Message Search in spaces. It is now scoped to only the areas where it's relevant, which is chat messages, user bios, and room descriptions. The setting description in Appearance has been updated to reflect this.

src/app/components/room-topic-viewer/RoomTopicViewer.tsx

@@ -29,7 +29,7 @@ export const RoomTopicViewer = as<
         <Icon src={Icons.Cross} />
       </IconButton>
     </Header>
-    <Scroll className={css.ModalScroll} size="300" hideTrack>
+    <Scroll data-room-topic className={css.ModalScroll} size="300" hideTrack>
       <Box className={css.ModalContent} direction="Column" gap="100">
         <Text size="T300" className={css.ModalTopic} priority="400">
           <Linkify options={LINKIFY_OPTS}>{scaleSystemEmoji(topic)}</Linkify>

src/app/components/user-profile/UserRoomProfile.tsx

@@ -180,6 +180,7 @@ function UserExtendedSection({
 
       {bioContent && (
         <Scroll
+          data-profile-bio
           direction="Vertical"
           variant="SurfaceVariant"
           visibility="Always"

src/app/features/settings/cosmetics/Themes.tsx

@@ -305,7 +305,7 @@ function ThemeSettings() {
       <SequenceCard className={SequenceCardStyle} variant="SurfaceVariant" direction="Column">
         <SettingTile
           title="Underline Links"
-          description="Always show underlines on links in chat."
+          description="Always show underlines on links in chat, bios and room descriptions."
           after={<Switch variant="Primary" value={underlineLinks} onChange={setUnderlineLinks} />}
         />
       </SequenceCard>

src/index.css

@@ -177,7 +177,9 @@ pre {
 
 /* Accessibility Overrides :D */
 
-.force-underline-links a {
+.force-underline-links [data-message-id] a:not([data-mention-id]),
+.force-underline-links [data-profile-bio] a,
+.force-underline-links [data-room-topic] a {
   text-decoration: underline !important;
   text-decoration-thickness: 1px;
   text-underline-offset: 2px;