add css focus

therealtimex · Dec 1, 2024 · 12f3b66 · 12f3b66
1 parent a17d2a5
commit 12f3b66
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 6 deletions.
diff --git a/css/rt-dmview-css-min.css b/css/rt-dmview-css-min.css
@@ -200,6 +200,12 @@ label::before {
 .nav-pills .nav-link.active {
     background-color: var(--color_theme_accent);
     color: var(--color_theme_text_primary);
+    position: relative;
+}
+
+.nav-pills .nav-link:focus {
+    outline: 2px solid var(--color_theme_focus);
+    outline-offset: 2px;
 }
 
 /* Hover states */

diff --git a/js/WorkflowAI-H24-scr501.html b/js/WorkflowAI-H24-scr501.html
@@ -51,11 +51,11 @@
     </head>
 
     <body>
-        <main class="container" tabindex="0">
+        <main class="container"">
             <div>
                 <h2 class="dmview-title">##store_lb##</h2>
 
-                <div class="tab-container" tabindex="0">
+                <div class="tab-container">
                     <nav>
                         <ul class="nav nav-pills mb-3" id="dmTabs" role="tablist">
                             <li class="nav-item" role="presentation">
@@ -106,7 +106,7 @@ <h2 class="dmview-title">##store_lb##</h2>
                             </div>
                         </div>
                         <div class="tab-pane fade" id="map-content" role="tabpanel" aria-labelledby="tab3">
-                            <iframe width=100% height=100% style="border:0;" loading="lazy" allowfullscreen src="https://maps.google.com/maps?key=AIzaSyCZ9K-IVs5Q2leQsh19KF-oYRvL9lJGzJQ&q=##crm_gpsLatitude##,##crm_gpsLongitude##&z=14&output=embed"></iframe>
+                            <iframe tabindex="-1" width=100% height=100% style="border:0;" loading="lazy" allowfullscreen src="https://maps.google.com/maps?key=AIzaSyCZ9K-IVs5Q2leQsh19KF-oYRvL9lJGzJQ&q=##crm_gpsLatitude##,##crm_gpsLongitude##&z=14&output=embed"></iframe>
                         </div>
                     </div>
                 </div>
@@ -181,11 +181,11 @@ <h2 class="dmview-title">##store_lb##</h2>
     </head>
 
     <body>
-        <main class="container" tabindex="0">
+        <main class="container">
             <div>
                 <h2 class="dmview-title">##store_lb##</h2>
 
-                <div class="tab-container" tabindex="0">
+                <div class="tab-container">
                     <nav>
                         <ul class="nav nav-pills mb-3" id="dmTabs" role="tablist">
                             <li class="nav-item" role="presentation">
@@ -236,7 +236,7 @@ <h2 class="dmview-title">##store_lb##</h2>
                             </div>
                         </div>
                         <div class="tab-pane fade" id="map-content" role="tabpanel" aria-labelledby="tab3">
-                            <iframe width=100% height=100% style="border:0;" loading="lazy" allowfullscreen src="https://maps.google.com/maps?key=AIzaSyCZ9K-IVs5Q2leQsh19KF-oYRvL9lJGzJQ&q=##crm_gpsLatitude##,##crm_gpsLongitude##&z=14&output=embed"></iframe>
+                            <iframe tabindex="-1" width=100% height=100% style="border:0;" loading="lazy" allowfullscreen src="https://maps.google.com/maps?key=AIzaSyCZ9K-IVs5Q2leQsh19KF-oYRvL9lJGzJQ&q=##crm_gpsLatitude##,##crm_gpsLongitude##&z=14&output=embed"></iframe>
                         </div>
                     </div>
                 </div>