1
Fork 0

Fixed breadcrumbs, and generate page title and html title on markdown content

This commit is contained in:
Jake Howard 2016-01-25 22:06:10 +00:00
parent e28042c330
commit 8bf422407f
6 changed files with 36 additions and 25 deletions

View file

@ -1,6 +1,7 @@
/* global $ */
import './events.js';
import './globals.js';
import 'whatwg-fetch';
@ -20,6 +21,6 @@ if ($('navbar').length > 0) {
React.render(<NavBar />, $('navbar')[0]);
}
if ($('#breadcrumbs') > 0) {
if ($('#breadcrumbs').length > 0) {
React.render(<Breadcrumbs />, $('#breadcrumbs')[0]);
}

3
static/src/js/globals.js Normal file
View file

@ -0,0 +1,3 @@
window.updateTitle = function (value) {
document.title = value + ' | TheOrangeOne';
};

View file

@ -154,18 +154,26 @@ footer {
}
h1 {
margin: 15px 0;
display: inline-block;
}
.breadcrumb-container {
.container {
position: relative;
#breadcrumbs {
text-align: right;
position: absolute;
bottom: 5px;
right: 0;
.breadcrumb {
background: transparent;
margin-bottom: 3px;
font-size: 17px;
padding: 0;
li::before {
content: "/";
padding: 0 3px;
}
background: transparent;
margin-bottom: 3px;
font-size: 17px;
a {
.transition(color 0.4s);
color: white;
&:hover {
color: #ff7f00;
@ -173,6 +181,7 @@ footer {
}
}
}
}
@media (min-width: @screen-sm-min) {
& + div {
margin-top: 65px;

View file

@ -18,7 +18,7 @@
@font-family-serif: 'Roboto';
@font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
@font-family-base: @font-family-sans-serif;
@font-size-base: 15px;
@font-size-base: 17px;
@font-size-large: ceil((@font-size-base * 1.25));
@font-size-small: ceil((@font-size-base * 0.85));
@font-size-h1: floor((@font-size-base * 2.6));

View file

@ -7,15 +7,9 @@
{% block baseContent %}
<div class="jumbotron header">
<div class="container">
<div class="row">
<div class="col-sm-8">
<h1>{% block pageTitle %}{% endblock %}</h1>
</div>
<div class="col-sm-4 breadcrumb-container">
<div id="breadcrumbs"></div>
</div>
</div>
</div>
<navbar></navbar>
</div>
{% block content %}{% endblock %}

View file

@ -8,6 +8,10 @@
</div>
<script>
$('.header h1').text($('.markdown-content h1').text());
$(window).load(function () {
const TITLE = $('.markdown-content h1').text();
$('.header h1').text(TITLE);
window.updateTitle(TITLE);
});
</script>
{% endblock %}