Merge pull request #17 from primefaces/issue-16

Fixed #16 - Dock | Update focus for accessibility
primefaces · Jul 6, 2023 · 0507053 · 0507053
2 parents 87b31ef + a1cabf0
commit 0507053
Show file tree

Hide file tree

Showing 21 changed files with 35 additions and 6 deletions.
diff --git a/theme-base/components/menu/_dock.scss b/theme-base/components/menu/_dock.scss
@@ -1,20 +1,29 @@
 .p-dock {
-    .p-dock-list {
+    .p-dock-list-container {
         background: $dockBg;
         border: $dockBorder;
         padding: $dockPadding;
         border-radius: $dockBorderRadius;
-    }
 
+        .p-dock-list {
+            outline: 0 none;
+        }
+    }
+
     .p-dock-item {
         padding: $dockItemPadding;
+        border-radius: $dockItemBorderRadius;
+
+        &.p-focus {
+            @include focused-listitem();
+        }
     }
 
-    .p-dock-action {
+    .p-dock-link {
         width: $dockActionWidth;
         height: $dockActionHeight;
     }
-
+    
     &.p-dock-top,
     &.p-dock-bottom {
         .p-dock-item-second-prev,
@@ -38,7 +47,7 @@
         .p-dock-item-second-next {
             margin: $dockSecondItemsMargin 0;
         }
-
+        
         .p-dock-item-prev,
         .p-dock-item-next {
             margin: $dockFirstItemsMargin 0;
@@ -83,4 +92,4 @@
             }
         }
     }
-}
+}
diff --git a/themes/arya/_variables.scss b/themes/arya/_variables.scss
@@ -805,6 +805,7 @@ $speedDialActionTextHoverColor: $shade900 !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/bootstrap4/bootstrap4-dark/_variables_dark.scss b/themes/bootstrap4/bootstrap4-dark/_variables_dark.scss
@@ -807,6 +807,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/bootstrap4/bootstrap4-light/_variables_light.scss b/themes/bootstrap4/bootstrap4-light/_variables_light.scss
@@ -807,6 +807,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/fluent/fluent-light/_variables.scss b/themes/fluent/fluent-light/_variables.scss
@@ -826,6 +826,7 @@ $speedDialActionTextHoverColor: #ffffff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/lara/lara-dark/_variables.scss b/themes/lara/lara-dark/_variables.scss
@@ -806,6 +806,7 @@ $speedDialActionTextHoverColor: $shade900 !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/lara/lara-light/_variables.scss b/themes/lara/lara-light/_variables.scss
@@ -808,6 +808,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/luna/_variables.scss b/themes/luna/_variables.scss
@@ -795,6 +795,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/material/material-dark/_variables.scss b/themes/material/material-dark/_variables.scss
@@ -804,6 +804,7 @@ $speedDialActionTextHoverColor: #212121 !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/material/material-light/_variables.scss b/themes/material/material-light/_variables.scss
@@ -804,6 +804,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/mira/_variables.scss b/themes/mira/_variables.scss
@@ -830,6 +830,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/nano/_variables.scss b/themes/nano/_variables.scss
@@ -816,6 +816,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/nova/_variables.scss b/themes/nova/_variables.scss
@@ -795,6 +795,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/rhea/_variables.scss b/themes/rhea/_variables.scss
@@ -806,6 +806,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/saga/_variables.scss b/themes/saga/_variables.scss
@@ -808,6 +808,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/soho/soho-dark/_variables.scss b/themes/soho/soho-dark/_variables.scss
@@ -815,6 +815,7 @@ $speedDialActionTextHoverColor: $shade900 !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/soho/soho-light/_variables.scss b/themes/soho/soho-light/_variables.scss
@@ -818,6 +818,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/tailwind/tailwind-light/_variables.scss b/themes/tailwind/tailwind-light/_variables.scss
@@ -815,6 +815,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/vela/_variables.scss b/themes/vela/_variables.scss
@@ -805,6 +805,7 @@ $speedDialActionTextHoverColor: $shade900 !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/viva/viva-dark/_variables.scss b/themes/viva/viva-dark/_variables.scss
@@ -814,6 +814,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;

diff --git a/themes/viva/viva-light/_variables.scss b/themes/viva/viva-light/_variables.scss
@@ -817,6 +817,7 @@ $speedDialActionTextHoverColor: #fff !default;
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: .5rem !default;
+$dockItemBorderRadius:$borderRadius !default;
 $dockCurrentItemMargin: 1.5rem !default;
 $dockFirstItemsMargin: 1.3rem !default;
 $dockSecondItemsMargin: 0.9rem !default;