Browse Source

bunch of little changes...

make the font a bit smaller, but larger on the sidebar...

move styling for sidebar into css from style attribute..

make sure my custom css can override the tufte css (to allow setting
the font size)..

convert the slug into a macro so it can be used else where

make the title link to a slug, but use -title since the bare
slug is the body which doesn't make it go to the title of the
blog post...

make a few of the side bar elements bold (the year and the month)..
main
John-Mark Gurney 3 years ago
parent
commit
19a8590fa1
4 changed files with 30 additions and 9 deletions
  1. +16
    -0
      content/media/css/custom.css
  2. +6
    -6
      layout/base.j2
  3. +2
    -2
      layout/blog.j2
  4. +6
    -1
      layout/macros.j2

+ 16
- 0
content/media/css/custom.css View File

@@ -1,3 +1,9 @@
/*
* override some tufte options
*/
html {
font-size: 13px;
}

/*
* override some w3.css options
@@ -7,6 +13,16 @@
width: 80%;
}

.w3-sidebar {
font-size: 1.2rem;
width: 350px;
right: 0;
display: block;
top: 0;
bottom: 0;
overflow-y: scroll;
}

ul.posts > li {
padding-left: 1.5em;
text-indent: -1em;


+ 6
- 6
layout/base.j2 View File

@@ -49,28 +49,28 @@

{% block css %}
<link rel="stylesheet" href="{{ media_url('css/w3.css') }}">
<link rel="stylesheet" href="{{ media_url('css/custom.css') }}">
<link rel="stylesheet" href="{{ media_url('css/tufte.css') }}">
<link rel="stylesheet" href="{{ media_url('css/custom.css') }}">
{% endblock css %}
{% block endhead %}{% endblock endhead %}
</head>

<body class="w3-main" id="{{ resource.meta.id if resource.meta.id else resource.slug }}">
<body class="w3-main" id="{{ slug(resource) }}">
<!-- from: https://www.w3schools.com/w3css/w3css_sidebar.asp -->
<div class="w3-top">
<div class="w3-bar w3-lightgrey">
<button class="w3-bar-item w3-button w3-xlarge w3-right" onclick="w3_open()">&#9776;</button>
</div>
</div>
<div class="w3-sidebar w3-animate-right w3-bar-block w3-collapse" style="width:350px;right:0;display:block;" id="mySidebar">
<button class="w3-bar-item w3-button" onclick="w3_close()">Close &times;</button>
<div class="w3-sidebar w3-animate-right w3-bar-block w3-collapse" id="mySidebar">
<button class="w3-bar-item w3-button" onclick="w3_close()"><b>Close</b> &times;</button>
{% set hierarchy = node.rwalk()|list %}
{% for yeargrp in hierarchy[-1].walk_resources_sorted_by_time()|groupby("meta.created.year")|reverse %}
<div class="w3-dropdown-hover w3-dropdown-click">
<button class="w3-button">{{ yeargrp.grouper }} ({{ yeargrp.list|count }}){# font awesome <i class="fa fa-caret-down"></i> #}</button>
<button class="w3-button"><b>{{ yeargrp.grouper }}</b> ({{ yeargrp.list|count }}){# font awesome <i class="fa fa-caret-down"></i> #}</button>
<div class="w3-dropdown-content w3-bar-block">
{% for monthgrp in yeargrp.list|groupby("meta.created.month")|reverse %}
<button class="w3-button">{{ monthgrp.list[0].meta.created|date_format('%B') }}{# font awesome <i class="fa fa-caret-down"></i> #}</button>
<b><button class="w3-button">{{ monthgrp.list[0].meta.created|date_format('%B') }}{# font awesome <i class="fa fa-caret-down"></i> #}</button></b>
{% for item in monthgrp.list %}
<div class="w3-dropdown-click w3-bar-block" style="margin-left: 0.75em;">
<a href="{{ content_url(item.url) }}" class="no-tufte-underline w3-bar-item w3-button">{{ item.meta.title }}</a>


+ 2
- 2
layout/blog.j2 View File

@@ -1,4 +1,4 @@
{% from "macros.j2" import render with context %}
{% from "macros.j2" import slug %}
{% extends "base.j2" %}

{% block main -%}
@@ -6,7 +6,7 @@
{% mark post -%}
<article class="post">

<h1><a class="no-tufte-underline" href="{{ resource.url }}">{{ resource.meta.title }}</a></h1>
<h1><a name="{{ slug(resource) }}-title" class="no-tufte-underline" href="{{ resource.url ~"#"~slug(resource)~"-title" }}">{{ resource.meta.title }}</a></h1>

<p class="posted">Posted: {{ resource.meta.created.strftime('%B %e, %Y') }} at {{ resource.meta.time }}</p>



+ 6
- 1
layout/macros.j2 View File

@@ -1,3 +1,8 @@
{% macro slug(res) %}
{{ res.meta.id if res.meta.id else res.slug }}{% endmacro %}

{# endmacro not on new line to prevent white space at end of macro #}

{% macro render_excerpt(res, class=None) %}
{% refer to res.relative_path as post %}
<article {{'class='~class if class }}>
@@ -37,4 +42,4 @@
</ul>
</nav>
{%- endif %}
{%- endmacro %}
{%- endmacro %}

Loading…
Cancel
Save