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

chore: alignment is fixed in header (#1723)

Browse Source 
* chore: alignment is fixed
This commit is contained in:
Palash Gupta 2022-11-16 19:08:09 +05:30 committed by GitHub
parent ad34c6e25f
commit ac4d35c6c0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/container/ConfigDropdown/index.tsx
View File

@ -52,7 +52,7 @@ function DynamicConfigDropdown({
>
<Space align="center">
<Icon
style={{ fontSize: 26, color: 'white', paddingTop: 20, cursor: 'pointer' }}
style={{ fontSize: 26, color: 'white', paddingTop: 26, cursor: 'pointer' }}
/>
<DropDownIcon style={{ color: 'white' }} />
</Space>

21
frontend/src/container/Header/index.tsx
View File

@ -29,7 +29,12 @@ import AppReducer from 'types/reducer/app';
import CurrentOrganization from './CurrentOrganization';
import ManageLicense from './ManageLicense';
import SignedInAS from './SignedInAs';
import { Container, LogoutContainer, ToggleButton } from './styles';
import {
Container,
IconContainer,
LogoutContainer,
ToggleButton,
} from './styles';
function HeaderContainer({ toggleDarkMode }: Props): JSX.Element {
const { isDarkMode, user, currentVersion } = useSelector<AppState, AppReducer>(
@ -98,10 +103,12 @@ function HeaderContainer({ toggleDarkMode }: Props): JSX.Element {
<Layout.Header>
<Container>
<NavLink to={ROUTES.APPLICATION}>
<img src={`/signoz.svg?currentVersion=${currentVersion}`} alt="SigNoz" />
<Typography.Title style={{ margin: 0, color: '#DBDBDB' }} level={4}>
SigNoz
</Typography.Title>
<Space align="center" direction="horizontal">
<img src={`/signoz.svg?currentVersion=${currentVersion}`} alt="SigNoz" />
<Typography.Title style={{ margin: 0, color: '#DBDBDB' }} level={4}>
SigNoz
</Typography.Title>
</Space>
</NavLink>
<Space style={{ height: '100%' }} align="center">
@ -123,7 +130,9 @@ function HeaderContainer({ toggleDarkMode }: Props): JSX.Element {
>
<Space>
<Avatar shape="circle">{user?.name[0]}</Avatar>
{!isUserDropDownOpen ? <CaretDownFilled /> : <CaretUpFilled />}
<IconContainer>
{!isUserDropDownOpen ? <CaretDownFilled /> : <CaretUpFilled />}
</IconContainer>
</Space>
</Dropdown>
</Space>

5
frontend/src/container/Header/styles.ts
View File

@ -4,6 +4,7 @@ import styled from 'styled-components';
export const Container = styled.div`
display: flex;
justify-content: space-between;
height: 100%;
`;
export const AvatarContainer = styled.div`
@ -61,3 +62,7 @@ export const ToggleButton = styled(Switch)<DarkModeProps>`
font-size: 1rem !important;
}
`;
export const IconContainer = styled.div`
color: white;
`;