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 $ */ /* global $ */
import './events.js'; import './events.js';
import './globals.js';
import 'whatwg-fetch'; import 'whatwg-fetch';
@ -20,6 +21,6 @@ if ($('navbar').length > 0) {
React.render(<NavBar />, $('navbar')[0]); React.render(<NavBar />, $('navbar')[0]);
} }
if ($('#breadcrumbs') > 0) { if ($('#breadcrumbs').length > 0) {
React.render(<Breadcrumbs />, $('#breadcrumbs')[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,21 +154,30 @@ footer {
} }
h1 { h1 {
margin: 15px 0; margin: 15px 0;
display: inline-block;
} }
.breadcrumb-container { .container {
text-align: right; position: relative;
.breadcrumb { #breadcrumbs {
li::before { text-align: right;
content: "/"; position: absolute;
padding: 0 3px; bottom: 5px;
} right: 0;
background: transparent; .breadcrumb {
margin-bottom: 3px; background: transparent;
font-size: 17px; margin-bottom: 3px;
a { font-size: 17px;
color: white; padding: 0;
&:hover { li::before {
color: #ff7f00; content: "/";
padding: 0 3px;
}
a {
.transition(color 0.4s);
color: white;
&:hover {
color: #ff7f00;
}
} }
} }
} }

View file

@ -18,7 +18,7 @@
@font-family-serif: 'Roboto'; @font-family-serif: 'Roboto';
@font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace; @font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
@font-family-base: @font-family-sans-serif; @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-large: ceil((@font-size-base * 1.25));
@font-size-small: ceil((@font-size-base * 0.85)); @font-size-small: ceil((@font-size-base * 0.85));
@font-size-h1: floor((@font-size-base * 2.6)); @font-size-h1: floor((@font-size-base * 2.6));

View file

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

View file

@ -8,6 +8,10 @@
</div> </div>
<script> <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> </script>
{% endblock %} {% endblock %}