Added option to configure fonts in mkdocs.yml with fallbacks

This commit is contained in:
squidfunk
2016-02-16 13:10:33 +01:00
parent 9233074124
commit 863e1482dc
21 changed files with 165 additions and 120 deletions

View File

@@ -24,13 +24,6 @@
* Code highlighter
* ------------------------------------------------------------------------- */
/*
* Inline code
*/
code {
color: $primary;
}
/*
* Code block
*/
@@ -69,7 +62,7 @@ pre {
/*
* Strings
*/
.s {
.s, .s1 {
color: #183691;
}

View File

@@ -21,28 +21,22 @@
*/
/* ----------------------------------------------------------------------------
* Font faces
* Font faces - defined in base.html for correct path resolution
* ------------------------------------------------------------------------- */
/*
* Base URL and path for icon font.
*/
$base: '../..';
$path: $base + '/assets/fonts/';
/*
* Icon font
*/
@font-face {
font-family: 'Icon';
src: url($path + 'icon.eot?52m981');
src: url($path + 'icon.eot?#iefix52m981') format('embedded-opentype'),
url($path + 'icon.woff?52m981') format('woff'),
url($path + 'icon.ttf?52m981') format('truetype'),
url($path + 'icon.svg?52m981#icon') format('svg');
font-weight: normal;
font-style: normal;
}
// /*
// * Icon font
// */
// @font-face {
// font-family: 'Icon';
// src: url('/assets/fonts/icon.eot?52m981');
// src: url('/assets/fonts/icon.eot?#iefix52m981') format('embedded-opentype'),
// url('/assets/fonts/icon.woff?52m981') format('woff'),
// url('/assets/fonts/icon.ttf?52m981') format('truetype'),
// url('/assets/fonts/icon.svg?52m981#icon') format('svg');
// font-weight: normal;
// font-style: normal;
// }
/* ----------------------------------------------------------------------------
* Representational classes

View File

@@ -44,9 +44,9 @@
}
/*
* Headlines and chapters in primary color
* Headlines, chapters, links and inline code
*/
h1, h2 {
h1, h2, a, code {
color: $primary;
}
@@ -58,18 +58,18 @@
}
/*
* Color links
* Hovered and focused links
*/
a {
color: $primary;
a:hover,
a:focus {
color: $accent;
}
/*
* Hovered link
*/
&:hover,
&:focus {
color: $accent;
}
/*
* Light permalinks
*/
.headerlink {
color: $black-lighter;
}
/*
@@ -134,10 +134,8 @@
/*
* Inherit color for links
*/
a,
a:hover,
a:focus {
color: inherit;
a .title, a .button {
color: $white;
}
/*
@@ -167,15 +165,4 @@
&.warning {
background: mix($red-500, $white, 10%);
}
}
/*
* Permalink support
*/
.article {
h2, h3, h4, h5, h6 {
a {
color: $black-lighter;
}
}
}

View File

@@ -126,6 +126,22 @@
}
}
/*
* Align permalinks on the right
*/
.headerlink {
float: right;
margin-left: 20px;
font-size: 14px;
/*
* Hide permalink to main headline
*/
h1 & {
display: none;
}
}
/*
* Paragraphs and section titles
*/
@@ -514,27 +530,4 @@
margin: 20px -24px 0;
padding: 20px 24px;
}
}
/*
* Permalink support
*/
.article {
/*
* Hide link to main headline
*/
h1 a {
display: none;
}
/*
* Align permalinks on the right
*/
h2, h3, h4, h5, h6 {
a {
float: right;
margin-left: 20px;
}
}
}

View File

