c8h4/aux-search
1
0
Fork 0
Code Issues Pull requests Packages Releases Activity

Accessibility fixes (#651)

Browse source 
* frontend: fix critical accessibility issues, logo alt and language

* frontend: use buttons for pagination, override bootstrap for accessibility

* frontend: heading elements in sequential order

* frontend: override badge contrast ratio

* frontend: fix import

* frontend: fixup

---------

Co-authored-by: Naïm Favier <n@monade.li>
This commit is contained in:
Marco Daniel Martins 2023-04-27 21:43:27 +02:00 committed by GitHub
parent 1ecb696edd
commit 0d663f27fa
Failed to generate hash of commit
4 changed files with 52 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
frontend/src/Main.elm
View file

@ -19,7 +19,8 @@ import Html
)
import Html.Attributes
exposing
( class
( alt
, class
, classList
, href
, id
@ -375,7 +376,7 @@ view model =
[ div [ class "navbar-inner" ]
[ div [ class "container" ]
[ a [ class "brand", href "https://nixos.org" ]
[ img [ src "https://nixos.org/logo/nix-wiki.png", class "logo" ] []
[ img [ alt "NixOS logo", src "https://nixos.org/logo/nix-wiki.png", class "logo" ] []
]
, div []
[ ul [ class "nav pull-left" ]

35
frontend/src/Search.elm
View file

@ -62,6 +62,7 @@ import Html.Attributes
, autofocus
, class
, classList
, disabled
, href
, id
, placeholder
@ -988,7 +989,7 @@ viewChannels nixosChannels outMsg selectedChannel =
in
List.append
[ div []
[ h4 [] [ text "Channel: " ]
[ h2 [] [ text "Channel: " ]
, div
[ class "btn-group"
, attribute "data-toggle" "buttons-radio"
@ -1138,9 +1139,11 @@ viewPager :
viewPager model total =
div []
[ ul [ class "pager" ]
[ li [ classList [ ( "disabled", model.from == 0 ) ] ]
[ a
[ onClick <|
[ li []
[ button
[ class "btn"
, disabled (model.from == 0)
, onClick <|
if model.from == 0 then
NoOp
@ -1149,9 +1152,11 @@ viewPager model total =
]
[ text "First" ]
]
, li [ classList [ ( "disabled", model.from == 0 ) ] ]
[ a
[ onClick <|
, li []
[ button
[ class "btn"
, disabled (model.from == 0)
, onClick <|
if model.from - model.size < 0 then
NoOp
@ -1160,9 +1165,11 @@ viewPager model total =
]
[ text "Previous" ]
]
, li [ classList [ ( "disabled", model.from + model.size >= total ) ] ]
[ a
[ onClick <|
, li []
[ button
[ class "btn"
, disabled (model.from + model.size >= total)
, onClick <|
if model.from + model.size >= total then
NoOp
@ -1171,9 +1178,11 @@ viewPager model total =
]
[ text "Next" ]
]
, li [ classList [ ( "disabled", model.from + model.size >= total ) ] ]
[ a
[ onClick <|
, li []
[ button
[ class "btn"
, disabled (model.from + model.size >= total)
, onClick <|
if model.from + model.size >= total then
NoOp

3
frontend/src/index.html
View file

@ -1,12 +1,11 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>NixOS Search</title>
<script type="text/javascript" src="https://nixos.org/js/jquery.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

27
frontend/src/index.scss
View file

@ -151,11 +151,12 @@ header .navbar.navbar-static-top {
margin-bottom: 0.5em;
// "Channels: " label
& > div > h4 {
& > div > h2 {
display: inline;
vertical-align: middle;
font-size: 1.2em;
margin-left: 0.2em;
line-height: 20px
}
}
}
@ -549,3 +550,27 @@ header .navbar.navbar-static-top {
height: 5em;
}
}
/* ------------------------------------------------------------------------- */
/* -- Accessibility overrides ---------------------------------------------- */
/* ------------------------------------------------------------------------- */
.label-info {
background: #007dbb;
}
a {
color: #007dbb;
}
.pager {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 20em;
margin: 0 auto;
padding: 20px 0;
}
.badge {
background-color: #757575
}