mirrors/BitwiseCmd
1
0
Fork 0
mirror of https://github.com/BorysLevytskyi/BitwiseCmd.git synced 2026-01-19 02:12:40 +01:00
Code Issues Projects Releases Wiki Activity

Replace custom icons with font awesome

Browse Source
This commit is contained in:
Borys_Levytskyi
2021-01-14 22:43:23 +02:00
parent 2e8ed36534
commit 28592ba44d
12 changed files with 76 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/shell/components/AppRoot.tsx
View File

@@ -6,6 +6,8 @@ import cmd from '../cmd';
import log from 'loglevel';
import Indicators from './Indicators';
import hash from '../../core/hash';
import TopLinks from './TopLinks';
type AppRootProps = {
appState: AppState,
@@ -51,17 +53,7 @@ export default class AppRoot extends React.Component<AppRootProps, AppRootState>
<div className="header">
<h1>Bitwise<span className="header-cmd">Cmd</span>
</h1>
<ul className="top-links">
<li>
<a href="https://github.com/BorisLevitskiy/BitwiseCmd"><i className="icon github">&nbsp;</i><span className="link-text">Project on GitHub</span></a>
</li>
<li>
<a href="https://twitter.com/BitwiseCmd"><i className="icon twitter">&nbsp;</i><span className="link-text">Twitter</span></a>
</li>
<li>
<a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback"><i className="icon feedback">&nbsp;</i><span className="link-text">Send Feedback</span></a>
</li>
</ul>
<TopLinks />
</div>
<div className="expressionInput-container">

5
src/shell/components/TopLinks.css Normal file
View File

@@ -0,0 +1,5 @@
.top-links { position: absolute; right: 10px; top: 10px; list-style-type: none; margin: 0 }
.top-links li { float: left; }
.top-links a { display: inline-block; padding: 10px 15px}
.top-links .icon { margin-right: 5px; vertical-align: middle; }

21
src/shell/components/TopLinks.tsx Normal file
View File

@@ -0,0 +1,21 @@
import React from 'react';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import { faEnvelope } from "@fortawesome/free-solid-svg-icons";
import { faTwitter, faGithub} from "@fortawesome/free-brands-svg-icons";
import './TopLinks.css';
function TopLinks() {
return <ul className="top-links">
<li>
<a href="https://github.com/BorisLevitskiy/BitwiseCmd"><FontAwesomeIcon className="icon" icon={faGithub} size="lg" />Project on GitHub</a>
</li>
<li>
<a href="https://twitter.com/BitwiseCmd"><FontAwesomeIcon className="icon" icon={faTwitter} size="lg" /><span className="link-text">Twitter</span></a>
</li>
<li>
<a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback"><FontAwesomeIcon className="icon" icon={faEnvelope} size="lg" /><span className="link-text">Send Feedback</span></a>
</li>
</ul>;
}
export default TopLinks;