GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-12 20:19:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: light mode design for qb v2 (#6052)

Browse Source
This commit is contained in:
Vikrant Gupta 2024-09-23 15:50:46 +05:30 committed by GitHub
parent f69aaa2cfb
commit a6b05f0a3d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 167 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

111
frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.styles.scss
View File

@ -2,6 +2,10 @@
display: flex;
gap: 4px;
.ant-select-dropdown {
padding: 0px;
}
.show-all-filters {
.content {
.rc-virtual-list-holder {
@ -259,3 +263,110 @@
}
}
}
.lightMode {
.query-builder-search-v2 {
.content {
.operator-for {
.operator-for-text {
color: var(--bg-ink-200);
}
.operator-for-value {
background: rgba(255, 255, 255, 0.1);
color: var(--bg-ink-200);
}
}
.value-for {
.value-for-text {
color: var(--bg-ink-200);
}
.value-for-value {
background: rgba(255, 255, 255, 0.1);
color: var(--bg-ink-400);
}
}
.example-queries {
cursor: default;
.heading {
color: var(--bg-slate-50);
}
.query-container {
.example-query {
background: var(--bg-vanilla-200);
color: var(--bg-ink-400);
}
.example-query:hover {
color: var(--bg-ink-100);
}
}
}
}
.keyboard-shortcuts {
border: 1px solid var(--bg-vanilla-300);
background: var(--bg-vanilla-200);
.icons {
border-top: 1.143px solid var(--bg-ink-200);
border-right: 1.143px solid var(--bg-ink-200);
border-bottom: 2.286px solid var(--bg-ink-200);
border-left: 1.143px solid var(--bg-ink-200);
background: var(--bg-vanilla-300);
}
.keyboard-text {
color: var(--bg-ink-400);
}
.navigate {
border-right: 1px solid #1d212d;
}
.show-all-filter-items {
border-left: 1px solid #1d212d;
}
}
.qb-search-bar-tokenised-tags {
.ant-tag {
border: 1px solid var(--bg-slate-100);
background: var(--bg-vanilla-300);
box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
.ant-typography {
color: var(--bg-ink-100);
}
&.resource {
border: 1px solid rgba(242, 71, 105, 0.2);
.ant-typography {
color: var(--bg-sakura-400);
background: rgba(245, 108, 135, 0.1);
}
.ant-tag-close-icon {
background: rgba(245, 108, 135, 0.1);
}
}
&.tag {
border: 1px solid rgba(189, 153, 121, 0.2);
.ant-typography {
color: var(--bg-sienna-400);
background: rgba(189, 153, 121, 0.1);
}
.ant-tag-close-icon {
background: rgba(189, 153, 121, 0.1);
}
}
}
}
}
}

56
frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/Suggestions.styles.scss
View File

@ -168,3 +168,59 @@
}
}
}
.lightMode {
.text {
color: var(--bg-ink-400);
}
.option {
.container {
display: flex;
align-items: center;
justify-content: space-between;
.right-section {
.data-type {
background: var(--bg-vanilla-300);
}
}
.option-meta-data-container {
display: flex;
gap: 8px;
}
}
.container-without-tag {
.left {
.OPERATOR {
color: var(--bg-ink-400);
}
.VALUE {
color: var(--bg-ink-400);
}
}
.right {
.data-type {
background: var(--bg-vanilla-300);
}
}
}
}
.option:hover {
.container {
.left-section {
.value {
color: var(--bg-ink-100);
}
}
}
.container-without-tag {
.value {
color: var(--bg-ink-100);
}
}
}
}