Compare commits
No commits in common. "5b0fa42f92b0059e183010b8fd7b6d6830e1b73d" and "fdfdfb5db0b95872accf7e421453a6f7c72a0945" have entirely different histories.
5b0fa42f92
...
fdfdfb5db0
@ -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 {
|
||||
font-family: 'Terminus', sans-serif;
|
||||
background-color: #000;
|
||||
font-family: Arial;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
h1 {
|
||||
/* margin: 10px; */
|
||||
}
|
||||
|
||||
main{
|
||||
display: block;
|
||||
/* margin-left: 100px; */
|
||||
/* margin-right:100px; */
|
||||
background-color: #333;
|
||||
color: lime;
|
||||
box-sizing: border-box;
|
||||
margin: 20px;
|
||||
background-color: #eee;
|
||||
min-height: 300px;
|
||||
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;
|
||||
}
|
||||
@ -2,14 +2,12 @@ import com.Foo;
|
||||
import com.Foo2;
|
||||
import components.Header;
|
||||
import components.HomeContent;
|
||||
import components.sidebar.Sidebar;
|
||||
import react.ReactMacro.jsx;
|
||||
import react.ReactComponent;
|
||||
import react.React.CreateElementType;
|
||||
import react.router.ReactRouter;
|
||||
import react.router.Route.RouteRenderProps;
|
||||
import react.router.Route;
|
||||
import react.router.Redirect;
|
||||
|
||||
|
||||
private typedef RootState = {
|
||||
@ -46,31 +44,25 @@ class Root extends react.ReactComponentOf<RootProps,RootState> {
|
||||
|
||||
override function render() {
|
||||
return jsx('
|
||||
<div id="pagewrapper" class="flex-column">
|
||||
<div>
|
||||
<Header/>
|
||||
<!--Current path is ${props.location.pathname} and component is ${state.route}-->
|
||||
<!--${renderContent()}-->
|
||||
<div id="flex" class="flex-row">
|
||||
<$Sidebar/>
|
||||
<main>
|
||||
<$Route exact="true" path="/">
|
||||
<$Redirect to="/home" />
|
||||
</$Route>
|
||||
<$Route path="/home">
|
||||
<HomeContent/>
|
||||
</$Route>
|
||||
<$Route path="/projects">
|
||||
<h1>Projects</h1>
|
||||
</$Route>
|
||||
<$Route path="/links">
|
||||
<h1>Links</h1>
|
||||
</$Route>
|
||||
<$Route path="/gameservers">
|
||||
<h1>Game Servers</h1>
|
||||
<p></p>
|
||||
</$Route>
|
||||
</main>
|
||||
</div>
|
||||
<main>
|
||||
<$Route exact="true" path="/">
|
||||
<HomeContent/>
|
||||
</$Route>
|
||||
<$Route path="/projects">
|
||||
<h1>Projects</h1>
|
||||
</$Route>
|
||||
<$Route path="/links">
|
||||
<h1>Links</h1>
|
||||
</$Route>
|
||||
<$Route path="/gameservers">
|
||||
<h1>Game Servers</h1>
|
||||
<p></p>
|
||||
</$Route>
|
||||
</main>
|
||||
</div>
|
||||
');
|
||||
}
|
||||
|
||||
@ -1,18 +1,14 @@
|
||||
header {
|
||||
box-sizing: border-box;
|
||||
/* width:fit-content; */
|
||||
width:100%;
|
||||
/* margin: 10px; */
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
background: #eee;
|
||||
/* color: white; */
|
||||
/* margin-left: auto;
|
||||
margin-right: auto; */
|
||||
}
|
||||
header nav a{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.selected{
|
||||
color:red;
|
||||
}
|
||||
.logo{
|
||||
font-size: 3vw;
|
||||
width:fit-content;
|
||||
}
|
||||
@ -14,20 +14,20 @@ class Header extends ReactComponent{
|
||||
return jsx('
|
||||
<header>
|
||||
<div className="logo">
|
||||
DRIVEBY!
|
||||
subsonics
|
||||
</div>
|
||||
<nav>
|
||||
<$NavLink to="/home" activeClassName="selected">
|
||||
>Home
|
||||
<$NavLink exact="true" to="/" activeClassName="selected">
|
||||
Home
|
||||
</NavLink>
|
||||
<$NavLink to="/links" activeClassName="selected">
|
||||
>Links
|
||||
Links
|
||||
</NavLink>
|
||||
<$NavLink to="/projects" activeClassName="selected">
|
||||
>Projects
|
||||
Projects
|
||||
</NavLink>
|
||||
<$NavLink to="/gameservers" activeClassName="selected">
|
||||
>Game Servers
|
||||
Game Servers
|
||||
</NavLink>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
@ -3,10 +3,6 @@ import react.ReactMacro.jsx;
|
||||
import react.ReactComponent;
|
||||
import js.Browser;
|
||||
import Webpack.*;
|
||||
import react.router.ReactRouter;
|
||||
import react.router.Route.RouteRenderProps;
|
||||
import react.router.Route;
|
||||
import components.blog.Overview;
|
||||
|
||||
class HomeContent extends ReactComponent {
|
||||
|
||||
@ -18,28 +14,9 @@ class HomeContent extends ReactComponent {
|
||||
|
||||
override public function render() {
|
||||
return jsx('
|
||||
<div>
|
||||
<$Route exact="true" path={["/home","/home/about"]}>
|
||||
<div>
|
||||
<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>
|
||||
<p onClick=${yeet}>
|
||||
kak
|
||||
</p>
|
||||
');
|
||||
}
|
||||
}
|
||||
@ -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>
|
||||
');
|
||||
}
|
||||
}
|
||||
@ -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>
|
||||
');
|
||||
}
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
@ -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>
|
||||
');
|
||||
}
|
||||
}
|
||||
@ -111,7 +111,7 @@ module.exports = {
|
||||
|
||||
// Like generating the HTML page with links the generated JS files
|
||||
new HtmlWebpackPlugin({
|
||||
title: 'DRIVEBY!'
|
||||
title: 'Webpack + Haxe example'
|
||||
})
|
||||
// You may want to also:
|
||||
// - finer control of minify/uglify process using UglifyJSPlugin,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user