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

various changes

Browse Source
This commit is contained in:
Andreas Schaafsma 2022-01-28 10:31:34 +00:00
parent fdfdfb5db0
commit 3dc674485c
8 changed files with 157 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
app/src/App.css
View File

@ -1,15 +1,61 @@
body {
font-family: Arial;
margin: 0;
*{
/* 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;
}
h1 {
/* margin: 10px; */
}
main{
margin: 20px;
background-color: #eee;
min-height: 300px;
display: block;
/* margin-left: 100px; */
/* margin-right:100px; */
background-color: #333;
color: lime;
box-sizing: border-box;
padding: 10px;
width: 100%;
height:100%;
}
#sidebar{
display: block;
padding: 10px;
//padding-left:10px;
width: 150px;
background-color: #888;
height:100%
}
ul{
align-self: left;
}

40
app/src/Root.hx
View File

@ -2,12 +2,14 @@ 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 = {
@ -44,25 +46,31 @@ class Root extends react.ReactComponentOf<RootProps,RootState> {
override function render() {
return jsx('
<div>
<div id="pagewrapper" class="flex-column">
<Header/>
<!--Current path is ${props.location.pathname} and component is ${state.route}-->
<!--${renderContent()}-->
<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 id="flex" class="flex-row">
<$Sidebar/>
<main>
<$Route exact="true" path="/">
<$Redirect to="/home" />
</$Route>
<$Route exact="true" 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>
</div>
');
}

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

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

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

@ -14,7 +14,7 @@ class Header extends ReactComponent{
return jsx('
<header>
<div className="logo">
subsonics
DRIVEBY!
</div>
<nav>
<$NavLink exact="true" to="/" activeClassName="selected">

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

@ -14,9 +14,14 @@ class HomeContent extends ReactComponent {
override public function render() {
return jsx('
<p onClick=${yeet}>
kak
</p>
<div>
<h2>Welcome to DRIVEBY!</h2>
<p>
DRIVEBY! is many things to many people. It is a community, a software distributor, a game studio and a place for my personal projects.<br/>
DRIVEBY! is run and operated by Hion-V. I am comitted to bringing you best-in-class entertainment and software.<br/>
</p>
</div>
');
}
}

23
app/src/components/sidebar/SBHome.hx Normal file
View File

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

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

@ -0,0 +1,40 @@
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('./HomeContent.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
new HtmlWebpackPlugin({
title: 'Webpack + Haxe example'
title: 'DRIVEBY!'
})
// You may want to also:
// - finer control of minify/uglify process using UglifyJSPlugin,