random-mirrors
/
cosmos-explorer
mirror of https://github.com/Azure/cosmos-explorer.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[accessibility-3549715]:[Screen reader - Cosmos DB Query Copilot - Query Faster with Copilot>Enable Query Advisor]: Screen reader does not announce status information which appears on invoking the 'Send' button.

This commit is contained in:
Satyapriya Bai 2024-10-29 16:29:34 +05:30
parent 8800f2ef25
commit edd65d198b
1 changed files with 25 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/Explorer/QueryCopilot/QueryCopilotPromptbar.tsx
View File

@ -711,31 +711,31 @@ export const QueryCopilotPromptbar: React.FC<QueryCopilotPromptProps> = ({
<span role="alert" className="screenReaderOnly" aria-label={getAriaLabel()} /> <span role="alert" className="screenReaderOnly" aria-label={getAriaLabel()} />
)} )}
{isGeneratingQuery && ( {isGeneratingQuery && (
<ProgressIndicator <ProgressIndicator
label="Thinking..." label="Thinking..."
ariaLabel={getAriaLabel()} ariaLabel={getAriaLabel()}
barHeight={4} barHeight={4}
styles={{ styles={{
root: { root: {
fontSize: 12, fontSize: 12,
width: "100%", width: "100%",
bottom: 0, bottom: 0,
}, },
itemName: { itemName: {
padding: "0px 8px", padding: "0px 8px",
}, },
itemProgress: { itemProgress: {
borderBottomLeftRadius: 8, borderBottomLeftRadius: 8,
borderBottomRightRadius: 8, borderBottomRightRadius: 8,
padding: 0, padding: 0,
}, },
progressBar: { progressBar: {
backgroundImage: backgroundImage:
"linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgb(24, 90, 189) 35%, rgb(71, 207, 250) 70%, rgb(180, 124, 248) 92%, rgba(0, 0, 0, 0))", "linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgb(24, 90, 189) 35%, rgb(71, 207, 250) 70%, rgb(180, 124, 248) 92%, rgba(0, 0, 0, 0))",
animationDuration: "5s", animationDuration: "5s",
}, },
}} }}
/> />
)} )}
</Stack> </Stack>
<IconButton <IconButton