nathan
/
aNetwork-leaf
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Create homeController and template the home page

Browse Source
develop
Nathan Steel 9 months ago
parent a5e5fba084
commit e0a9e331f2
9 changed files with 310 additions and 237 deletions
Show Stats Download Patch File Download Diff File

45
app/controllers/Home/Controller.php
Unescape Escape View File

@ -0,0 +1,45 @@
<?php
namespace App\Controllers\Home;
/**
* This is a base controller for the home namespace
*/
class Controller extends \App\Controllers\Controller
{
public function index()
{
$servers = [
['type' => 'Minecraft'
, 'servers' => [
[
'name' => 'survival.mc.aney.co.uk'
,'description' => 'An open to all survival minecraft server.'
]
,[
'name' => 'creative.mc.aney.co.uk'
,'description' => 'Creative minecraft server.'
]
]
]
,['type' => 'Factorio'
, 'servers' => [
[
'name' => 'factorio.aney.co.uk'
,'description' => 'The factory must grow.'
]
]
]
,['type' => 'misc', 'servers' => []]
];
response()->render('index', [
'servers' => $servers
]);
}
}

15
app/routes/_app.php
Unescape Escape View File

@ -1,3 +1,16 @@
<!-- https://leafphp.dev/docs/routing/ -->
<?php
app()->view('/', 'index');
// No logic return a 'view'
// app()->view('/', 'index');
// Route named index
app()->get('/', 'Home\Controller@index');
// app()->get('/', ['name' => 'index', function () {
// // Render the 'index'.blade.php from /views/
// response()->render('index',
// ['servers' => ['Minecraft','Factorio','Misc.']]
// );
// }]);
// response()->redirect(['index']);

17
app/views/components/discord-banner.blade.php
Unescape Escape View File

@ -0,0 +1,17 @@
<section class="banner">
<div class="container">
<div class="row" style="align-items: center; justify-content: center; text-align: center;">
<div class="col col-2"><i class="iconoir iconoir-discord" style="font-size: 2.2rem;"></i></div>
<div class="col">
<p style="font-size: 1.6rem;">Why not <strong>say hello</strong> in the Discord?</p>
</div>
<div class="col col-2">
<a href="" class="button">Test</a>
</div>
</div>
</div>
</section>

33
app/views/components/faq.blade.php
Unescape Escape View File

@ -0,0 +1,33 @@
<section id="faq" class="container">
<div class="row">
<div class="col col-8">
<header class="row">
<div class="col col-12">
<h2>Frequently Asked Questions</h2>
</div>
</header>
<div class="row">
<div class="col col-12">
<details>
<summary>Can I contribute?</summary>
<p>aNetwork hosts and maintains a number of servers, and to keep these servers operational we need to pay the big bucks.</p>
<p>If you'd like to contribute, follow one of the links below.</p>
<div>
<a href="" class="button button--small">Ko-fi</a>
<a href="" class="button button--small">LiberaPay</a>
</div>
</details>
</div>
</div>
</div>
<div class="col col-4">
<img src="@assets('img/discord.png')" width="128" height="128">
</div>
</div>
</section>

56
app/views/components/footer.blade.php
Unescape Escape View File

@ -0,0 +1,56 @@
<footer class="footer">
<section class="container">
<div class="row">
<div class="col col-8">
<div class="row">
<div class="col col-4">
<a href="#">Section title</a>
<ul class="no-bullet-point">
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
</ul>
</div>
<div class="col col-4">
<a href="#">Section title</a>
<ul class="no-bullet-point">
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
</ul>
</div>
<div class="col col-4">
<a href="#">Section title</a>
<ul class="no-bullet-point">
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
</ul>
</div>
</div>
</div>
<div class="col col-4">
<p>C</p>
</div>
</div>
</section>
<section class="sub-footer">
<div class="container">
<div class="row">
<div class="col col-6">
</div>
<div class="col col-6 tar">
<p class="website-by">&copy; aNetwork | Website by <a href="https://aney.co.uk" target="_blank" rel="noopener">Aney</a></p>
</div>
</div>
</div>
</section>
</footer>

