Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(AppHeader): Revamp header #230

Open
wants to merge 17 commits into
base: main
Choose a base branch
from
Open

feat(AppHeader): Revamp header #230

wants to merge 17 commits into from

Conversation

grafakus
Copy link
Contributor

@grafakus grafakus commented Oct 18, 2024

✨ Description

Related issue(s): is blocked by #229

A revamp of the header to be a bit more consistent with the other "Explore" apps: we exchange a bit of vertical real estate in favour of more horizontal real estate. We also "isolate" the "Exploration" row so we can iterate on it later.

📖 Summary of the changes

Most of the changes consist in modifying how the labels appear on the screen (on top of the input instead of being inline, with a greyish background colour):

Before After
Screenshot 2024-10-21 at 10 46 15 image

See diff tab for specific comments.

🧪 How to test?

The build should pass

Copy link
Contributor

github-actions bot commented Oct 18, 2024

Unit test coverage

Lines Statements Branches Functions
Coverage: 11%
11.59% (433/3734) 9.07% (121/1333) 8.57% (102/1189)

@grafakus grafakus changed the base branch from main to feat/revamp-app-header October 18, 2024 16:27
@grafakus grafakus changed the title Feat/consistent header feat(AppHeader): Revamp header Oct 18, 2024
@github-actions github-actions bot added the feat label Oct 18, 2024
Base automatically changed from feat/revamp-app-header to main October 21, 2024 08:02
# Conflicts:
#	src/pages/ProfilesExplorerView/components/SceneExploreDiffFlameGraph/components/SceneDiffFlameGraph/SceneDiffFlameGraph.tsx
#	src/pages/ProfilesExplorerView/components/SceneProfilesExplorer/components/Header.tsx
pageContainer: css`
display: flex;
flex-direction: column;
padding: ${theme.spacing(1)} ${theme.spacing(2)} ${theme.spacing(2)} ${theme.spacing(2)};
Copy link
Contributor Author

@grafakus grafakus Oct 21, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The change in this file is just to remove some padding at the top

height: number;
};

export function PyroscopeLogo({ width, height }: PyroscopeLogoProps) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Convenience

@grafakus grafakus marked this pull request as ready for review October 21, 2024 10:09
@grafakus grafakus marked this pull request as draft October 21, 2024 11:04
@grafakus grafakus marked this pull request as ready for review October 21, 2024 15:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant