IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-14 01:23:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

Public Dashboards: Add Grafana logo to public dashboards (#55641)

Browse Source 
* add floating footer logo to pubdash pages

* make it a link

* fix typo

* use rem instead of pixels

* Update public/app/features/dashboard/components/PubdashFooter/PubdashFooter.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update public/app/features/dashboard/components/PubdashFooter/PubdashFooter.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update public/app/features/dashboard/components/PubdashFooter/PubdashFooter.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update public/app/features/dashboard/components/PubdashFooter/PubdashFooter.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* PR feedback

* add todo

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
This commit is contained in:
Michael Mandrus 2022-09-23 14:32:34 -04:00 committed by GitHub
parent af9e58eeeb
commit f8bde4df09
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 44 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
public/app/features/dashboard/components/PubdashFooter/PubdashFooter.tsx Normal file
View File

@ -0,0 +1,39 @@
import { css } from '@emotion/css';
import React from 'react';
import { GrafanaTheme2, colorManipulator } from '@grafana/data';
import { useStyles2 } from '@grafana/ui';
export const PubdashFooter = function () {
const styles = useStyles2(getStyles);
return (
<div className={styles.footer}>
<span className={styles.logoText}>
<a href="https://grafana.com/" target="_blank" rel="noreferrer noopener">
powered by Grafana <img className={styles.logoImg} src="public/img/grafana_icon.svg"></img>
</a>
</span>
</div>
);
};
const getStyles = (theme: GrafanaTheme2) => ({
footer: css`
position: absolute;
height: 30px;
bottom: 0;
width: 100%;
background-color: ${colorManipulator.alpha(theme.colors.background.canvas, 0.7)};
text-align: right;
font-size: ${theme.typography.body.fontSize};
z-index: ${theme.zIndex.navbarFixed};
`,
logoText: css`
margin-right: ${theme.spacing(1)};
`,
logoImg: css`
height: 100%;
padding: ${theme.spacing(0.25, 0, 0.5, 0)};
`,
});

5
public/app/features/dashboard/containers/DashboardPage.tsx
View File

@ -28,6 +28,7 @@ import { DashboardPrompt } from '../components/DashboardPrompt/DashboardPrompt';
import { DashboardSettings } from '../components/DashboardSettings';
import { PanelInspector } from '../components/Inspector/PanelInspector';
import { PanelEditor } from '../components/PanelEditor/PanelEditor';
import { PubdashFooter } from '../components/PubdashFooter/PubdashFooter';
import { SubMenu } from '../components/SubMenu/SubMenu';
import { DashboardGrid } from '../dashgrid/DashboardGrid';
import { liveTimer } from '../dashgrid/liveTimer';
@ -401,6 +402,10 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
sectionNav={sectionNav}
/>
)}
{
// TODO: assess if there are other places where we may want a footer, which may reveal a better place to add this
isPublic && <PubdashFooter />
}
</>
);
}