cortex-command-community · lejshi3 · Oct 20, 2020 · Nov 18, 2020 · Nov 18, 2020 · Nov 18, 2020
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "cortex",
   "version": "0.1.0",
-  "private": true,
+  "private": false,
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^1.2.32",
     "@fortawesome/free-solid-svg-icons": "^5.15.1",

diff --git a/public/index.html b/public/index.html
@@ -28,7 +28,7 @@
     <title>Cortex Command Community Project</title>
   </head>
   <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <noscript>You need to enable JavaScript to view this page.</noscript>
     <div id="root"></div>
     <!--
       This HTML file is a template.

diff --git a/src/components/App/App.css b/src/components/App/App.css
@@ -1,6 +1,6 @@
 body {
-  color: #111;
-  background-color: #eee
+  color: #EEE;
+  background-color: #202020
 }
 
 p {
@@ -9,7 +9,7 @@ p {
 }
 
 h1, h2, h3 {
-  color: #284673;
+  color: #DDD;
   font-weight: normal;
   font-family: "Montserrat", sans-serif;
 }

diff --git a/src/components/App/App.js b/src/components/App/App.js
@@ -2,6 +2,7 @@ import React from 'react';
 import './App.css';
 import Home from '../Home/Home';
 import Downloads from '../Static/Downloads/Downloads';
+import Get_Involved from '../Static/Get_Involved/Get_Involved';
 import NotFound from '../Static/NotFound/NotFound';
 import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
 
@@ -15,6 +16,10 @@ function App() {
         <Route path="/downloads">
           <Downloads />
         </Route>
+        <Route path="/get-involved">
+          <Get_Involved />
+        </Route>
+          <Get_Involved />
         <Route>
           <NotFound />
         </Route>

diff --git a/src/components/Button/Button.css b/src/components/Button/Button.css
@@ -1,14 +1,15 @@
 .button-element {
     display: inline-block;
-    color: #333;
-    border: 1px solid #333;
-    padding: 6px 12px;
+    color: #DDD;
+    border: 1px solid #DDD;
+    padding: 6px 16px;
     border-radius: 4px;
     text-decoration: none;
+    margin-Right: 4px;
 }
 
 .button-content {
-    padding-right: 12px;
+    padding-right: 6px;
     font-family: "Montserrat", sans-serif;
 }
 

diff --git a/src/components/Card/Card.js b/src/components/Card/Card.js
@@ -5,15 +5,17 @@ function Card(props) {
     <div style={{ margin: '48px 0'}}>
       <div style={{
         marginTop: '12px',
-        border: '1px solid #333',
+        border: '1px solid #ddd',
         padding: '12px 18px',
         borderRadius: '6px',
       }}>
         <h2 style={{
           marginTop: '-28px',
-          padding: '0 4px',
-          width: 'fit-content',
-          background: '#eee',
+          paddingLeft: '8px',
+          paddingRight: '8px',
+          marginBottom: '-1px',
+          float: 'left',
+          background: '#202020',
         }}>{props.title}</h2>
         {props.children}
       </div>

diff --git a/src/components/Emoji/dunno.png b/src/components/Emoji/dunno.png
diff --git a/src/components/Emoji/dunno2.png b/src/components/Emoji/dunno2.png
diff --git a/src/components/Emoji/good.png b/src/components/Emoji/good.png
diff --git a/src/components/Header/Header.css b/src/components/Header/Header.css
@@ -17,7 +17,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    font-size: 10pt;
+    font-size: 12pt;
     color: #f9de8f;
     text-decoration: none;
     text-transform: uppercase;

diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
@@ -28,7 +28,7 @@ function Header() {
             }}>
                 <li><NavLink to="/"><span>Home</span></NavLink></li>
                 <li><NavLink to="/downloads"><span>Downloads</span></NavLink></li>
-                <li><NavLink to="/get-involved"><span>Get Involved</span></NavLink></li>
+                <li><NavLink to="/get_involved"><span>Get Involved</span></NavLink></li>
             </ul>
         </div>
     );

diff --git a/src/components/Home/CortexCardContents/CortexCardContents.js b/src/components/Home/CortexCardContents/CortexCardContents.js
@@ -13,15 +13,18 @@ function CortexCardContents(props) {
                 }}>
                     <h1>{props.title}</h1>
                     <p>{props.body}</p>
+
                 </div>
             </div>
             {/* This is an image placeholder **Imagine an Image** */}
-            <div style={{
+        <img style={{
                 border: '2px solid black',
                 backgroundColor: 'black',
                 minHeight: '196px',
                 width: '196px',
-            }} />
+        }}
+        src={props.image} alt={props.alt}
+        />    
         </div>
     );
 }

