rob/website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Redo design from scratch with something significantly simpler and lower maintainence.

Browse source
This commit is contained in:
Robert Marshall 2020-01-03 16:30:40 +00:00
parent a84bf8aab3
commit 3d00f28657
31 changed files with 228 additions and 1857 deletions
Download patch file Download diff file Expand all files Collapse all files

28
Website/Views/Account/Login.cshtml
View file

@ -13,8 +13,28 @@
}
<form method="post" action="login">
<input type="hidden" name="returnUrl" value="@Model.ReturnUrl"/>
<label for="username">Username: </label><input name="username" id="username"/>
<label for="password">Password: </label><input name="password" type="password" id="password"/>
<button type="submit">Login</button>
<input type="hidden" name="returnUrl" value="@Model.ReturnUrl" />
<table>
<tr class="form-row">
<td>
<label for="username">Username: </label>
</td>
<td>
<input name="username" id="username" />
</td>
</tr>
<tr class="form-row">
<td>
<label for="password">Password: </label>
</td>
<td>
<input name="password" type="password" id="password" />
</td>
</tr>
<tr class="form-row">
<td colspan="2">
<button type="submit">Login</button>
</td>
</tr>
</table>
</form>

7
Website/Views/Blog/Edit.cshtml
View file

@ -4,9 +4,12 @@
ViewBag.Title = Model != null ? "Edit Post" : "New Post";
}
<form method="post" action="/blog/save">
<form method="post" action="/blog/save" class="edit-form">
<input type="hidden" name="id" value="@Model?.Id"/>
<label for="postTitle">Title: </label><input name="title" id="postTitle" value="@Model?.Title"/>
<div class="edit-form__title form-row">
<label for="postTitle" class="edit-form__title__label">Title: </label>
<input name="title" id="postTitle" value="@Model?.Title" class="edit-form__title__input"/>
</div>
<textarea id="postContent" name="content">@Model?.Content</textarea>
<button type="submit">Save</button>
</form>

26
Website/Views/Blog/Page.cshtml
View file

@ -4,21 +4,6 @@
ViewData["Title"] = "Blog";
}
@section ButtonsLeft {
@if (Model.Page > 1) {
<button onclick="window.location.href='/blog/page/@(Model.Page-1)'" title="Previous Page">
<img src="/images/previous.svg" alt="Previous" />
</button>
}
}
@section ButtonsRight {
@if (Model.Page < Model.MaxPages) {
<button onclick="window.location.href='/blog/page/@(Model.Page+1)'" title="Next Page">
<img src="/images/next.svg" alt="Next" />
</button>
}
}
@foreach (var post in Model.Posts) {
<article>
<h2><a href="/blog/view/@post.Url">@post.Title</a></h2>
@ -26,4 +11,13 @@
<small>Posted on @post.Timestamp</small>
<p><a href="/blog/view/@post.Url">Read more...</a></p>
</article>
}
}
<div class="blog-navigation">
@if (Model.Page > 1) {
<a href="/blog/page/@(Model.Page - 1)" class="round-button blog-navigation__previous"><img src="/images/previous.svg" alt="Previous"/></a>
}
@if (Model.Page < Model.MaxPages) {
<a href="/blog/page/@(Model.Page + 1)" class="round-button blog-navigation__next"><img src="/images/next.svg" alt="Next"/></a>
}
</div>

170
Website/Views/Shared/_Layout.cshtml
View file

