UI: Replace 'Fork me on GitHub' ribbon with modern icon (#437)#444
UI: Replace 'Fork me on GitHub' ribbon with modern icon (#437)#444Biswas-Samrat wants to merge 3 commits intodevsecopsmaturitymodel:mainfrom
Conversation
|
@wurstbrot Plz Review the changes |
src/index.html
Outdated
| <link rel="preconnect" href="https://fonts.gstatic.com" /> | ||
| <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet" /> | ||
| <link href="https://fonts.googleapis.com/icon?family=Material+Icons|Material+Icons+Outlined" rel="stylesheet" /> | ||
| <!-- <link rel="stylesheet" |
There was a problem hiding this comment.
Thank you. Please remove the code completely, and I'll approve 🙂👍
src/app/app.component.css
Outdated
| background-color: #333; | ||
| .github-button img { | ||
| margin-right: 20px; | ||
| height: 35px; |
There was a problem hiding this comment.
Nice! 🙂
The 35px draws a lot of attention. More than a 'Fork me' I think needs.
I propose:
margin-right: 0px;
height: 20px;
What do you think?
There was a problem hiding this comment.
I have removed the dade code from"src/index.html'
And I think we should add some margin from right to the GitHub, icon, and I resized the icon and 20px height is too small, that's why I gave it 30px height.
There was a problem hiding this comment.
Nothing against margin . But it looks unaligned with the rest of the page. Both on the circular heatmap, as well as the Mappings, Settings and Teams.
I still thinks is draws too much attention. What about using one of the darker gray from custom-theme.scss.
There was a problem hiding this comment.
Hi @vbakke, I've updated the styles! I reduced the icon height to [20px], removed the extra margin
|
@Biswas-Samrat, please check out why the unit test fails. |
|
Hi @Biswas-Samrat ! Would just like to follow up on this. Do you need any help finding out about the test that fails? |
2 participants
This PR modernizes the user interface by removing the legacy "Fork me on GitHub" corner ribbon and replacing it with a clean, modern GitHub icon. This change improves the visual aesthetic and fixes layout issues on the Overview page.
Changes Made
Closes #437