@@ -28,7 +28,7 @@
* Default font styles
*/
body, input {
font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 400;
/* Enable font-smoothing in Webkit and FF */
@@ -47,7 +47,7 @@ body, input {
* Proportional fonts
*/
pre, code {
font-family: 'Ubuntu Mono', 'Courier New', 'Courier', monospace;
font-family: 'Courier New', 'Courier', monospace;
/*
* Use system fonts, if browser doesn't support webfonts

View File

@@ -64,15 +64,52 @@
<link rel="icon" type="image/x-icon"
href="{{ base_url }}/{{ icon }}" />
<!-- Webfonts -->
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Ubuntu:400,700" />
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Ubuntu+Mono" />
<!-- Configure icons (placed here to omit issues with subdirectories) -->
<style>
@font-face {
font-family: 'Icon';
src: url('{{ base_url }}/assets/fonts/icon.eot?52m981');
src: url('{{ base_url }}/assets/fonts/icon.eot?#iefix52m981')
format('embedded-opentype'),
url('{{ base_url }}/assets/fonts/icon.woff?52m981')
format('woff'),
url('{{ base_url }}/assets/fonts/icon.ttf?52m981')
format('truetype'),
url('{{ base_url }}/assets/fonts/icon.svg?52m981#icon')
format('svg');
font-weight: normal;
font-style: normal;
}
</style>
<!-- Theme-related and custom stylesheets -->
<!-- Theme-related stylesheets -->
<link rel="stylesheet" type="text/css"
href="{{ base_url }}/assets/stylesheets/application.css" />
<!-- Configure webfonts -->
{% if config.extra.font != 'none' %}
{% set text = 'Ubuntu' %}
{% if config.extra.font and config.extra.font.text %}
{% set text = config.extra.font.text %}
{% endif %}
{% set code = 'Ubuntu Mono' %}
{% if config.extra.font and config.extra.font.code %}
{% set code = config.extra.font.code %}
{% endif %}
{% set font = text + ':400,700|' + code | replace('+', ' ') %}
<link rel="stylesheet" type="text/css"
href="//fonts.googleapis.com/css?family={{ font }}" />
<style>
body, input {
font-family: '{{ text }}', Helvetica, Arial, sans-serif;
}
pre, code {
font-family: '{{ code }}', 'Courier New', 'Courier', monospace;
}
</style>
{% endif %}
<!-- Custom stylesheets -->
{% for path in extra_css %}
<link rel="stylesheet" type="text/css" href="{{ path }}" />
{% endfor %}

View File

@@ -1,5 +1,5 @@
<!-- Navigation -->
<nav aria-label="navigation">
<nav aria-label="Navigation">
<!-- Project information -->
<a href="{{ repo_url }}" class="project">
@@ -36,14 +36,16 @@
<ul class="repo">
<li class="repo-download">
{% set version = config.extra.version | default('master') %}
<a href="{{ repo_url }}/archive/{{ version }}.zip"
target="_blank" aria-label="Download {{ repo_id }} from GitHub">
<a href="{{ repo_url }}/archive/{{ version }}.zip" target="_blank"
title="Download {{ repo_id }} from GitHub"
data-action="download">
<i class="icon icon-download"></i> Download
</a>
</li>
<li class="repo-stars">
<a href="{{ repo_url }}"
target="_blank" aria-label="Star {{ repo_id }} on GitHub">
<a href="{{ repo_url }}" target="_blank"
title="Star {{ repo_id }} on GitHub"
data-action="star">
<i class="icon icon-star"></i> Star
<span class="count">&ndash;</span>
</a>
@@ -67,22 +69,22 @@
<!-- Twitter -->
{% if config.extra.author.twitter %}
{% set author = config.extra.author.twitter %}
<li>
<a href="https://twitter.com/{{ config.extra.author.twitter }}"
title="@{{ config.extra.author.twitter }} on Twitter"
target="_blank">
@{{ config.extra.author.twitter }} on Twitter
<a href="https://twitter.com/{{ author }}" target="_blank"
title="@{{ author }} on Twitter">
@{{ author }} on Twitter
</a>
</li>
{% endif %}
<!-- GitHub -->
{% if config.extra.author.github %}
{% set author = config.extra.author.github %}
<li>
<a href="https://github.com/{{ config.extra.author.github }}"
title="@{{ config.extra.author.twitter }} on GitHub"
target="_blank">
@{{ config.extra.author.github }} on GitHub
<a href="https://github.com/{{ author }}" target="_blank"
title="@{{ author }} on GitHub">
@{{ author }} on GitHub
</a>
</li>
{% endif %}

View File

@@ -1,6 +1,6 @@
<!-- Previous and next page -->
{% if include_next_prev %}
<nav class="pagination" aria-label="footer navigation">
<nav class="pagination" aria-label="Footer">
<!-- Previous page -->
<div class="previous">

View File

@@ -1,5 +1,5 @@
<!-- Top-level navigation -->
<nav aria-label="top navigation">
<nav aria-label="Header">
<!-- Default bar -->
<div class="bar default">