return-to-ritherdon
/
ritherdon-archive
1
0
Fork 0
Code Issues 2 Pull Requests Projects 1 Releases Wiki Activity
Browse Source

update /layouts/header.html template with new CSS rules. 

This commit makes the header (site's name and logo) a link which points back to
the site's "/" (I.E. Home page/route). It, also, centralises the header and the
navigation menu (in the header). This is so the header doesn't look weird when
viewed on a mobile phone.

I removed the <hr> at the bottom of the file because the site has enough styling
applied to it to make the <hr> look out of place now. I can clearly
denote/identify where the site's (front-end) header and footer stops and starts.
stable
Craig Oates 2 years ago
parent
82192113c0
commit
4d5a9b7f0c
1 changed files with 125 additions and 108 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 233
      templates/layouts/header.html

233
templates/layouts/header.html
Unescape View File

@ -3,13 +3,13 @@
<button type="button" <button type="button"
id="be-site-side-menu-toggle" id="be-site-side-menu-toggle"
onclick="toggleSiteSideMenu()"> onclick="toggleSiteSideMenu()">
<img alt="Site Side Menu" <img alt="Site Side Menu"
src="/images/icons/site-side-menu.png"> src="/images/icons/site-side-menu.png">
Menu Menu
</button> </button>
<div class="be-user-info"> <div class="be-user-info">
<p><span>Logged in as: </span>{{user.username}}</p> <p><span>Logged in as: </span>{{user.username}}</p>
</div> </div>
</div> </div>
{% endif %} {% endif %}
@ -17,79 +17,79 @@
{% if roles.logged-in %} {% if roles.logged-in %}
<div class="be-site-side-menu" id="be-site-side-menu"> <div class="be-site-side-menu" id="be-site-side-menu">
<div> <div>
<div> <div>
<a class="be-gui-link" href="/dashboard"> <a class="be-gui-link" href="/dashboard">
<img alt="Dashboard" <img alt="Dashboard"
src="/images/icons/dashboard.png"> src="/images/icons/dashboard.png">
Dashboard Dashboard
</a> </a>
<a class="be-gui-link" href="/storage/manage"> <a class="be-gui-link" href="/storage/manage">
<img alt="Dashboard" <img alt="Dashboard"
src="/images/icons/index.png"> src="/images/icons/index.png">
Storage Storage
</a> </a>
</div> </div>
<div> <div>
<h2>Archive</h2> <h2>Archive</h2>
<a class="be-gui-link" href="/create/archive-entry"> <a class="be-gui-link" href="/create/archive-entry">
<img alt="New Page" <img alt="New Page"
src="/images/icons/add-circle.png"> src="/images/icons/add-circle.png">
Create Entry Create Entry
</a> </a>
<a class="be-gui-link" href="/user/archive"> <a class="be-gui-link" href="/user/archive">
<img alt="New Page" <img alt="New Page"
src="/images/icons/index.png"> src="/images/icons/index.png">
Archive Index Archive Index
</a> </a>
</div> </div>
<div> <div>
<h2>Pages</h2> <h2>Pages</h2>
<a class="be-gui-link" href="/create/page"> <a class="be-gui-link" href="/create/page">
<img alt="New Page" <img alt="New Page"
src="/images/icons/add-circle.png"> src="/images/icons/add-circle.png">
Add Page Add Page
</a> </a>
<a class="be-gui-link" href="/user/pages"> <a class="be-gui-link" href="/user/pages">
<img alt="New Page" <img alt="New Page"
src="/images/icons/index.png"> src="/images/icons/index.png">
Pages Index Pages Index
</a> </a>
</div> </div>
</div> </div>
<div> <div>
<h2>Accounts and Settings</h2> <h2>Accounts and Settings</h2>
<a class="be-gui-link" href="/user/edit"> <a class="be-gui-link" href="/user/edit">
<img alt="Edit Profile" <img alt="Edit Profile"
src="/images/icons/profile.png"> src="/images/icons/profile.png">
My Account Details My Account Details
</a> </a>
{% if roles.administrator %} {% if roles.administrator %}
<a class="be-gui-link" href="/users"> <a class="be-gui-link" href="/users">
<img alt="Manage Accounts" <img alt="Manage Accounts"
src="/images/icons/all-accounts.png"> src="/images/icons/all-accounts.png">
Manage Accounts Manage Accounts
</a> </a>
<a class="be-gui-link" href="/site-settings"> <a class="be-gui-link" href="/site-settings">
<img alt="Site Settings" <img alt="Site Settings"
src="/images/icons/settings.png"> src="/images/icons/settings.png">
Site Settings Site Settings
</a> </a>
{% endif %} {% endif %}
</div> </div>
<div> <div>
<form action="/logout" <form action="/logout"
method="post"> method="post">
<input required type="hidden" <input required type="hidden"
name="AUTHENTICITY-TOKEN" name="AUTHENTICITY-TOKEN"
value="{{token}}"> value="{{token}}">
<button class="be-gui-button" <button class="be-gui-button"
type="submit"> type="submit">
<img alt="Log Out" <img alt="Log Out"
src="/images/icons/logout.png"> src="/images/icons/logout.png">
Log Out Log Out
</button> </button>
</form> </form>
</div> </div>
</div> </div>
{% endif %} {% endif %}
@ -97,46 +97,63 @@
<div id="fe-main"> <div id="fe-main">
{% if alert %} {% if alert %}
<div class="be-alert-container" <div class="be-alert-container"
id="be-alert-container"> id="be-alert-container">
{{alert | safe}} {{alert | safe}}
<button class="be-gui-button-no-text" <button class="be-gui-button-no-text"
title="Click to close alert message" title="Click to close alert message"
type="button" type="button"
id="be-close-alert" id="be-close-alert"
onclick="closeAlert()"> onclick="closeAlert()">
<img alt="Close alert" <img alt="Close alert"
src="/images/icons/cross-circle.png"> src="/images/icons/cross-circle.png">
</button> </button>
</div> </div>
{% endif %} {% endif %}
<div class="fe-site-header"> <a class="fe-site-header"
{% ifequal system-data.first.enable-site-logo 1 %} title="Click to view the site's home page"
<img alt="{{system-data.first.site-name}}" href="/">
{% ifequal system-data.first.enable-site-logo 1 %}
<img alt="{{system-data.first.site-name}}"
src="/images/site-logo.png"> src="/images/site-logo.png">
{% endifequal %} {% endifequal %}
<h1>{{system-data.first.site-name}}</h1> <h1>{{system-data.first.site-name}}</h1>
</div> </a>
<div> <nav>
<nav> {% for page in system-data.last.first %}
{% for page in system-data.last.first %} {% ifequal page.enable-nav-menu 1 %}
{% ifequal page.enable-nav-menu 1 %} {% if page.slug == "login" %}
{% if page.slug == "login" %} <a href="/{{page.slug}}"
<a href="/{{page.slug}}">{{page.title}}</a> title="Click to view the Login page">
{% elif page.slug == "home" %} {{page.title}}
<a href="/">{{page.title}}</a> </a>
{% elif page.slug == "archive" %} {% elif page.slug == "home" %}
<a href="/{{page.slug}}">{{page.title}}</a> <a href="/"
{% elif page.slug == "pages" %} title="Click to view the site's home page">
<a href="/{{page.slug}}">{{page.title}}</a> {{page.title}}
{% elif page.slug == "sign-up" %} </a>
<a href="/{{page.slug}}">{{page.title}}</a> {% elif page.slug == "archive" %}
{% else %} <a href="/{{page.slug}}"
<a href="/view/page/{{page.slug}}">{{page.title}}</a> title="Click to view the site's Archive index">
{% endif %} {{page.title}}
{% endifequal %} </a>
{% endfor %} {% elif page.slug == "pages" %}
</nav> <a href="/{{page.slug}}"
</div> title="Click to view the site's Pages index">
<hr> {{page.title}}
</a>
{% elif page.slug == "sign-up" %}
<a href="/{{page.slug}}"
title="Click to create an account with this website">
{{page.title}}
</a>
{% else %}
<a href="/view/page/{{page.slug}}"
title="Click to view '{{page.title}}'">
{{page.title}}
</a>
{% endif %}
{% endifequal %}
{% endfor %}
</nav>

Write Preview
Loading…
Cancel
Save