mudhorn/prometheus
1
0
Fork 0
mirror of https://github.com/prometheus/prometheus.git synced 2024-11-09 23:24:05 -08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Add Prometheus Logo (#10233)

Browse source 
* Add Prometheus logo in react UI

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* Use REM

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* increase the margin top of the navbar-brand

Signed-off-by: Augustin Husson <husson.augustin@gmail.com>

Co-authored-by: Julien Pivotto <roidelapluie@inuits.eu>
This commit is contained in:
Augustin Husson 2022-02-01 15:39:35 +01:00 committed by GitHub
parent be7ed73efc
commit 68bfd226fb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
web/ui/react-app/public/prometheus_logo_grey.svg Normal file
View file

@ -0,0 +1,19 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="115.333px" height="114px" viewBox="0 0 115.333 114" enable-background="new 0 0 115.333 114" xml:space="preserve">
<g id="Layer_2">
</g>
<g>
<path fill="#EEEEEE" d="M56.667,0.667C25.372,0.667,0,26.036,0,57.332c0,31.295,25.372,56.666,56.667,56.666
s56.666-25.371,56.666-56.666C113.333,26.036,87.961,0.667,56.667,0.667z M56.667,106.722c-8.904,0-16.123-5.948-16.123-13.283
H72.79C72.79,100.773,65.571,106.722,56.667,106.722z M83.297,89.04H30.034v-9.658h53.264V89.04z M83.106,74.411h-52.92
c-0.176-0.203-0.356-0.403-0.526-0.609c-5.452-6.62-6.736-10.076-7.983-13.598c-0.021-0.116,6.611,1.355,11.314,2.413
c0,0,2.42,0.56,5.958,1.205c-3.397-3.982-5.414-9.044-5.414-14.218c0-11.359,8.712-21.285,5.569-29.308
c3.059,0.249,6.331,6.456,6.552,16.161c3.252-4.494,4.613-12.701,4.613-17.733c0-5.21,3.433-11.262,6.867-11.469
c-3.061,5.045,0.793,9.37,4.219,20.099c1.285,4.03,1.121,10.812,2.113,15.113C63.797,33.534,65.333,20.5,71,16
c-2.5,5.667,0.37,12.758,2.333,16.167c3.167,5.5,5.087,9.667,5.087,17.548c0,5.284-1.951,10.259-5.242,14.148
c3.742-0.702,6.326-1.335,6.326-1.335l12.152-2.371C91.657,60.156,89.891,67.418,83.106,74.411z"/>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
web/ui/react-app/src/Navbar.tsx
View file

@ -28,6 +28,12 @@ const Navigation: FC<NavbarProps> = ({ consolesLink, agentMode }) => {
<Navbar className="mb-3" dark color="dark" expand="md" fixed="top">
<NavbarToggler onClick={toggle} className="mr-2" />
<Link className="pt-0 navbar-brand" to={agentMode ? '/agent' : '/graph'}>
<img
src={`${pathPrefix}/prometheus_logo_grey.svg`}
className="d-inline-block align-top"
alt="Prometheus logo"
title="Prometheus"
/>
Prometheus{agentMode && ' Agent'}
</Link>
<Collapse isOpen={isOpen} navbar style={{ justifyContent: 'space-between' }}>

9
web/ui/react-app/src/themes/_shared.scss
View file

@ -104,6 +104,15 @@ button.execute-btn {
margin-bottom: 20px;
}
.navbar-brand img {
padding-right: 1rem;
height: 1.9rem;
}
.navbar-brand {
margin-top: 4px;
}
input[type='checkbox']:checked + label {
color: #286090;
}