AJR/TechRadarAJR
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add disclaimer and social icons

Browse Source
This commit is contained in:
Daniel Pötzinger
2017-04-01 15:23:55 +02:00
parent e05d63ebbb
commit d8820335b6
6 changed files with 90 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/components/App.js
View File

@@ -6,6 +6,7 @@ import actions from '../actions';
import Header from './Header';
import Footer from './Footer';
import Router from './Router';
import FooterEnd from './FooterEnd';
function App(props) {
return (
@@ -19,6 +20,7 @@ function App(props) {
</div>
<div className="page__footer">
<Footer {...props} />
<FooterEnd {...props} />
</div>
</div>
</div>

27
js/components/FooterEnd.js Normal file
View File

@@ -0,0 +1,27 @@
import React from 'react';
import classNames from 'classnames';
import { getItemPageNames } from '../../common/config';
export default function FooterEnd({ items, pageName }) {
return (
<div className={classNames('footer-end', {'footer-end-left': getItemPageNames(items).includes(pageName)})} >
<div className="footer-social">
<div className="footer-social-label">
<p>Follow us:</p>
</div>
<div className="footer-social-links">
<a class="social-links-icon" href="https://www.facebook.com/aoepeople" target="_blank"><i className="socicon-facebook social-icon"></i></a>
<a class="social-links-icon" href="https://twitter.com/aoepeople" target="_blank"><i className="socicon-twitter social-icon"></i></a>
<a class="social-links-icon" href="https://www.linkedin.com/company/aoe" target="_blank"><i className="socicon-linkedin social-icon"></i></a>
<a class="social-links-icon" href="https://www.xing.com/company/aoe" target="_blank"><i className="socicon-xing social-icon"></i></a>
<a class="social-links-icon" href="https://www.youtube.com/user/aoepeople" target="_blank"><i className="socicon-youtube social-icon"></i></a>
</div>
</div>
<div className="footer-copyright">
<p><a href="https://www.aoe.com/en/copyright-meta/legal-information.html" target="_blank">Legal Information</a></p>
</div>
</div>
);
}

1
js/server.js
View File

@@ -36,6 +36,7 @@ const renderFullPage = (html, pageTitle, preloadedState) => {
<head>
<title>${pageTitle} | AOE Technology Radar</title>
<link rel="stylesheet" href="/styles.css"/>
<link rel="stylesheet" href="https://d1azc1qln24ryf.cloudfront.net/114779/Socicon/style-cf.css?c2sn1i">
</head>
<body>
<div id="root">${html}</div>

30
styles/components/footerend.css Normal file
View File

@@ -0,0 +1,30 @@
.footer-end {
font-size: 12px;
color: var(--color-gray-normal);
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
align-items: center;
padding: 0 0 10px 0;
& a {
color: var(--color-gray-normal);
}
& .footer-social {
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
& .footer-social-label {
margin: 0 10px 0 0;
}
}
}
.footer-end-left {
flex-direction: column;
align-items: flex-start;
}

2
styles/components/footnote.css
View File

@@ -1,4 +1,4 @@
.footnote {
font-size: 12px;
color: var(--color-gray-normal);
}
}

29
styles/components/social-icon.css Normal file
View File

@@ -0,0 +1,29 @@
.social-icon {
font-weight: normal;
font-style: normal;
font-size: 16px; /* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
background-color: var(--color-white);
border-radius: 50%;
padding: 7px;
margin: 0 5px 0 5px;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
font-feature-settings: 'liga';
}