34
app/views/components/header.blade.php
Unescape Escape View File

@ -0,0 +1,34 @@
<header class="anetwork-head">
<nav class="container nav row row--align-center container--no-gap">
<div class="col col-2">
<a href="/" class="anetwork-title">aNetwork</a>
</div>
<div class="col col-fill">
<ul class="inline-list">
<li><a href="#about">About</a></li>
<li><a href="#servers">Servers</a>
@if(!empty($servers))
<ul>
@foreach($servers as $server) <!-- Loop servers to add to header -->
@if(!empty($server['servers'])) <!-- Only add if the server type has related servers -->
<li><a href="#servers" data-tabs-button data-tabs-group="servers" data-tabs-id="{{ strtolower($server['type']) }}">{{ $server['type'] }}</a></li>
@endif
@endforeach
</ul>
@endif
</li>
<li><a href="#faq">FAQs</a></li>
</ul>
</div>
<div class="col col-2 tar">
<ul class="inline-list">
<li><a href="/discord">Discord<i class="iconoir iconoir-discord" width="16" height="16" style="margin-left:12px; font-size:24px;"></i></a></li>
</ul>
</div>
</nav>
</header>

49
app/views/components/server-banner.blade.php
Unescape Escape View File

@ -0,0 +1,49 @@
<section id="servers" class="servers-bg servers-bg--mc">
<div class="container">
<header class="row">
<div class="col col-12">
<h2>Our Servers</h2>
@if(!empty($servers))
<ul class="inline-list">
@foreach($servers as $server)
<li><div class="button button--small @if($loop->index == 0) button--blue @endif" data-tabs-button data-tabs-group="servers" data-tabs-id="{{ strtolower($server['type']) }}">{{ $server['type'] }}</div></li>
@endforeach
</ul>
@endif
</div>
</header>
@if(empty($servers))
<div class="row">
<div class="col col-12">
<p>No servers, sorry</p>
</div>
</div>
@else
@foreach($servers as $server)
<!-- TODO: default data-tabs. Probably will just change the JS -->
<div class="row row--scroll row--cards servers-scroll" data-tabs-tab data-tabs-group="servers" data-tabs-id="{{ strtolower($server['type']) }}" @if($loop->index == 0) data-tabs-default @endif >
@if(empty($server['servers']))
<div class="col col-6">
<div class="card">
<h3>Uh oh!</h3>
<p>Currently there are no '{{ $server['type'] }}' servers</p>
</div>
</div>
@else
@foreach($server['servers'] as $serverItem)
<div class="col col-3p5">
<div class="card">
<h3>{{ $serverItem['name'] }}<i class="iconoir iconoir-copy" width="16" height="16" style="margin-left:12px"></i></h3>
<p>{{ $serverItem['description'] }}</p>
</div>
</div>
@endforeach
@endif
</div>
@endforeach
@endif
</div>
</section>

265
app/views/index.blade.php
Unescape Escape View File

