diff --git a/app/src/App.css b/app/src/App.css index 6c95381..55ff397 100644 --- a/app/src/App.css +++ b/app/src/App.css @@ -47,15 +47,14 @@ main{ width: 100%; height:100%; } - -#sidebar{ - display: block; - padding: 10px; - //padding-left:10px; - width: 150px; - background-color: #888; - height:100% -} ul{ align-self: left; +} + +a, a:visited, a:hover { + /* text-decoration: none; */ + color: inherit; +} +a.selected, a.selected:visited{ + color:red; } \ No newline at end of file diff --git a/app/src/Root.hx b/app/src/Root.hx index ec165c7..620c3c2 100644 --- a/app/src/Root.hx +++ b/app/src/Root.hx @@ -56,7 +56,7 @@ class Root extends react.ReactComponentOf { <$Route exact="true" path="/"> <$Redirect to="/home" /> - <$Route exact="true" path="/home"> + <$Route path="/home"> <$Route path="/projects"> diff --git a/app/src/components/Header.css b/app/src/components/Header.css index 60ac5d8..f9e2b48 100644 --- a/app/src/components/Header.css +++ b/app/src/components/Header.css @@ -12,9 +12,6 @@ header { header nav a{ margin-right: 10px; } -.selected{ - color:red; -} .logo{ font-size: 3vw; width:fit-content; diff --git a/app/src/components/Header.hx b/app/src/components/Header.hx index f27910c..33203ba 100644 --- a/app/src/components/Header.hx +++ b/app/src/components/Header.hx @@ -17,17 +17,17 @@ class Header extends ReactComponent{ DRIVEBY! diff --git a/app/src/components/HomeContent.hx b/app/src/components/HomeContent.hx index 5d6e1f0..2eed75f 100644 --- a/app/src/components/HomeContent.hx +++ b/app/src/components/HomeContent.hx @@ -3,6 +3,10 @@ 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 { @@ -14,13 +18,27 @@ class HomeContent extends ReactComponent { override public function render() { return jsx(' -
-

Welcome to DRIVEBY!

-

- DRIVEBY! is many things to many people. It is a community, a software distributor, a game studio and a place for my personal projects.
- DRIVEBY! is run and operated by Hion-V. I am comitted to bringing you best-in-class entertainment and software.
+

+ <$Route exact="true" path={["/home","/home/about"]}> +
+

Welcome to DRIVEBY!

+

+ DRIVEBY! is the home of my personal projects. This includes but is not limited to:
+ - Gamedev
+ - Software
+ - Music
+ - Art
+ DRIVEBY! is run and operated by Hion-V. I am comitted to bringing you best-in-class entertainment and software.
-

+

+
+ + <$Route exact="true" path={["/home","/home/news"]}> +
+

News

+ <$Overview/> +
+
'); } diff --git a/app/src/components/blog/Overview.hx b/app/src/components/blog/Overview.hx new file mode 100644 index 0000000..feee9e4 --- /dev/null +++ b/app/src/components/blog/Overview.hx @@ -0,0 +1,36 @@ +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 = [ + 'yeetus', + 'deletus' + ]; + private static function printList(){ + var result = []; + for (item in items){ + result.push(jsx('
  • $item
  • ')); + } + return result; + } + + override public function render() { + var _print = printList(); + return jsx(' +
      + ${_print} +
    + '); + } +} \ No newline at end of file diff --git a/app/src/components/sidebar/SBHome.hx b/app/src/components/sidebar/SBHome.hx index bbcd8df..8c71b7e 100644 --- a/app/src/components/sidebar/SBHome.hx +++ b/app/src/components/sidebar/SBHome.hx @@ -3,6 +3,7 @@ import react.ReactMacro.jsx; import react.ReactComponent; import js.Browser; import Webpack.*; +import react.router.NavLink; class SBHome extends ReactComponent { @@ -15,8 +16,12 @@ class SBHome extends ReactComponent { override public function render() { return jsx('
      -
    • About
    • -
    • News
    • +
    • + <$NavLink to="/home/about" activeClassName="selected">About +
    • +
    • + <$NavLink to="/home/news" activeClassName="selected">News +
    '); } diff --git a/app/src/components/sidebar/Sidebar.css b/app/src/components/sidebar/Sidebar.css new file mode 100644 index 0000000..d731d88 --- /dev/null +++ b/app/src/components/sidebar/Sidebar.css @@ -0,0 +1,13 @@ +#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; +} \ No newline at end of file diff --git a/app/src/components/sidebar/Sidebar.hx b/app/src/components/sidebar/Sidebar.hx index b367eab..de84c77 100644 --- a/app/src/components/sidebar/Sidebar.hx +++ b/app/src/components/sidebar/Sidebar.hx @@ -10,7 +10,7 @@ import react.router.Route; class Sidebar extends ReactComponent { - //static var STYLES = require('./HomeContent.css'); + static var STYLES = require('./Sidebar.css'); public function yeet(){ trace(state);