Browse Source

add home page

pull/3/head
Aaron Parecki 9 years ago
parent
commit
5fd6b7b102
5 changed files with 326 additions and 0 deletions
  1. +14
    -0
      controllers/Controller.php
  2. +6
    -0
      lib/helpers.php
  3. BIN
      public/assets/telegraph-header.jpg
  4. +17
    -0
      public/index.php
  5. +289
    -0
      views/index.php

+ 14
- 0
controllers/Controller.php View File

@ -0,0 +1,14 @@
<?php
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
class Controller {
public function index(Request $request, Response $response) {
$response->setContent(view('index', [
'title' => 'Telegraph'
]));
return $response;
}
}

+ 6
- 0
lib/helpers.php View File

@ -0,0 +1,6 @@
<?php
function view($template, $data=[]) {
global $templates;
return $templates->render($template, $data);
}

BIN
public/assets/telegraph-header.jpg View File

Before After
Width: 1600  |  Height: 1067  |  Size: 154 KiB

+ 17
- 0
public/index.php View File

@ -0,0 +1,17 @@
<?php
chdir('..');
include('vendor/autoload.php');
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
$router = new League\Route\RouteCollection;
$templates = new League\Plates\Engine(dirname(__FILE__).'/../views');
$router->addRoute('GET', '/', 'Controller::index');
$dispatcher = $router->getDispatcher();
$request = Request::createFromGlobals();
$response = $dispatcher->dispatch($request->getMethod(), $request->getPathInfo());
$response->send();

+ 289
- 0
views/index.php View File

