Skip to content

Commit c3e08c0

Browse files
committed
Update style link by WebAIM recommendation
1 parent 5139de1 commit c3e08c0

File tree

2 files changed

+6
-5
lines changed

2 files changed

+6
-5
lines changed

demo/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
<body>
1919

2020
<div id="app">
21+
<!-- data-vst is used for internal testing, it is not required -->
2122
<vue-skip-to data-vst="skip-to"></vue-skip-to>
2223
<header>
2324
<h1>Press tab</h1>
@@ -44,7 +45,6 @@ <h1>Press tab</h1>
4445
Sed elit nunc, volutpat in urna vel, hendrerit vulputate justo. Etiam pulvinar id ligula in ultrices. Suspendisse nulla risus, accumsan quis sagittis ac, faucibus eget dolor. Curabitur ullamcorper magna eget consequat facilisis. Cras massa leo, tristique nec tempus ac, auctor in arcu. Quisque a faucibus ex, congue eleifend ante. Praesent ultrices arcu neque, eget lacinia erat ultrices eget.
4546
</p>
4647
</div>
47-
4848
</div>
4949
<script>
5050
var App = new Vue({

src/skip-to.vue

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -55,17 +55,18 @@ export default {
5555
<style>
5656
.vue-skip-to {
5757
position: absolute;
58-
left: 0;
59-
top: -100%;
58+
left: -10000px;
59+
top: 0;
6060
z-index: 1000;
61-
width: max-content;
61+
min-width: 1px;
62+
min-height: 1px;
63+
overflow: hidden;
6264
padding: 8px 10px;
6365
color: #fff
6466
}
6567
6668
.vue-skip-to:focus {
6769
background-color: #800000;
68-
top: 0;
6970
left: 0;
7071
}
7172
</style>

0 commit comments

Comments
 (0)