@tpzdsp/next-toolkit 1.4.4 → 1.4.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
/* Component-specific styles */
|
|
25
25
|
@layer components {
|
|
26
26
|
.focus-yellow {
|
|
27
|
-
@apply
|
|
27
|
+
@apply z-20 focus:border-[#ffbf47] focus:outline focus:outline-[3px] focus:outline-[#ffbf47];
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
.library-button {
|
package/src/assets/styles/ol.css
CHANGED
|
@@ -16,8 +16,8 @@
|
|
|
16
16
|
.ol-layer-switcher-panel button:focus,
|
|
17
17
|
.ol-attribution ul li a:focus,
|
|
18
18
|
.ol-attribution ul li a:focus-visible,
|
|
19
|
-
.ol-geocoder ul.gcd-txt-result>li>a:focus,
|
|
20
|
-
.ol-geocoder ul.gcd-txt-result>li>a:focus-visible {
|
|
19
|
+
.ol-geocoder ul.gcd-txt-result > li > a:focus,
|
|
20
|
+
.ol-geocoder ul.gcd-txt-result > li > a:focus-visible {
|
|
21
21
|
outline: 3px solid #ffbf47 !important;
|
|
22
22
|
border-color: #ffbf47 !important;
|
|
23
23
|
z-index: 2;
|
|
@@ -32,7 +32,9 @@
|
|
|
32
32
|
|
|
33
33
|
.ol-geocoder .gcd-txt-input:focus,
|
|
34
34
|
.ol-geocoder .gcd-txt-input:focus-visible {
|
|
35
|
-
box-shadow:
|
|
35
|
+
box-shadow:
|
|
36
|
+
inset 0 0 0 1px #ffbf47,
|
|
37
|
+
inset 0 0 6px #ffbf47;
|
|
36
38
|
}
|
|
37
39
|
|
|
38
40
|
/* Zoom control container */
|
|
@@ -57,7 +59,10 @@
|
|
|
57
59
|
line-height: 1;
|
|
58
60
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
|
|
59
61
|
cursor: pointer;
|
|
60
|
-
transition:
|
|
62
|
+
transition:
|
|
63
|
+
border-color 0.2s,
|
|
64
|
+
box-shadow 0.2s,
|
|
65
|
+
background 0.2s;
|
|
61
66
|
margin: 0;
|
|
62
67
|
padding: 0;
|
|
63
68
|
display: flex;
|
|
@@ -95,7 +100,10 @@
|
|
|
95
100
|
line-height: 1;
|
|
96
101
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
|
|
97
102
|
cursor: pointer;
|
|
98
|
-
transition:
|
|
103
|
+
transition:
|
|
104
|
+
border-color 0.2s,
|
|
105
|
+
box-shadow 0.2s,
|
|
106
|
+
background 0.2s;
|
|
99
107
|
margin: 0;
|
|
100
108
|
padding: 0;
|
|
101
109
|
display: flex;
|
|
@@ -213,11 +221,12 @@
|
|
|
213
221
|
top: unset !important;
|
|
214
222
|
}
|
|
215
223
|
|
|
216
|
-
.ol-geocoder ul.gcd-txt-result>li:nth-child(odd),
|
|
217
|
-
.ol-geocoder ul.gcd-txt-result>li:nth-child(even) {
|
|
224
|
+
.ol-geocoder ul.gcd-txt-result > li:nth-child(odd),
|
|
225
|
+
.ol-geocoder ul.gcd-txt-result > li:nth-child(even) {
|
|
226
|
+
background-color: #fff;
|
|
218
227
|
background-color: #fff;
|
|
219
228
|
}
|
|
220
229
|
|
|
221
|
-
.ol-geocoder ul.gcd-txt-result>li>a:hover {
|
|
230
|
+
.ol-geocoder ul.gcd-txt-result > li > a:hover {
|
|
222
231
|
background-color: #f3f2f1;
|
|
223
232
|
}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
1
3
|
import { Link } from '../link/Link';
|
|
2
4
|
|
|
3
5
|
export type SkipLinkProps = {
|
|
@@ -5,12 +7,30 @@ export type SkipLinkProps = {
|
|
|
5
7
|
};
|
|
6
8
|
|
|
7
9
|
export const SkipLink = ({ mainContentId = 'main-content' }: SkipLinkProps) => {
|
|
10
|
+
const handleActivate = () => {
|
|
11
|
+
// Let the browser scroll first, then move focus
|
|
12
|
+
setTimeout(() => {
|
|
13
|
+
const main = document.getElementById(mainContentId);
|
|
14
|
+
|
|
15
|
+
if (main) {
|
|
16
|
+
main.focus();
|
|
17
|
+
}
|
|
18
|
+
}, 0);
|
|
19
|
+
};
|
|
20
|
+
|
|
8
21
|
return (
|
|
9
22
|
<nav aria-label="Skip navigation">
|
|
10
23
|
<Link
|
|
11
24
|
className="bg-focus focus:relative focus:top-0 w-full absolute -top-full text-black
|
|
12
25
|
visited:text-black hover:text-black p-3 skip-link"
|
|
13
26
|
href={`#${mainContentId}`}
|
|
27
|
+
onClick={handleActivate}
|
|
28
|
+
onKeyDown={(event) => {
|
|
29
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
30
|
+
event.preventDefault(); // Prevent default scroll/jump
|
|
31
|
+
handleActivate();
|
|
32
|
+
}
|
|
33
|
+
}}
|
|
14
34
|
>
|
|
15
35
|
Skip to main content
|
|
16
36
|
</Link>
|