agw/overleaf-cep
1
0
Fork 0
mirror of https://github.com/yu-i-i/overleaf-cep.git synced 2026-05-23 17:19:37 +02:00
Code Issues Packages Projects Releases Wiki Activity

adding dark theme variables for badge tag (#31238)

Browse Source 
GitOrigin-RevId: 08bd7ed75ecd8a934b8615374d1d976f448310d2
This commit is contained in:
Davinder Singh
2026-02-17 12:31:35 +00:00
committed by Copybot
parent 14943f884c
commit c597e3b1f4
2 changed files with 47 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
services/web/frontend/js/features/project-list/components/table/cells/inline-tags.tsx
View File

@@ -56,7 +56,7 @@ function InlineTag({ tag, projectId }: InlineTagProps) {
closeBtnProps={{
onClick: () => handleRemoveTag(tag._id, projectId),
}}
className="ms-2"
className="ms-2 badge-themed"
translate="no"
>
{tag.name}

46
services/web/frontend/stylesheets/components/badge.scss
View File

@@ -1,3 +1,27 @@
@mixin light-themed-badge-tag {
--badge-tag-themed-content-color: var(--content-primary);
--badge-tag-themed-btn-hover-bg: var(--neutral-40);
--badge-tag-themed-hover-bg: var(--neutral-30);
--badge-tag-themed-btn-bg: var(--neutral-20);
}
@mixin dark-themed-badge-tag {
--badge-tag-themed-content-color: var(--content-primary-dark);
--badge-tag-themed-btn-hover-bg: var(--neutral-60);
--badge-tag-themed-hover-bg: var(--neutral-50);
--badge-tag-themed-btn-bg: var(--neutral-70);
}
:root {
@include light-themed-badge-tag;
@include theme('default') {
.badge.badge-themed {
@include dark-themed-badge-tag;
}
}
}
$max-width: 160px;
.badge {
@@ -150,3 +174,25 @@ $max-width: 160px;
max-width: 200px;
}
}
.badge.badge-themed {
.badge-close,
.badge-tag-content-btn {
&:hover {
background-color: var(--badge-tag-themed-btn-hover-bg);
}
}
&.badge-tag {
color: var(--badge-tag-themed-content-color);
background-color: var(--badge-tag-themed-btn-bg) !important;
&:hover {
background-color: var(--badge-tag-themed-hover-bg) !important;
}
}
.badge-content {
color: var(--badge-tag-themed-content-color);
}
}