Improved accessibility

This commit is contained in:
Prozilla 2023-08-14 19:54:51 +02:00
parent bb1ef97bb6
commit be303e8a68
No known key found for this signature in database
GPG key ID: 5858DFE71CAF31EE
5 changed files with 13 additions and 0 deletions

View file

@ -94,6 +94,7 @@ export function FileExplorer({ startPath }) {
<input <input
value={path} value={path}
type="text" type="text"
aria-label="Path"
className={styles["Path-input"]} className={styles["Path-input"]}
tabIndex={0} tabIndex={0}
onChange={onPathChange} onChange={onPathChange}

View file

@ -41,6 +41,7 @@ function AppearanceTab({ virtualRoot, settingsManager }) {
<input <input
type="radio" type="radio"
value={source} value={source}
aria-label="Wallpaper image"
checked={source === wallpaper ? "checked" : ""} checked={source === wallpaper ? "checked" : ""}
onChange={onChange} onChange={onChange}
/> />

View file

@ -45,6 +45,7 @@ function InputLine({ value, prefix, onChange, onKeyUp, onKeyDown, inputRef }) {
<input <input
id="input" id="input"
value={value} value={value}
aria-label="Command input"
onChange={(event) => { onChange={(event) => {
onChange(event); onChange(event);
checkCursorPosition(); checkCursorPosition();

View file

@ -61,6 +61,7 @@ export function SearchMenu({ active, setActive, searchQuery, setSearchQuery, inp
<input <input
ref={inputRef} ref={inputRef}
className={styles.Input} className={styles.Input}
aria-label="Search query"
tabIndex={tabIndex} tabIndex={tabIndex}
value={searchQuery} value={searchQuery}
onChange={onChange} onChange={onChange}

View file

@ -9,51 +9,60 @@
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-Thin.ttf"); src: url("/public/media/fonts/Poppins/Poppins-Thin.ttf");
font-weight: 100; font-weight: 100;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-ExtraLight.ttf"); src: url("/public/media/fonts/Poppins/Poppins-ExtraLight.ttf");
font-weight: 200; font-weight: 200;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-Light.ttf"); src: url("/public/media/fonts/Poppins/Poppins-Light.ttf");
font-weight: 300; font-weight: 300;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-Regular.ttf"); src: url("/public/media/fonts/Poppins/Poppins-Regular.ttf");
font-weight: 400; font-weight: 400;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-SemiBold.ttf"); src: url("/public/media/fonts/Poppins/Poppins-SemiBold.ttf");
font-weight: 500; font-weight: 500;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-Bold.ttf"); src: url("/public/media/fonts/Poppins/Poppins-Bold.ttf");
font-weight: 600; font-weight: 600;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-ExtraBold.ttf"); src: url("/public/media/fonts/Poppins/Poppins-ExtraBold.ttf");
font-weight: 700; font-weight: 700;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Poppins"; font-family: "Poppins";
src: url("/public/media/fonts/Poppins/Poppins-Black.ttf"); src: url("/public/media/fonts/Poppins/Poppins-Black.ttf");
font-weight: 800; font-weight: 800;
font-display: swap;
} }
@font-face { @font-face {
font-family: "Roboto Mono"; font-family: "Roboto Mono";
src: url("/public/media/fonts/Roboto_Mono/RobotoMono-VariableFont_wght.ttf"); src: url("/public/media/fonts/Roboto_Mono/RobotoMono-VariableFont_wght.ttf");
font-display: swap;
} }