@ -0,0 +1,289 @@
<!DOCTYPE html>
<html>
<head>
<!-- Standard Meta -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- Site Properities -->
<title>Telegraph</title>
<link rel="stylesheet" type="text/css" href="/semantic-ui/semantic.min.css">
<style type="text/css">
.hidden.menu {
display: none;
}
.masthead.segment {
min-height: 700px;
padding: 1em 0em;
}
.masthead .logo.item img {
margin-right: 1em;
}
.masthead .ui.menu .ui.button {
margin-left: 0.5em;
}
.masthead h1.ui.header {
margin-top: 3em;
margin-bottom: 0em;
font-size: 4em;
font-weight: normal;
}
.masthead h2 {
font-size: 1.7em;
font-weight: normal;
}
.ui.vertical.stripe {
padding: 8em 0em;
}
.ui.vertical.stripe h3 {
font-size: 2em;
}
.ui.vertical.stripe .button + h3,
.ui.vertical.stripe p + h3 {
margin-top: 3em;
}
.ui.vertical.stripe .floated.image {
clear: both;
}
.ui.vertical.stripe p {
font-size: 1.33em;
}
.ui.vertical.stripe .horizontal.divider {
margin: 3em 0em;
}
.quote.stripe.segment {
padding: 0em;
}
.quote.stripe.segment .grid .column {
padding-top: 5em;
padding-bottom: 5em;
}
.footer.segment {
padding: 5em 0em;
}
.secondary.pointing.menu .toc.item {
display: none;
}
@media only screen and (max-width: 700px) {
.ui.fixed.menu {
display: none !important;
}
.secondary.pointing.menu .item,
.secondary.pointing.menu .menu {
display: none;
}
.secondary.pointing.menu .toc.item {
display: block;
}
.masthead.segment {
min-height: 350px;
}
.masthead h1.ui.header {
font-size: 2em;
margin-top: 1.5em;
}
.masthead h2 {
margin-top: 0.5em;
font-size: 1.5em;
}
}
.ui.inverted.segment.masthead {
background-image: url(/assets/telegraph-header.jpg);
background-position: center;
}
.ui.secondary.inverted.pointing.menu, .ui.secondary.pointing.menu {
border: 0;
}
</style>
<script src="/assets/jquery.js"></script>
<script src="/semantic-ui/semantic.min.js"></script>
<script>
$(document)
.ready(function() {
// fix menu when passed
$('.masthead')
.visibility({
once: false,
onBottomPassed: function() {
$('.fixed.menu').transition('fade in');
},
onBottomPassedReverse: function() {
$('.fixed.menu').transition('fade out');
}
})
;
// create sidebar and attach to menu open
$('.ui.sidebar')
.sidebar('attach events', '.toc.item')
;
})
;
</script>
</head>
<body>
<?php
$menu = [
'/' => 'Home',
'/dashboard' => 'Dashboard',
'/api' => 'API',
];
?>
<!-- Following Menu -->
<div class="ui large top fixed hidden menu">
<div class="ui container">
<?php foreach($menu as $href=>$name): ?>
<a class="item" href="<?= $href ?>"><?= $name ?></a>
<?php endforeach; ?>
<div class="right menu">
<div class="item">
<a class="ui button">Log in</a>
</div>
</div>
</div>
</div>
<!-- Sidebar Menu -->
<div class="ui vertical inverted sidebar menu">
<?php foreach($menu as $href=>$name): ?>
<a class="item" href="<?= $href ?>"><?= $name ?></a>
<?php endforeach; ?>
<a class="item">Login</a>
</div>
<!-- Page Contents -->
<div class="pusher">
<div class="ui inverted vertical masthead center aligned segment">
<div class="ui container">
<div class="ui large secondary inverted pointing menu">
<a class="toc item">
<i class="sidebar icon"></i>
</a>
<?php foreach($menu as $href=>$name): ?>
<a class="item" href="<?= $href ?>"><?= $name ?></a>
<?php endforeach; ?>
<div class="right item">
<a class="ui inverted button" href="/login">Log in</a>
</div>
</div>
</div>
<div class="ui text container">
<h1 class="ui inverted header">
Telegraph
</h1>
<h2>Easily send Webmentions from your website</h2>
<div class="ui huge primary button">Get Started <i class="right arrow icon"></i></div>
</div>
</div>
<div class="ui vertical stripe segment">
<div class="ui middle aligned stackable grid container">
<div class="row">
<div class="eight wide column">
<h3 class="ui header">We send webmentions for you</h3>
<p>Let Telegraph send webmentions for you. With a simple API, Telegraph will handle sending webmentions to other websites. Let Telegraph handle webmention discovery, and retrying on temporary failures. Telegraph will notify your site when a webmention was successfully sent.</p>
<h3 class="ui header">Send webmentions automatically</h3>
<p>You can even let Telegraph subscribe to your feed, and it will send webmentions whenever you publish a new post.</p>
</div>
<div class="six wide right floated column">
<img src="assets/images/wireframe/white-image.png" class="ui large bordered rounded image">
</div>
</div>
<div class="row">
<div class="center aligned column">
<a class="ui huge button" href="/api">API Docs</a>
</div>
</div>
</div>
</div>
<!--
<div class="ui vertical stripe quote segment">
<div class="ui equal width stackable internally celled grid">
<div class="center aligned row">
<div class="column">
<h3>"Nice thing"</h3>
<p>A quote by a nice person</p>
</div>
<div class="column">
<h3>"This makes everything so much easier."</h3>
<p>
<img src="/assets/ben.jpg" class="ui avatar image"> <b>Ben</b> Chief Ben Officer
</p>
</div>
</div>
</div>
</div>
-->
<div class="ui vertical stripe segment">
<div class="ui text container">
<h3 class="ui header">Send Webmentions with a Simple API</h3>
<p>Instead of doing the hard work of sending webmentions yourself, we have a simple API that will handle endpoint discovery, gracefully handle failures and retries, and will let you know whether a webmention was successfully sent. All you have to do is tell us where to send the webmention and we'll take it from there.</p>
<a class="ui large button" href="/api">Read More</a>
<!--
<h4 class="ui horizontal header divider">
Case Studies
</h4>
<h3 class="ui header">Did We Tell You About Our Bananas?</h3>
<p>Yes I know you probably disregarded the earlier boasts as non-sequitor filler content, but its really true. It took years of gene splicing and combinatory DNA research, but our bananas can really dance.</p>
<a class="ui large button">I'm Still Quite Interested</a>
-->
</div>
</div>
<div class="ui inverted vertical footer segment">
<div class="ui container">
<div class="ui stackable inverted divided equal height stackable grid">
<div class="three wide column">
<h4 class="ui inverted header">Telegraph</h4>
<div class="ui inverted link list">
<a href="https://github.com/aaronpk/Telegraph" class="item">Open Source</a>
<a href="https://github.com/aaronpk/Telegraph/issues" class="item">Issues</a>
<a href="http://webmention.net" class="item">About Webmention</a>
</div>
</div>
<div class="three wide column">
<h4 class="ui inverted header">The p3k Suite</h4>
<div class="ui inverted link list">
<a href="https://monocle.p3k.io" class="item">Monocle</a>
<a href="https://quill.p3k.io" class="item">Quill</a>
<a href="https://teacup.p3k.io" class="item">Teacup</a>
<a href="https://switchboard.p3k.io" class="item">Switchboard</a>
<a href="https://atlas.p3k.io" class="item">Atlas</a>
<a href="https://compass.p3k.io" class="item">Compass</a>
</div>
</div>
<div class="seven wide column">
<h4 class="ui inverted header">IndieWebCamp</h4>
<p>You might also be interested in...</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

Loading…
Cancel
Save