better terminal animation

This commit is contained in:
Nicholas Orlowsky 2021-06-30 16:21:57 -04:00
parent e482a678bf
commit 5c3fb3d0ee
6 changed files with 7 additions and 22 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.4 KiB

View file

@ -1,23 +1,6 @@
{ {
"short_name": "React App", "short_name": "personal-site",
"name": "Create React App Sample", "name": "My personal website",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".", "start_url": ".",
"display": "standalone", "display": "standalone",
"theme_color": "#000000", "theme_color": "#000000",

View file

@ -10,11 +10,13 @@ import Contact from "./components/contact/Contact";
import Terminal from "./components/terminal/Terminal"; import Terminal from "./components/terminal/Terminal";
function App() { function App() {
const [isTerminalVisible, setIsTerminalVisible] = useState(false);
const showTerm: boolean = new URLSearchParams(window.location.search).get("showTerm") === 'true';
const [isTerminalVisible, setIsTerminalVisible] = useState(showTerm);
return ( return (
<div className="App"> <div className="App">
<Terminal isTerminalVisible={isTerminalVisible} setIsTerminalVisible={setIsTerminalVisible}/> {showTerm && <Terminal isTerminalVisible={isTerminalVisible} setIsTerminalVisible={setIsTerminalVisible}/>}
{!isTerminalVisible && {!isTerminalVisible &&
<div> <div>
<Hero/> <Hero/>

View file

@ -12,7 +12,7 @@ export default function InfoCard(props: {style?: any, className?: string, info:
<div> <div>
<h4>{props.info.listTitle}</h4> <h4>{props.info.listTitle}</h4>
<div className={"row"} style={{color: "green", fontFamily: "monospace"}}> <div className={"row"} style={{color: "green", fontFamily: "monospace"}}>
{props.info.list.map(s => <p className={"col-6 "+(props.info.listClassName || "col-md-4")}>{s}</p>)} {props.info.list.map(s => <p className={"col-6 "+(props.info.listClassName || "col-md-4")} style={{fontSize: 16}}>{s}</p>)}
</div> </div>
</div> </div>
{props.info.link != null && <a href={props.info.link}>{props.info.linkTitle || "Relevant Link"}</a>} {props.info.link != null && <a href={props.info.link}>{props.info.linkTitle || "Relevant Link"}</a>}