@ -1,125 +1,47 @@
@{
var angularSource = "ajax.googleapis.com/ajax/libs/angularjs";
var angularVersion = "1.5.0";
var jsFiles = new[]{
"javascript.js",
"controllers/main.js",
"directives/equalHeightWidth.js",
"directives/scopeInit.js",
};
}
<!DOCTYPE html>
<html ng-app="robware">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] | Robware</title>
<link href="/css/style.css" rel="stylesheet" defer />
<link href="/css/style-med.css?" media="(max-width:1023px)" rel="stylesheet" defer />
<link href="/css/style-small.css" media="(max-width:680px)" rel="stylesheet" defer />
<style type="text/css">
@RenderSection("CSS", required:false);
</style>
<style media="(max-width:1023px)">
@RenderSection("CSSMed", required:false);
</style>
<style media="(max-width:680px)">
@RenderSection("CSSSmall", required:false);
</style>
<environment include="Development">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.js" defer></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.js" defer></script>
<script type="text/javascript" src="//@angularSource/@angularVersion/angular.js" defer></script>
<script type="text/javascript" src="//@angularSource/@angularVersion/angular-animate.js" defer></script>
</environment>
<environment exclude="Development">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" defer></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js" defer></script>
<script type="text/javascript" src="//@angularSource/@angularVersion/angular.min.js" defer></script>
<script type="text/javascript" src="//@angularSource/@angularVersion/angular-animate.min.js" defer></script>
</environment>
@foreach (var file in jsFiles){
<script type="text/javascript" src="~/js/@file" defer asp-append-version="true"></script>
}
<script type="text/javascript">
@RenderSection("JavaScript", required: false)
</script>
</head>
<body ng-controller="main" ng-class="{scrollLock: (menuVisible && window.innerWidth < 1024) || spinnerVisible}">
<div id="menu" ng-show="shouldShowMenu()">
<div class="header">
<img src="/images/logo.png" /><h1>Robware</h1>
</div>
<div id="nav-container">
<nav>
<dl>
<dt class="active">
<a href="/home"><img src="/images/home.svg">Home</a>
</dt>
<dt>
<a href="/blog"><img src="/images/blog.svg">Blog</a><span class="go" style="display: none;">&raquo;</span><span class="expand" style="display: block;">+</span>
</dt>
<div class="sub-pages">
<dd>
<a href="/blog/view/using-a-json-string-as-a-configuration-source-for-a-.net-core-project">Using a JSON string as a configuration source f...</a>
</dd>
<dd>
<a href="/blog/view/the-home-automation-saga">The Home Automation Saga</a>
</dd>
<dd>
<a href="/blog/view/a-basic-timer-for-the-arduino">A basic timer for the Arduino</a>
</dd>
<dd>
<a href="/blog/view/diy-home-automation-update">DIY Home Automation: Update</a>
</dd>
<dd>
<a href="/blog/view/the-start-of-diy-home-automation-replacing-the-thermostat-part-2">The start of DIY home automation: replacing the...</a>
</dd>
<dd>
<a href="/blog/"><i>View all</i></a>
</dd>
</div>
<dt>
<a href="//git.robware.uk/rob"><img src="/images/projects.svg">Projects</a>
</dt>
<dt>
<a href="/gallery"><img src="/images/photo.svg">Gallery</a>
</dt>
</dl>
</nav>
</div>
</div>
<div id="main">
<div class="header">
<img src="/images/menu.svg" id="menu-button" ng-click="menuVisible=!menuVisible" />@{ // using code blocks to remove HTML space but to keep source tidy
}<h2>@{ // Shitty, I know, but eh...
}<span>@ViewData["Title"]</span>@{
}</h2>
</div>
<div class="errors" ng-if="errors.length>0">
The following errors were encountered:
<ul>
<li ng-repeat="error in errors">{{error}}</li>
</ul>
Please rectify them and try again.
</div>
<div id="content">
<div id="body">
@RenderBody()
</div>
<div id="footer">@RenderSection("Footer", required: false)</div>
</div>
<div id="buttons-left">@RenderSection("ButtonsLeft", required: false)</div>
<div id="buttons-right">@RenderSection("ButtonsRight", required: false)</div>
</div>
<div class="backdrop" ng-show="shouldShowMenu()" ng-click="menuVisible=false"></div>
<div id="spinner" class="backdrop" ng-show="spinnerVisible">
<img src="/images/spinner.svg" />
</div>
@RenderSection("Scripts", required: false)
</body>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] | Robware</title>
<link href="/css/style.css" rel="stylesheet" defer/>
<style type="text/css">
@RenderSection("CSS", required: false);
</style>
</head>
<body>
<header class="header">
<div class="header__blurb">
<a class="header__blurb__title" href="/">Robware</a>
<small class="header__blurb__tagline">Software by Rob</small>
</div>
<div class="header__headshot"></div>
</header>
<div id="content">
<main>
<h1>@ViewData["Title"]</h1>
@RenderBody()
</main>
<nav>
@Re
<h5>Projects:</h5>
<ul>
<li><a href="link 1">Link 1</a></li>
<li><a href="link 2">Link 2</a></li>
<li><a href="link 3">Link 3</a></li>
<li><a href="//git.robware.uk">View All</a></li>
</ul>
<h5>Blog:</h5>
<ul>
<li><a href="link 1">Link 1</a></li>
<li><a href="link 2">Link 2</a></li>
<li><a href="link 3">Link 3</a></li>
<li><a href="/blog">View All</a></li>
</ul>
</nav>
</div>
<footer>
<div class="logo"></div>
</footer>
</body>
</html>