GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-07-31 04:41:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: fixed broken header style in dashboard detail page (#5154)

Browse Source
This commit is contained in:
SagarRajput-7 2024-06-05 22:17:28 +05:30 committed by GitHub
parent e5f96ac896
commit 35c054835a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 53 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

93
frontend/src/container/NewDashboard/DashboardDescription/Description.styles.scss
View File

@ -53,53 +53,59 @@
padding: 0px;
}
.dashboard-breadcrumbs {
height: 48px;
padding: 16px;
.dashboard-header {
border-bottom: 1px solid var(--bg-slate-400);
display: flex;
gap: 6px;
justify-content: space-between;
align-items: center;
.dashboard-btn {
.dashboard-breadcrumbs {
height: 48px;
padding: 16px;
display: flex;
gap: 6px;
align-items: center;
color: var(--bg-vanilla-400);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 142.857% */
letter-spacing: -0.07px;
padding: 0px;
height: 20px;
}
.dashboard-btn:hover {
background-color: unset;
}
.id-btn {
display: flex;
align-items: center;
padding: 0px 2px;
border-radius: 2px;
background: rgba(113, 144, 249, 0.1);
color: var(--bg-robin-400);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 142.857% */
height: 20px;
.ant-btn-icon {
margin-inline-end: 4px;
.dashboard-btn {
display: flex;
align-items: center;
color: var(--bg-vanilla-400);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 142.857% */
letter-spacing: -0.07px;
padding: 0px;
height: 20px;
}
.dashboard-btn:hover {
background-color: unset;
}
.id-btn {
display: flex;
align-items: center;
padding: 0px 2px;
border-radius: 2px;
background: rgba(113, 144, 249, 0.1);
color: var(--bg-robin-400);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 142.857% */
height: 20px;
.ant-btn-icon {
margin-inline-end: 4px;
}
}
.id-btn:hover {
background: rgba(113, 144, 249, 0.1);
color: var(--bg-robin-300);
}
}
.id-btn:hover {
background: rgba(113, 144, 249, 0.1);
color: var(--bg-robin-300);
}
}
@ -562,11 +568,12 @@
.dashboard-description-container {
color: var(--bg-ink-400);
.dashboard-breadcrumbs {
.dashboard-header {
border-bottom: 1px solid var(--bg-vanilla-300);
.dashboard-btn {
color: var(--bg-ink-400);
.dashboard-breadcrumbs {
.dashboard-btn {
color: var(--bg-ink-400);
}
}
}

15
frontend/src/container/NewDashboard/DashboardDescription/index.tsx
View File

@ -1,16 +1,7 @@
import './Description.styles.scss';
import { PlusOutlined } from '@ant-design/icons';
import {
Button,
Card,
Flex,
Input,
Modal,
Popover,
Tag,
Typography,
} from 'antd';
import { Button, Card, Input, Modal, Popover, Tag, Typography } from 'antd';
import FacingIssueBtn from 'components/facingIssueBtn/FacingIssueBtn';
import { dashboardHelpMessage } from 'components/facingIssueBtn/util';
import { SOMETHING_WENT_WRONG } from 'constants/api';
@ -261,7 +252,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
return (
<Card className="dashboard-description-container">
<Flex justify="space-between" align="center">
<div className="dashboard-header">
<section className="dashboard-breadcrumbs">
<Button
type="text"
@ -297,7 +288,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
buttonText="Facing issues with dashboards?"
onHoverText="Click here to get help with dashboard details"
/>
</Flex>
</div>
<section className="dashbord-details">
<div className="left-section">
<img