agw/overleaf-cep
1
0
Fork 0
mirror of https://github.com/yu-i-i/overleaf-cep.git synced 2026-11-14 22:23:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #22272 from overleaf/rd-tag-dropdown-fix

Browse Source 
[web] Tag dropdown menu should not be dismissed when hovering outside of it

GitOrigin-RevId: 0f0f903e07d657752e3476b9abea643bae65eb9e
This commit is contained in:
Rebeka Dekany
2024-12-06 09:05:51 +00:00
committed by Copybot
parent 046c70c01c
commit 3fce3930b8
2 changed files with 17 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
services/web/frontend/js/features/project-list/components/sidebar/tags-list.tsx
+2 -3
View File
@@ -78,11 +78,10 @@ export default function TagsList() {
<Dropdown align="end" className="tag-menu"> <Dropdown align="end" className="tag-menu">
<DropdownToggle <DropdownToggle
aria-label={t('open_action_menu', { name: tag.name })}
id={`${tag._id}-dropdown-toggle`} id={`${tag._id}-dropdown-toggle`}
data-testid="tag-dropdown-toggle" data-testid="tag-dropdown-toggle"
> />
<span className="caret" />
</DropdownToggle>
<DropdownMenu className="dropdown-menu-sm-width"> <DropdownMenu className="dropdown-menu-sm-width">
<DropdownItem <DropdownItem
as="li" as="li"
services/web/frontend/stylesheets/bootstrap-5/pages/project-list.scss
+15 -8
View File
@@ -255,7 +255,7 @@
width: 100%; width: 100%;
font-weight: normal; font-weight: normal;
text-align: left; text-align: left;
color: var(--white); color: var(--content-primary-dark);
background-color: transparent; background-color: transparent;
border-radius: unset; border-radius: unset;
border: none; border: none;
@@ -292,10 +292,10 @@
> button { > button {
background-color: var(--neutral-90); background-color: var(--neutral-90);
font-weight: 700; font-weight: 700;
color: var(--white); color: var(--content-primary-dark);
.subdued { .subdued {
color: var(--white); color: var(--content-primary-dark);
} }
} }
} }
@@ -309,9 +309,16 @@
} }
> li.tag { > li.tag {
&.active,
&:focus-within {
.tag-menu {
display: block;
}
}
&.active { &.active {
.tag-menu > button { .tag-menu > button {
color: var(--white); color: var(--content-primary-dark);
border-color: var(--white); border-color: var(--white);
&:hover { &:hover {
@@ -370,7 +377,7 @@
border: 1px solid var(--white); border: 1px solid var(--white);
border-radius: var(--border-radius-base); border-radius: var(--border-radius-base);
background-color: transparent; background-color: transparent;
color: var(--white); color: var(--content-primary-dark);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -405,7 +412,7 @@
font-weight: normal; font-weight: normal;
&:hover { &:hover {
color: var(--white); color: var(--content-primary-dark);
background-color: var(--bg-accent-01); background-color: var(--bg-accent-01);
} }
@@ -845,7 +852,7 @@ form.project-search {
.color-picker-item-icon { .color-picker-item-icon {
margin: 3px; // it's centered, no matching spacing variable margin: 3px; // it's centered, no matching spacing variable
color: var(--white); color: var(--content-primary-dark);
font-weight: bold; font-weight: bold;
} }
@@ -856,7 +863,7 @@ form.project-search {
.color-picker-item-icon { .color-picker-item-icon {
margin: 5px; // it's centered, no matching spacing variable margin: 5px; // it's centered, no matching spacing variable
color: var(--white); color: var(--content-primary-dark);
} }
} }
} }