driveby.cool/drivebycool-site
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: driveby.cool:5b0fa42f92b0059e183010b8fd7b6d6830e1b73d
Branches Tags
driveby.cool:master
driveby.cool:redesign
..
compare: driveby.cool:fdfdfb5db0b95872accf7e421453a6f7c72a0945
Branches Tags
driveby.cool:redesign
driveby.cool:master

No commits in common. "5b0fa42f92b0059e183010b8fd7b6d6830e1b73d" and "fdfdfb5db0b95872accf7e421453a6f7c72a0945" have entirely different histories.
5b0fa42f92 ... fdfdfb5db0

10 changed files with 35 additions and 232 deletions
Show Stats Expand all files Collapse all files

55
app/src/App.css
View File

@ -1,60 +1,15 @@
*{
/* margin: 0; */
/* padding: 0; */
}
html, body, #pagewrapper, #root{
height: 100vh;
margin: 0 0 0 0;
padding: 0 0 0 0;
overflow: auto;
}
.flex-column{
display: flex;
flex-direction: column;
}
.flex-row{
display: flex;
flex-direction: row;
}
#flex{
display: flex;
height:100%;
}
body { body {
font-family: 'Terminus', sans-serif; font-family: Arial;
background-color: #000; margin: 0;
} }
h1 { h1 {
/* margin: 10px; */ /* margin: 10px; */
} }
main{ main{
display: block; margin: 20px;
/* margin-left: 100px; */ background-color: #eee;
/* margin-right:100px; */ min-height: 300px;
background-color: #333;
color: lime;
box-sizing: border-box;
padding: 10px; padding: 10px;
width: 100%;
height:100%;
}
ul{
align-self: left;
}
a, a:visited, a:hover {
/* text-decoration: none; */
color: inherit;
}
a.selected, a.selected:visited{
color:red;
} }

40
app/src/Root.hx
View File