diff --git a/src/components/Home/Home.js b/src/components/Home/Home.js
@@ -7,6 +7,11 @@ import CortexCardContainer from './CortexCardContainer/CortexCardContainer';
 import CortexCardContents from './CortexCardContents/CortexCardContents';
 import MagicArrow from './MagicArrow/MagicArrow';
 
+/*image imports*/
+import NewImg from './img/stuff.GIF'
+import SniperImg from './img/sniper.GIF'
+import IntenseImg from './img/crabs.GIF'
+
 function Home() {
     return (
         <div style={{ backgroundColor: '#111'}}>
@@ -27,19 +32,25 @@ function Home() {
                         <CortexCardContents
                             title='Upgraded Engine'
                             body='The source code has been enhanced to improve performance.'
+                            image={NewImg}
+                            alt=''
                         />
                     </CortexCard>
                     <CortexCard right>
                         <CortexCardContents
                             right
                             title='New Content'
                             body='New weapons, characters, and scenes.'
+                            image={IntenseImg}
+                            alt=''
                         />
                     </CortexCard>
                     <CortexCard>
                         <CortexCardContents
                             title='Improved Strategic Gameplay'
                             body='The team has focused on accentuating the most satisfying gameplay elements.'
+                            image={SniperImg}
+                            alt=''
                         />
                     </CortexCard>
                 </CortexCardContainer>
@@ -50,4 +61,4 @@ function Home() {
     )
 }
 
-export default Home;
+export default Home;
diff --git a/src/components/Home/img/BuyMenu.png b/src/components/Home/img/BuyMenu.png
diff --git a/src/components/Home/img/Joystick.png b/src/components/Home/img/Joystick.png
diff --git a/src/components/Home/img/Team.png b/src/components/Home/img/Team.png
diff --git a/src/components/Home/img/crabs.GIF b/src/components/Home/img/crabs.GIF
diff --git a/src/components/Home/img/intense.png b/src/components/Home/img/intense.png
diff --git a/src/components/Home/img/mystery.png b/src/components/Home/img/mystery.png
diff --git a/src/components/Home/img/newthings.png b/src/components/Home/img/newthings.png
diff --git a/src/components/Home/img/sniper.GIF b/src/components/Home/img/sniper.GIF
diff --git a/src/components/Home/img/sniper.png b/src/components/Home/img/sniper.png
diff --git a/src/components/Home/img/strats.png b/src/components/Home/img/strats.png
diff --git a/src/components/Home/img/stuff.GIF b/src/components/Home/img/stuff.GIF
diff --git a/src/components/Static/Downloads/Downloads.js b/src/components/Static/Downloads/Downloads.js
@@ -3,29 +3,48 @@ import Template from '../../Template/Template';
 import Card from '../../Card/Card';
 import Button from '../../Button/Button';
 
+import EmojiGood from '../../Emoji/good.png';
+
 function Downloads() {
   return (
     <Template>
       <h1 style={{ marginTop: '48px' }}>Downloads</h1>
       <h2>Project Releases</h2>
       <Card title={'Cortex Command Community Project'}>
         <p style={{
-          marginBottom: '18px',
-        }}>This is where you can find the community's plans for Cortex Command's future. There'll be rebalancing, new weapons and units, and much more.</p>
-        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Project-Data/releases'>Releases</Button>
+          marginTop: '8px', marginBottom: '18px',
+        }}>This is where you can find the community's plans for Cortex Command's future. There'll be rebalancing, new weapons, units, and much <i>much</i> more.</p>
+
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Project-Data/'>View on Github</Button>
+
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Project-Data/releases/download/v0.1.0-pre3.0/Cortex.Command.zip'>Download Pre 3 (.exe)(latest)</Button>
+
+      </Card>
+      <h2>Mods</h2>
+      <Card title={'Get Mods'}>
+        <p style={{
+          marginTop: '8px', marginBottom: '18px',
+        }}>What is Cortex Command without <strong>MODS</strong>? Luckily, we've got you covered. There are 2 great ways to get mods and if neither of them suit your fancy, you can use the Legacy Mod Converter to convert mods from the Data Realms Fan Forums or the Steam Workshop!</p>
+
+        <Button link to='https://discord.gg/yuZvazK'>Community Discord <img width='14px' height='14px' marginBottom='-12px' src={EmojiGood}/></Button>
+
+        <Button link to='https://cccp.mod.io/'>Mod.io</Button>    
+
       </Card>
       <h2>Modding Tools</h2>
       <Card title={'Legacy Mod Converter'}>
         <p style={{
-          marginBottom: '18px',
+          marginTop: '8px', marginBottom: '18px',
         }}>This project automates most of the conversion work required to convert the legacy Cortex Command mods into Cortex Command Community Project compatible mods.</p>
-        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Legacy-Mod-Converter'>Get source</Button>
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Legacy-Mod-Converter'>View on Github</Button>
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Legacy-Mod-Converter/releases/download/pre3.0.2/_Mod.Converter.zip'>Download Source (.py)(latest)</Button>
       </Card>
-      <Card title={'Bender'}>
+      <Card title={'CCCP Bender'}>
         <p style={{
-          marginBottom: '18px',
+          marginTop: '8px', marginBottom: '18px',
         }}>The purpose of this tool is to make the life of modders easier by automagically generating bent limb sprites from limb parts.</p>
-        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Bender/releases'>Releases</Button>
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Bender'>View on Github</Button>
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Bender/releases/download/1.3.0/CCCP.Bender.1.3.0.zip'>Download Bender 1.3.0 (.exe)(latest)</Button>
       </Card>
       <div style={{ height: '24px' }} />
     </Template >

diff --git a/src/components/Static/Get_Involved/Get_Involved.js b/src/components/Static/Get_Involved/Get_Involved.js
@@ -0,0 +1,40 @@
+import React from 'react';
+import Template from '../../Template/Template';
+import Card from '../../Card/Card';
+import Button from '../../Button/Button';
+
+import EmojiGood from '../../Emoji/good.png';
+
+function Get_Involved() {
+  return (
+    <Template>
+      <h1 style={{ marginTop: '48px' }}>Get Involved</h1>
+      <h2>Want to help the Community Project? Here are some links to help you get started.</h2>
+
+      <Card title={'Join the Discord'}>
+        <p style={{
+          marginTop: '8px', marginBottom: '18px',
+        }}>So you want to take part in the project? A good start would be going to the discord where the project is discussed. You can find a link here. After that, all our releases will be available under the releases area and all of our bugs and changes and ideas are tracked in github issues. Feel free to play and suggest changes or point out any problems.</p>
+
+        <Button link to='https://discord.gg/yuZvazK'>Discord <img width='14px' height='14px' marginBottom='-12px' src={EmojiGood}/></Button>
+
+      </Card>
+
+      <Card title={'Contribute to the Github'}>
+        <p style={{
+          marginTop: '8px', marginBottom: '18px',
+        }}>If you've got experience with the game's ini data through modding it, are good at spriting or know Lua, maybe you can contribute some of your time directly to the project. We'll look at any pull requests that come in and are always happy to have more hands on deck. If you're an experienced programmer (particularly with C++), there's also tons of work to be done in our source repository.</p>
+        <p style={{
+          marginTop: '8px', marginBottom: '18px',
+        }}>If you're familiar with github you should be familiar with making issues. It's as simple as going to the issues tab and clicking a button. Once you do that, you'll see an easy to follow template to fill in. After you've done that, try to put in the appropriate category for the issue and it'll be handled from there.</p>
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Project-Source/'>Get Started</Button>
+
+        <Button link to='https://github.com/cortex-command-community/Cortex-Command-Community-Project-Source/issues'>View or Submit an Issue</Button>    
+
+      </Card>
+
+    </Template>
+  );
+}
+
+export default Get_Involved;
diff --git a/src/components/Static/NotFound/NotFound.js b/src/components/Static/NotFound/NotFound.js
@@ -1,12 +1,20 @@
 import React from 'react';
 import Template from '../../Template/Template';
 
+import EmojiDunno from '../../Emoji/dunno.png';
+
 function NotFound() {
     return (
         <Template>
+            <div style={{textAlign: 'center'}}>
             <h1 style={{ marginTop: '48px' }}>Page Not Found</h1>
             <p>Sorry, but the page you were trying to view does not exist.</p>
+            <br />
+            <br />
+            <a href='https://www.youtube.com/watch?v=t0s9dRNjhfg?autoplay=1'><img style={{postion: 'absolute', width: '25%'}} src={EmojiDunno}/></a>
+            </div>
         </Template>
+
     );
 }
 

diff --git a/src/components/Template/Template.js b/src/components/Template/Template.js
@@ -12,8 +12,10 @@ function Template(props) {
       <Header />
       <div style={{
         margin: 'auto',
+        marginBottom: '0px',
         maxWidth: '800px',
         width: '100%',
+        height: '100%',
         flex: '1',
       }}>
         <div style={{ padding: '0 8px', }}>