mirrors/AdGuardHome
1
0
Fork 0
mirror of https://github.com/AdguardTeam/AdGuardHome.git synced 2025-04-30 21:21:42 +03:00
Code Issues Projects Releases Packages Wiki Activity

Fix footer layout

Browse source
This commit is contained in:
Ildar Kamalov 2018-11-16 12:46:18 +03:00
parent 5bf38041c5
commit ced5499083
5 changed files with 86 additions and 26 deletions
client/src/components/ui
Footer.js

49
client/src/components/ui/Footer.js
View file

@ -3,6 +3,9 @@ import { Trans, withNamespaces } from 'react-i18next';
import { REPOSITORY } from '../../helpers/constants';
import i18n, { languages } from '../../i18n';
import './Footer.css';
import './Select.css';
class Footer extends Component {
getYear = () => {
const today = new Date();
@ -17,34 +20,28 @@ class Footer extends Component {
return (
<footer className="footer">
<div className="container">
<div className="row align-items-center flex-row">
<div className="col-12 col-lg-auto mt-3 mt-lg-0 text-center">
<div className="row align-items-center justify-content-center">
<div className="col-auto">
<Trans>copyright</Trans> © {this.getYear()} <a href="https://adguard.com/">AdGuard</a>
</div>
<div className="col-auto">
<select className="form-control" value={i18n.language} onChange={this.changeLanguage}>
{ languages.map(language => <option
key={language.key} value={language.key}>
{language.name}
</option>) }
</select>
</div>
<div className="col-auto">
<ul className="list-inline text-center mb-0">
<li className="list-inline-item">
<a href={REPOSITORY.URL} target="_blank" rel="noopener noreferrer"><Trans>homepage</Trans></a>
</li>
</ul>
</div>
<div className="col-auto">
<a href={`${REPOSITORY.URL}/issues/new`} className="btn btn-outline-primary btn-sm" target="_blank" rel="noopener noreferrer">
<Trans>report_an_issue</Trans>
</a>
</div>
<div className="footer__row">
<div className="footer__column">
<div className="footer__copyright">
<Trans>copyright</Trans> © {this.getYear()} <a href="https://adguard.com/">AdGuard</a>
</div>
</div>
<div className="footer__column">
<a href={REPOSITORY.URL} className="footer__link" target="_blank" rel="noopener noreferrer">
<Trans>homepage</Trans>
</a>
<a href={`${REPOSITORY.URL}/issues/new`} className="btn btn-outline-primary btn-sm footer__link footer__link--report" target="_blank" rel="noopener noreferrer">
<Trans>report_an_issue</Trans>
</a>
</div>
<div className="footer__column footer__column--language">
<select className="form-control select select--language" value={i18n.language} onChange={this.changeLanguage}>
{ languages.map(language => <option
key={language.key} value={language.key}>
{language.name}
</option>) }
</select>
</div>
</div>
</div>
</footer>