chore: update changelog (#265)

Co-authored-by: Content Teams SRV <87473071+uicontent@users.noreply.github.com>

Author: yordan-st

packages/atlas-core/CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+### Changed
+
+-   Moved .sr-only from bootstrap to base
+
 ### Fixed 
 
 -   We fixed an issue with sidebar menu not overlaying some elements in modern client.

packages/atlas-core/package.json

@@ -1,7 +1,7 @@
 {
   "name": "atlas-core",
   "moduleName": "Atlas Core",
-  "version": "4.1.4",
+  "version": "4.2.0",
   "license": "Apache-2.0",
   "copyright": "© Mendix Technology BV 2024. All rights reserved.",
   "repository": {

packages/atlas/src/themesource/atlas_core/web/core/_legacy/bootstrap/_bootstrap.scss

@@ -1139,25 +1139,6 @@
         border: 0;
         border-top: 1px solid #eee;
     }
-    .sr-only {
-        position: absolute;
-        width: 1px;
-        height: 1px;
-        padding: 0;
-        margin: -1px;
-        overflow: hidden;
-        clip: rect(0, 0, 0, 0);
-        border: 0;
-    }
-    .sr-only-focusable:active,
-    .sr-only-focusable:focus {
-        position: static;
-        width: auto;
-        height: auto;
-        margin: 0;
-        overflow: visible;
-        clip: auto;
-    }
     [role="button"] {
         cursor: pointer;
     }
@@ -2223,9 +2204,6 @@
     .has-feedback label ~ .form-control-feedback {
         top: 25px;
     }
-    .has-feedback label.sr-only ~ .form-control-feedback {
-        top: 0;
-    }
     .help-block {
         display: block;
         margin-top: 5px;

packages/atlas/src/themesource/atlas_core/web/core/base/_base.scss

@@ -72,6 +72,33 @@
         box-shadow: none;
     }
 
+    // Accessibility helpers:
+    // .sr-only visually hides elements but keeps them accessible to screen readers.   
+    .sr-only {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        padding: 0;
+        margin: -1px;
+        overflow: hidden;
+        clip-path: inset(50%);
+        border: 0;
+    }
+     // .sr-only-focusable makes hidden elements visible when focused (keyboard navigation).
+    .sr-only-focusable:active,
+    .sr-only-focusable:focus {
+        position: static;
+        width: auto;
+        height: auto;
+        margin: 0;
+        overflow: visible;
+        clip-path: none;
+    }
+    // .has-feedback label.sr-only ~ .form-control-feedback positions feedback for screen reader-only labels.
+    .has-feedback label.sr-only ~ .form-control-feedback {
+        top: 0;
+    }
+
     .mx-underlay {
         position: fixed;
         top: 0;