From 276f269c8e78b768e190002163889bbc1ebbd691 Mon Sep 17 00:00:00 2001 From: Adam <24621027+adoyle0@users.noreply.github.com> Date: Sun, 5 Feb 2023 02:54:50 -0500 Subject: [PATCH] yut --- doordesk/src/App.css | 114 +++++++++++---------------- doordesk/src/App.tsx | 16 ++-- doordesk/src/components/BlogPost.tsx | 3 - doordesk/src/components/Games.tsx | 20 +++++ readme.md | 4 +- 5 files changed, 81 insertions(+), 76 deletions(-) create mode 100644 doordesk/src/components/Games.tsx diff --git a/doordesk/src/App.css b/doordesk/src/App.css index 6684fbd..a170bb9 100644 --- a/doordesk/src/App.css +++ b/doordesk/src/App.css @@ -2,22 +2,20 @@ @import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@500&display=swap'); :root{ - --useless-gaps: 1em; + --useless-gaps: 1em; } - html, body { - background-color: black; - background-image: url("bg.png"); - background-attachment: fixed; - background-position: center; - background-size: cover; - background-repeat: no-repeat; - font-family: 'Roboto Mono', monospace; - font-size: 14; - line-height: 1.7em; - color: var(--foreground); + background-color: black; + background-image: url("bg.png"); + background-attachment: fixed; + background-position: center; + background-size: cover; + background-repeat: no-repeat; + font-family: 'Roboto Mono', monospace; + font-size: 14; + line-height: 1.7em; + color: var(--foreground); } - input, textarea { background-color: var(--background); color: var(--foreground); @@ -43,84 +41,68 @@ input[type=submit]:hover { background-color: var(--color10); } img{ - max-width: 100%; - height: auto; - } - + max-width: 100%; + height: auto; +} a { - color: var(--color4); + color: var(--color4); } - a:hover { - color: var(--color5); + color: var(--color5); } - h1 { - color: var(--color10); + color: var(--color10); } - h2 { - color: var(--color6); + color: var(--color6); } - h3 { - color: var(--color3); - margin-top: 2em; + color: var(--color3); + margin-top: 2em; } - p { - margin-top: 2em; + margin-top: 2em; } - - .content { - margin: 3em; + margin: 3em; } - .content-container, .header { - margin: auto; - margin-top: var(--useless-gaps); - background: rgb(0,0,0,.8); - border: solid 1px; - border-color: var(--color4); - max-width: 80em; - box-shadow: 5px 12px 20px #000; + margin: auto; + margin-top: var(--useless-gaps); + background: rgb(0,0,0,.8); + border: solid 1px; + border-color: var(--color4); + max-width: 80em; + box-shadow: 5px 12px 20px #000; } - .date{ - color: var(--color4) + color: var(--color4) } - .cards { - display: -webkit-flex; - display: -ms-flex; - display: flex; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - max-width: 100%; - overflow: hidden; - margin: auto; - max-width: 80%; + display: -webkit-flex; + display: -ms-flex; + display: flex; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + max-width: 100%; + overflow: hidden; + margin: auto; + max-width: 80%; } - .card { - border-style: solid; - border-width: 1px; - width: 20rem; - padding: 0 2em 2em 2em; - margin: 2em; + border-style: solid; + border-width: 1px; + width: 20rem; + padding: 0 2em 2em 2em; + margin: 2em; } - .align-right { - text-align: right; + text-align: right; } - .align-center { - text-align: center; + text-align: center; } - .title { - margin-top: -1em; + margin-top: -1em; } - diff --git a/doordesk/src/App.tsx b/doordesk/src/App.tsx index 06b403f..1dca97f 100644 --- a/doordesk/src/App.tsx +++ b/doordesk/src/App.tsx @@ -4,11 +4,12 @@ import Header from './components/Header.js' import Blog from './components/Blog.js' const FAKE_IT_TIL_YOU_MAKE_IT: string[] = [ - 'Blog', - 'Games', - 'Cartman', - 'Enigma', - 'Notebooks', + // component carousel + 'Home', // table of top 5 from(when enough content) *; then interleave latest from * + 'Blog', // blog posts + 'Projects', // project writeups + 'Games', // cards with thumbnail and summary + 'Contact', // email form? ] interface IAppProps { @@ -32,7 +33,10 @@ class App extends Component { } return (
-
+
{page}
) diff --git a/doordesk/src/components/BlogPost.tsx b/doordesk/src/components/BlogPost.tsx index ae09842..2550766 100644 --- a/doordesk/src/components/BlogPost.tsx +++ b/doordesk/src/components/BlogPost.tsx @@ -5,11 +5,9 @@ import rehypeRaw from 'rehype-raw' interface IBlogPostProps { postURL: string; } - interface IBlogPostState { postHTML: string; } - class BlogPost extends Component { constructor(props: IBlogPostProps) { super(props) @@ -24,7 +22,6 @@ class BlogPost extends Component { componentDidMount() { this.getPost(this.props.postURL) .then((text) => this.setState({ postHTML: text })) - } render() { return ( diff --git a/doordesk/src/components/Games.tsx b/doordesk/src/components/Games.tsx new file mode 100644 index 0000000..189d3f3 --- /dev/null +++ b/doordesk/src/components/Games.tsx @@ -0,0 +1,20 @@ +import { Component } from 'react' + +interface IGamesProps { +} + +interface IGamesState { +} + +class Games extends Component { + constructor(props: IGamesProps) { + super(props) + } + render() { + return ( + 1 + ) + } +} + +export default Games diff --git a/readme.md b/readme.md index 2e8b545..94d7b59 100644 --- a/readme.md +++ b/readme.md @@ -1 +1,3 @@ -sup +# doordesk + +```./start_frontend_ghetto```