@ -1,75 +1,30 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ _env('APP_NAME', 'aNetwork Gaming Community') }}</title>
<meta name="description" content="The home for a network of game servers, and a community of gamers.">
<link rel="shortcut icon" href="https://leafphp.dev/logo-circle.png" type="image/x-icon">
<meta name="theme-color" content="white">
<meta name="theme-color" content="black">
<!-- aSkelly -->
<link rel="stylesheet" href="@assets('aSkelly/css/reset.css')">
<link rel="stylesheet" href="@assets('aSkelly/css/grid.css')">
<link rel="stylesheet" href="@assets('aSkelly/css/mvp.css')">
<script src="@assets('aSkelly/js/clipboard.js')" defer></script>
<script src="@assets('aSkelly/js/tabs.js')" defer></script>
<!-- Per site -->
<link rel="stylesheet" href="@assets('css/main.css')">
<!-- External -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/iconoir-icons/iconoir@main/css/iconoir.css" />
</head>
<body>
<header class="anetwork-head">
@extends('layouts.basePage', [
'title' => _env('APP_NAME', 'aNetwork Gaming Community'),
'breadcrumbs' => [
[
'title' => 'Home',
'href' => '/',
]
]
])
@section('content')
<nav class="container nav row row--align-center container--no-gap">
<div class="col col-2">
<a href="/" class="anetwork-title">aNetwork</a>
</div>
<div class="col col-fill">
<ul class="inline-list">
<li><a href="#about">About</a></li>
<li><a href="#servers">Servers</a>
<ul>
<li><a href="#servers" data-tabs-button data-tabs-group="servers" data-tabs-id="minecraft">Minecraft</a></li>
<li><a href="#servers" data-tabs-button data-tabs-group="servers" data-tabs-id="factorio">Factorio</a></li>
</ul>
</li>
<li><a href="#faq">FAQs</a></li>
</ul>
</div>
<div class="col col-2 tar">
<ul class="inline-list">
<li><a href="/discord">Discord<i class="iconoir iconoir-discord" width="16" height="16" style="margin-left:12px; font-size:24px;"></i></a></li>
</ul>
</div>
</nav>
</header>
@include('components/header')
<main>
<section class="anetwork-hero">
<div class="container container--no-botgap">
<section class="row" style="display:none">
<section class="alerts" style="background: #33312E">
<div class="container" style="padding-bottom: 0">
<section class="row">
<section class="col col-12 no-padd">
<aside class="alert"><p>We're currently in development!</p></aside>
<aside class="alert alert--error"><p>We're currently in development!</p></aside>
<aside class="alert alert--warning"><p>We're currently in development!</p></aside>
<aside class="alert alert--success"><p>We're currently in development!</p></aside>
<aside class="alert"><p>aNetwork is currently undergoing development changes</p></aside>
</section>
</section>
</div>
</section>
<section class="anetwork-hero">
<div class="container container--no-botgap">
<section class="row">
<section class="col col-sm-12 col-8 col--align-center">
<h1 style="font-size: 42px;"><span class="anetwork-title">aNetwork</span> Gaming Community</h1>
@ -127,178 +82,16 @@
</section>
</div>
<section id="servers" class="servers-bg servers-bg--mc">
<div class="container">
<header class="row">
<div class="col col-12">
<h2>Our Servers</h2>
<ul class="inline-list">
<li><div class="button button--small button--blue" data-tabs-button data-tabs-group="servers" data-tabs-id="minecraft">Minecraft</div></li>
<li><div class="button button--small" data-tabs-button data-tabs-group="servers" data-tabs-id="factorio">Factorio</div></li>
<li><div class="button button--small" data-tabs-button data-tabs-group="servers" data-tabs-id="misc">Misc.</div></li>
</ul>
</div>
</header>
<div class="row row--scroll row--cards servers-scroll" data-tabs-tab data-tabs-group="servers" data-tabs-id="minecraft" data-tabs-default>
<div class="col col-3p5">
<div class="card">
<h3>survival.mc.aney.co.uk<i class="iconoir iconoir-copy" width="16" height="16" style="margin-left:12px"></i></h3>
<p>An open to all survival minecraft server.</p>
</div>
</div>
<div class="col col-3p5">
<div class="card">
<h3>survival.mc.aney.co.uk</h3>
<p>An open to all survival minecraft server.</p>
</div>
</div>
<div class="col col-6">
<div class="card">
<h3>Uh oh!</h3>
<p>Currently there are no 'Minecraft' servers</p>
</div>
</div>
</div>
<div class="row row--scroll row--cards servers-scroll" data-tabs-tab data-tabs-group="servers" data-tabs-id="factorio">
<div class="col col-6">
<div class="card">
<h3>Uh oh!</h3>
<p>Currently there are no 'Factorio' servers</p>
</div>
</div>
</div>
<div class="row row--scroll row--cards servers-scroll" data-tabs-tab data-tabs-group="servers" data-tabs-id="misc">
<div class="col col-6">
<div class="card">
<h3>Uh oh!</h3>
<p>Currently there are no 'Misc' servers</p>
</div>
</div>
</div>
</div>
</section>
<section class="banner">
<div class="container">
<div class="row" style="align-items: center; justify-content: center; text-align: center;">
<div class="col col-2"><i class="iconoir iconoir-discord" style="font-size: 2.2rem;"></i></div>
<div class="col">
<p style="font-size: 1.6rem;">Why not <strong>say hello</strong> in the Discord?</p>
</div>
<div class="col col-2">
<a href="" class="button">Test</a>
</div>
</div>
</div>
</section>
<section id="faq" class="container">
<div class="row">
<div class="col col-8">
<header class="row">
<div class="col col-12">
<h2>Frequently Asked Questions</h2>
</div>
</header>
<div class="row">
<div class="col col-12">
<details>
<summary>Can I contribute?</summary>
<p>aNetwork hosts and maintains a number of servers, and to keep these servers operational we need to pay the big bucks.</p>
<p>If you'd like to contribute, follow one of the links below.</p>
<div>
<a href="" class="button button--small">Ko-fi</a>
<a href="" class="button button--small">LiberaPay</a>
</div>
</details>
</div>
</div>
</div>
<div class="col col-4">
<img src="@assets('img/discord.png')" width="128" height="128">
</div>
</div>
</section>
</main>
<footer class="footer">
<section class="container">
<div class="row">
<div class="col col-8">
<div class="row">
<div class="col col-4">
<a href="#">Section title</a>
<ul class="no-bullet-point">
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
</ul>
</div>
<div class="col col-4">
<a href="#">Section title</a>
<ul class="no-bullet-point">
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
</ul>
</div>
<div class="col col-4">
<a href="#">Section title</a>
<ul class="no-bullet-point">
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
<li><a href="#">Sub</a></li>
</ul>
</div>
</div>
</div>
<div class="col col-4">
<p>C</p>
</div>
</div>
</section>
<section class="sub-footer">
<div class="container">
<div class="row">
<div class="col col-6">
</div>
<div class="col col-6 tar">
<p class="website-by">&copy; aNetwork | Website by <a href="https://aney.co.uk" target="_blank" rel="noopener">Aney</a></p>
</div>
</div>
</div>
</section>
</footer>
<!-- @@includeIf includes file if it exists. Useful for non-essential, but @@include for required -->
<!-- @@includeWhen to include on a truthy, @@includeFirst to include items in a coalesce -->
@includeIf('components/server-banner')
@includeIf('components/discord-banner')
</body>
@includeIf('components/faq')
</html>
</main>
@includeIf('components/footer')
@endsection

33
app/views/layouts/basePage.blade.php
Unescape Escape View File

@ -0,0 +1,33 @@
<!doctype html>
<html lang="en">
<!-- Turn the head into a partial, split into meta, and links ? -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ $title ?? 'aNetwork Gaming Community' }}</title>
<meta name="description" content="The home for a network of game servers, and a community of gamers.">
<link rel="shortcut icon" href="https://leafphp.dev/logo-circle.png" type="image/x-icon">
<meta name="theme-color" content="white">
<meta name="theme-color" content="black">
<!-- aSkelly -->
<link rel="stylesheet" href="@assets('aSkelly/css/main.css')">
<script src="@assets('aSkelly/js/clipboard.js')" defer></script>
<script src="@assets('aSkelly/js/tabs.js')" defer></script>
<!-- Per site -->
<link rel="stylesheet" href="@assets('css/main.css')">
<!-- External -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/iconoir-icons/iconoir@main/css/iconoir.css" />
</head>
<!-- Body split into header, footer, and _page_x for per-page -->
<!-- Then split those down into any repetetive areas -->
<body>
@yield('content')
</body>
</html>
Write Preview
Loading…
Cancel
Save