@ -2,14 +2,12 @@ import com.Foo;
import com.Foo2; import com.Foo2;
import components.Header; import components.Header;
import components.HomeContent; import components.HomeContent;
import components.sidebar.Sidebar;
import react.ReactMacro.jsx; import react.ReactMacro.jsx;
import react.ReactComponent; import react.ReactComponent;
import react.React.CreateElementType; import react.React.CreateElementType;
import react.router.ReactRouter; import react.router.ReactRouter;
import react.router.Route.RouteRenderProps; import react.router.Route.RouteRenderProps;
import react.router.Route; import react.router.Route;
import react.router.Redirect;
private typedef RootState = { private typedef RootState = {
@ -46,31 +44,25 @@ class Root extends react.ReactComponentOf<RootProps,RootState> {
override function render() { override function render() {
return jsx(' return jsx('
<div id="pagewrapper" class="flex-column"> <div>
<Header/> <Header/>
<!--Current path is ${props.location.pathname} and component is ${state.route}--> <!--Current path is ${props.location.pathname} and component is ${state.route}-->
<!--${renderContent()}--> <!--${renderContent()}-->
<div id="flex" class="flex-row"> <main>
<$Sidebar/> <$Route exact="true" path="/">
<main> <HomeContent/>
<$Route exact="true" path="/"> </$Route>
<$Redirect to="/home" /> <$Route path="/projects">
</$Route> <h1>Projects</h1>
<$Route path="/home"> </$Route>
<HomeContent/> <$Route path="/links">
</$Route> <h1>Links</h1>
<$Route path="/projects"> </$Route>
<h1>Projects</h1> <$Route path="/gameservers">
</$Route> <h1>Game Servers</h1>
<$Route path="/links"> <p></p>
<h1>Links</h1> </$Route>
</$Route> </main>
<$Route path="/gameservers">
<h1>Game Servers</h1>
<p></p>
</$Route>
</main>
</div>
</div> </div>
'); ');
} }

12
app/src/components/Header.css
View File

@ -1,18 +1,14 @@
header { header {
box-sizing: border-box; margin: 10px;
/* width:fit-content; */
width:100%;
/* margin: 10px; */
padding: 10px; padding: 10px;
background: #eee; background: #eee;
/* color: white; */
/* margin-left: auto;
margin-right: auto; */
} }
header nav a{ header nav a{
margin-right: 10px; margin-right: 10px;
} }
.selected{
color:red;
}
.logo{ .logo{
font-size: 3vw; font-size: 3vw;
width:fit-content;
} }

12
app/src/components/Header.hx
View File

@ -14,20 +14,20 @@ class Header extends ReactComponent{
return jsx(' return jsx('
<header> <header>
<div className="logo"> <div className="logo">
DRIVEBY! subsonics
</div> </div>
<nav> <nav>
<$NavLink to="/home" activeClassName="selected"> <$NavLink exact="true" to="/" activeClassName="selected">
>Home Home
</NavLink> </NavLink>
<$NavLink to="/links" activeClassName="selected"> <$NavLink to="/links" activeClassName="selected">
>Links Links
</NavLink> </NavLink>
<$NavLink to="/projects" activeClassName="selected"> <$NavLink to="/projects" activeClassName="selected">
>Projects Projects
</NavLink> </NavLink>
<$NavLink to="/gameservers" activeClassName="selected"> <$NavLink to="/gameservers" activeClassName="selected">
>Game Servers Game Servers
</NavLink> </NavLink>
</nav> </nav>
</header> </header>

29
app/src/components/HomeContent.hx
View File

@ -3,10 +3,6 @@ import react.ReactMacro.jsx;
import react.ReactComponent; import react.ReactComponent;
import js.Browser; import js.Browser;
import Webpack.*; import Webpack.*;
import react.router.ReactRouter;
import react.router.Route.RouteRenderProps;
import react.router.Route;
import components.blog.Overview;
class HomeContent extends ReactComponent { class HomeContent extends ReactComponent {
@ -18,28 +14,9 @@ class HomeContent extends ReactComponent {
override public function render() { override public function render() {
return jsx(' return jsx('
<div> <p onClick=${yeet}>
<$Route exact="true" path={["/home","/home/about"]}> kak
<div> </p>
<h2>Welcome to DRIVEBY!</h2>
<p>
DRIVEBY! is the home of my personal projects. This includes but is not limited to:<br/>
- Gamedev<br/>
- Software<br/>
- Music<br/>
- Art<br/>
DRIVEBY! is run and operated by Hion-V. I am comitted to bringing you best-in-class entertainment and software.<br/>
</p>
</div>
</$Route>
<$Route exact="true" path={["/home","/home/news"]}>
<div>
<h2>News</h2>
<$Overview/>
</div>
</$Route>
</div>
'); ');
} }
} }

36
app/src/components/blog/Overview.hx
View File

@ -1,36 +0,0 @@
package components.blog;
import react.ReactMacro.jsx;
import react.ReactComponent;
import js.Browser;
import Webpack.*;
import react.router.NavLink;
class Overview extends ReactComponent {
//static var STYLES = require('./HomeContent.css');
public function yeet(){
trace(state);
}
public static var items:Array<String> = [
'yeetus',
'deletus'
];
private static function printList(){
var result = [];
for (item in items){
result.push(jsx('<li>$item</li>'));
}
return result;
}
override public function render() {
var _print = printList();
return jsx('
<ul>
${_print}
</ul>
');
}
}

28
app/src/components/sidebar/SBHome.hx
View File

@ -1,28 +0,0 @@
package components.sidebar;
import react.ReactMacro.jsx;
import react.ReactComponent;
import js.Browser;
import Webpack.*;
import react.router.NavLink;
class SBHome extends ReactComponent {
//static var STYLES = require('./HomeContent.css');
public function yeet(){
trace(state);
}
override public function render() {
return jsx('
<ul>
<li>
<$NavLink to="/home/about" activeClassName="selected">About</$NavLink>
</li>
<li>
<$NavLink to="/home/news" activeClassName="selected">News</$NavLink>
</li>
</ul>
');
}
}

13
app/src/components/sidebar/Sidebar.css
View File

@ -1,13 +0,0 @@
#sidebar{
display: block;
padding: 10px;
//padding-left:10px;
width: 150px;
background-color: #888;
height:100%
}
#sidebar ul, #sidebar li{
padding: 0;
margin: 0;
list-style-type: none;
}

40
app/src/components/sidebar/Sidebar.hx
View File

@ -1,40 +0,0 @@
package components.sidebar;
import react.ReactMacro.jsx;
import react.ReactComponent;
import js.Browser;
import Webpack.*;
import components.sidebar.SBHome;
import react.router.ReactRouter;
import react.router.Route.RouteRenderProps;
import react.router.Route;
class Sidebar extends ReactComponent {
static var STYLES = require('./Sidebar.css');
public function yeet(){
trace(state);
}
override public function render() {
return jsx('
<div id="sidebar">
<$Route path={["/home"]} component={SBHome}>
</$Route>
<$Route path="/projects">
</$Route>
<$Route path="/links">
</$Route>
<$Route path="/gameservers">
Tes3MP<br/>
Minecraft<br/>
CS:GO<br/>
Source Arena<br/>
</$Route>
</div>
');
}
}

2
app/webpack.config.js
View File

@ -111,7 +111,7 @@ module.exports = {
// Like generating the HTML page with links the generated JS files // Like generating the HTML page with links the generated JS files
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
title: 'DRIVEBY!' title: 'Webpack + Haxe example'
}) })
// You may want to also: // You may want to also:
// - finer control of minify/uglify process using UglifyJSPlugin, // - finer control of minify/uglify process using UglifyJSPlugin,