greatbody
/
freeCodeCamp
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(client): keep editor tabs buttons visible (#53373)

pull/53807/head
Krzysztof G 2024-02-20 10:40:19 +01:00 committed by GitHub
parent f9c0756ec8
commit 3c39511d49
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/src/components/Header/components/universal-nav.css
View File

@ -422,10 +422,10 @@ li > button.nav-link-signout:not([aria-disabled='true']):is(:hover, :focus) {
/**
* Handle submenu containers collapsed and expanded states
*/
button[aria-expanded='false'] + div {
#universal-nav button[aria-expanded='false'] + div {
display: none;
}
button[aria-expanded='true'] + div {
#universal-nav button[aria-expanded='true'] + div {
display: block;
}

9
client/src/templates/Challenges/classic/classic.css
View File

@ -23,20 +23,23 @@
}
.monaco-editor-tabs button[aria-expanded='true'],
.panel-display-tabs button[aria-expanded='true'] {
.panel-display-tabs button[aria-expanded='true'],
.tabs-row button[aria-expanded='true'] {
border-color: var(--primary-color);
background-color: var(--primary-color);
color: var(--secondary-background);
}
.monaco-editor-tabs button:hover,
.panel-display-tabs button:hover {
.panel-display-tabs button:hover,
.tabs-row button:hover {
color: var(--secondary-color);
background-color: var(--primary-background);
}
.monaco-editor-tabs button[aria-expanded='true']:hover,
.panel-display-tabs button[aria-expanded='true']:hover {
.panel-display-tabs button[aria-expanded='true']:hover,
.tabs-row button[aria-expanded='true']:hover {
background-color: var(--quaternary-color);
color: var(--secondary-background);
}

4
e2e/action-row.spec.ts
View File

@ -47,7 +47,7 @@ test('Action row buttons are visible', async ({ isMobile, page }) => {
}
});
test('Clicking instructions button hides editor buttons', async ({
test('Clicking instructions button hides instructions panel, but not editor buttons', async ({
isMobile,
page
}) => {
@ -62,7 +62,7 @@ test('Clicking instructions button hides editor buttons', async ({
for (let i = 0; i < editorButtons.length; i++) {
const btn = tabsRow.getByRole('button', { name: editorButtons[i] });
await expect(btn).toBeHidden();
await expect(btn).toBeVisible();
}
const instructionsPanelTitle = page.getByRole('heading', {