mirror of
https://github.com/Noettore/cocoa-eh-hugo-theme.git
synced 2025-10-14 19:26:40 +02:00
Add all files
This commit is contained in:
Nishanth Shanmugham
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
@@ -0,0 +1 @@
|
||||
.DS_Store
|
||||
21
LICENSE
Normal file
21
LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2015 Nishanth Shanmugham<nishanth.gerrard@gmail.com>
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
0
archetypes/default.md
Normal file
0
archetypes/default.md
Normal file
130
flexbox-prefixes.less
Normal file
130
flexbox-prefixes.less
Normal file
@@ -0,0 +1,130 @@
|
||||
// Flexbox display
|
||||
// flex or inline-flex
|
||||
.flex-display(@display: flex) {
|
||||
display: ~"-webkit-@{display}";
|
||||
display: ~"-moz-@{display}";
|
||||
display: ~"-ms-@{display}box"; // IE10 uses -ms-flexbox
|
||||
display: ~"-ms-@{display}"; // IE11
|
||||
display: @display;
|
||||
}
|
||||
|
||||
// The 'flex' shorthand
|
||||
// - applies to: flex items
|
||||
// <positive-number>, initial, auto, or none
|
||||
.flex(@columns: initial) {
|
||||
-webkit-flex: @columns;
|
||||
-moz-flex: @columns;
|
||||
-ms-flex: @columns;
|
||||
flex: @columns;
|
||||
}
|
||||
|
||||
// Flex Flow Direction
|
||||
// - applies to: flex containers
|
||||
// row | row-reverse | column | column-reverse
|
||||
.flex-direction(@direction: row) {
|
||||
-webkit-flex-direction: @direction;
|
||||
-moz-flex-direction: @direction;
|
||||
-ms-flex-direction: @direction;
|
||||
flex-direction: @direction;
|
||||
}
|
||||
|
||||
// Flex Line Wrapping
|
||||
// - applies to: flex containers
|
||||
// nowrap | wrap | wrap-reverse
|
||||
.flex-wrap(@wrap: nowrap) {
|
||||
-webkit-flex-wrap: @wrap;
|
||||
-moz-flex-wrap: @wrap;
|
||||
-ms-flex-wrap: @wrap;
|
||||
flex-wrap: @wrap;
|
||||
}
|
||||
|
||||
// Flex Direction and Wrap
|
||||
// - applies to: flex containers
|
||||
// <flex-direction> || <flex-wrap>
|
||||
.flex-flow(@flow) {
|
||||
-webkit-flex-flow: @flow;
|
||||
-moz-flex-flow: @flow;
|
||||
-ms-flex-flow: @flow;
|
||||
flex-flow: @flow;
|
||||
}
|
||||
|
||||
// Display Order
|
||||
// - applies to: flex items
|
||||
// <integer>
|
||||
.flex-order(@order: 0) {
|
||||
-webkit-order: @order;
|
||||
-moz-order: @order;
|
||||
-ms-order: @order;
|
||||
order: @order;
|
||||
}
|
||||
|
||||
// Flex grow factor
|
||||
// - applies to: flex items
|
||||
// <number>
|
||||
.flex-grow(@grow: 0) {
|
||||
-webkit-flex-grow: @grow;
|
||||
-moz-flex-grow: @grow;
|
||||
-ms-flex-grow: @grow;
|
||||
flex-grow: @grow;
|
||||
}
|
||||
|
||||
// Flex shrink
|
||||
// - applies to: flex item shrink factor
|
||||
// <number>
|
||||
.flex-shrink(@shrink: 1) {
|
||||
-webkit-flex-shrink: @shrink;
|
||||
-moz-flex-shrink: @shrink;
|
||||
-ms-flex-shrink: @shrink;
|
||||
flex-shrink: @shrink;
|
||||
}
|
||||
|
||||
// Flex basis
|
||||
// - the initial main size of the flex item
|
||||
// - applies to: flex itemsnitial main size of the flex item
|
||||
// <width>
|
||||
.flex-basis(@width: auto) {
|
||||
-webkit-flex-basis: @width;
|
||||
-moz-flex-basis: @width;
|
||||
-ms-flex-basis: @width;
|
||||
flex-basis: @width;
|
||||
}
|
||||
|
||||
// Axis Alignment
|
||||
// - applies to: flex containers
|
||||
// flex-start | flex-end | center | space-between | space-around
|
||||
.justify-content(@justify: flex-start) {
|
||||
-webkit-justify-content: @justify;
|
||||
-moz-justify-content: @justify;
|
||||
-ms-justify-content: @justify;
|
||||
justify-content: @justify;
|
||||
}
|
||||
|
||||
// Packing Flex Lines
|
||||
// - applies to: multi-line flex containers
|
||||
// flex-start | flex-end | center | space-between | space-around | stretch
|
||||
.align-content(@align: stretch) {
|
||||
-webkit-align-content: @align;
|
||||
-moz-align-content: @align;
|
||||
-ms-align-content: @align;
|
||||
align-content: @align;
|
||||
}
|
||||
|
||||
// Cross-axis Alignment
|
||||
// - applies to: flex containers
|
||||
// flex-start | flex-end | center | baseline | stretch
|
||||
.align-items(@align: stretch) {
|
||||
-webkit-align-items: @align;
|
||||
-moz-align-items: @align;
|
||||
-ms-align-items: @align;
|
||||
align-items: @align;
|
||||
}
|
||||
|
||||
// Cross-axis Alignment
|
||||
// - applies to: flex items
|
||||
// auto | flex-start | flex-end | center | baseline | stretch
|
||||
.align-self(@align: auto) {
|
||||
-webkit-align-self: @align;
|
||||
-moz-align-self: @align;
|
||||
-ms-align-self: @align;
|
||||
align-self: @align;
|
||||
}
|
||||
11
layouts/404.html
Normal file
11
layouts/404.html
Normal file
@@ -0,0 +1,11 @@
|
||||
{{ partial "header.html" . }}
|
||||
<div class="section main">
|
||||
<div class="container f04">
|
||||
<div class="content">
|
||||
<div class="num">404</div>
|
||||
<div class="detail">Sorry, this page does not exist.</div>
|
||||
<div class="suggestion"><a href="/">Visit home page</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
13
layouts/_default/list.html
Normal file
13
layouts/_default/list.html
Normal file
@@ -0,0 +1,13 @@
|
||||
{{ partial "header.html" . }}
|
||||
<div class="section main">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
{{ partial "page-heading" . }}
|
||||
{{ range .Data.Pages.ByPublishDate }}
|
||||
{{ partial "li.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
|
||||
9
layouts/_default/single.html
Normal file
9
layouts/_default/single.html
Normal file
@@ -0,0 +1,9 @@
|
||||
{{ partial "header.html" . }}
|
||||
<div class="section main">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
12
layouts/fixed/single.html
Normal file
12
layouts/fixed/single.html
Normal file
@@ -0,0 +1,12 @@
|
||||
{{ partial "header.html" . }}
|
||||
<div class="section main">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
{{ partial "page-heading.html" . }}
|
||||
<div class="markdown">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
15
layouts/index.html
Normal file
15
layouts/index.html
Normal file
@@ -0,0 +1,15 @@
|
||||
{{ partial "header.html" . }}
|
||||
<div class="section main">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
<div class="page-heading">Posts</div>
|
||||
{{ range .Data.Pages.ByPublishDate }}
|
||||
{{ if eq .Section "posts" }}
|
||||
{{ partial "li.html" . }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ partial "footer.html" . }}
|
||||
|
||||
4
layouts/partials/footer.html
Normal file
4
layouts/partials/footer.html
Normal file
@@ -0,0 +1,4 @@
|
||||
{{ partial "footer_scripts" . }}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
13
layouts/partials/footer_scripts.html
Normal file
13
layouts/partials/footer_scripts.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<!-- Google Analytics -->
|
||||
{{ if .Site.Params.GATracker }}
|
||||
<script type="text/javascript">
|
||||
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
|
||||
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
try {
|
||||
var pageTracker = _gat._getTracker("{{ .Site.Params.GATracker }}");
|
||||
pageTracker._trackPageview();
|
||||
} catch(err) {}
|
||||
</script>
|
||||
{{ end }}
|
||||
14
layouts/partials/head.html
Normal file
14
layouts/partials/head.html
Normal file
@@ -0,0 +1,14 @@
|
||||
<head>
|
||||
{{ partial "meta.html" . }}
|
||||
<base href="{{ .Site.BaseUrl }}">
|
||||
<title>
|
||||
{{ $URL := "/" }}
|
||||
{{ if eq $URL "/" }}
|
||||
{{ .Site.Title }}
|
||||
{{ else }}
|
||||
{{ .Title }} · {{ .Site.Title }}
|
||||
{{ end }}
|
||||
</title>
|
||||
<link rel="canonical" href="{{ .Permalink }}">
|
||||
{{ partial "head_includes.html" . }}
|
||||
</head>
|
||||
18
layouts/partials/head_includes.html
Normal file
18
layouts/partials/head_includes.html
Normal file
@@ -0,0 +1,18 @@
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="/css/reset.css">
|
||||
<link rel="stylesheet" href="/css/pygments.css">
|
||||
<link rel="stylesheet" href="/css/main.css">
|
||||
<link rel="stylesheet" href="/css/navlist.css">
|
||||
|
||||
<!-- Icon -->
|
||||
<link rel="shortcut icon"
|
||||
{{ if .Site.Params.FaviconFile }}
|
||||
href="/img/{{ .Site.Params.FaviconFile }}"
|
||||
{{ else }}
|
||||
href="/img/favicon.ico"
|
||||
{{ end }}
|
||||
>
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
66
layouts/partials/header.html
Normal file
66
layouts/partials/header.html
Normal file
@@ -0,0 +1,66 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ .Site.LanguageCode }}">
|
||||
|
||||
{{ partial "head.html" . }}
|
||||
|
||||
<body lang="{{ .Site.Params.Lang }}">
|
||||
|
||||
{{ $url := replace .Permalink ( printf "%s" .Site.BaseUrl) "" }}
|
||||
|
||||
<div class="section header">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
<nav>
|
||||
<ul>
|
||||
<a href="/posts"><li>posts</li></a>
|
||||
<a href="/about"><li>about</li></a>
|
||||
<a href="/code"><li>code</li></a>
|
||||
</ul>
|
||||
</nav>
|
||||
<a href="/"><div class="name">{{ .Site.Params.Author }}</div></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section icons">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
|
||||
{{ if .Site.Params.GitHub }}
|
||||
<a href="{{ .Site.Params.GitHub }}" target="_blank">
|
||||
<i class="icon ion-social-github"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Site.Params.Twitter }}
|
||||
<a href="{{ .Site.Params.Twitter }}" target="_blank">
|
||||
<i class="icon ion-social-twitter"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Site.Params.LinkedIn }}
|
||||
<a href="{{ .Site.Params.LinkedIn }}" target="_blank">
|
||||
<i class="icon ion-social-linkedin"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Site.Params.Facebook }}
|
||||
<a href="{{ .Site.Params.Facebook }}" target="_blank">
|
||||
<i class="icon ion-social-facebook larger"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Site.Params.SoundCloud }}
|
||||
<a href="{{ .Site.Params.SoundCloud }}" target="_blank">
|
||||
<i class="icon ion-ios-musical-notes larger"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Site.Params.Email }}
|
||||
<a href="mailto:{{ .Site.Params.Email }}">
|
||||
<i class="icon ion-ios-email larger"></i>
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
4
layouts/partials/li.html
Normal file
4
layouts/partials/li.html
Normal file
@@ -0,0 +1,4 @@
|
||||
<li class="post-item">
|
||||
<div class="meta">{{ .Date.Format .Site.Params.DateForm }}</div>
|
||||
<a href="{{ .Permalink }}"><div>{{ .Title }}</div></a>
|
||||
</li>
|
||||
6
layouts/partials/meta.html
Normal file
6
layouts/partials/meta.html
Normal file
@@ -0,0 +1,6 @@
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||
<meta name="HandheldFriendly" content="True">
|
||||
<meta name="MobileOptimized" content="320">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
|
||||
{{ if .Site.Params.Description }}<meta name="description" content="{{ .Site.Params.Description }}">{{ end }}
|
||||
8
layouts/partials/page-heading.html
Normal file
8
layouts/partials/page-heading.html
Normal file
@@ -0,0 +1,8 @@
|
||||
<div class="page-heading">
|
||||
{{ if .Params.heading }}
|
||||
{{ .Params.heading }}
|
||||
{{ else }}
|
||||
{{ .Title }}
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
30
layouts/posts/single.html
Normal file
30
layouts/posts/single.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ .Site.LanguageCode }}">
|
||||
|
||||
{{ partial "head.html" . }}
|
||||
|
||||
<body lang="{{ .Site.Params.Lang }}">
|
||||
|
||||
{{ $url := replace .Permalink ( printf "%s" .Site.BaseUrl) "" }}
|
||||
|
||||
<div class="section main post">
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
<div class="front-matter">
|
||||
<a href="{{ .Permalink }}">{{ partial "page-heading.html" . }}</a>
|
||||
<div class="meta">
|
||||
<div class="date">{{ .Date.Format .Site.Params.DateForm }}</div>
|
||||
<div class="word-count"><div class="middot"></div>{{ if eq 1 .FuzzyWordCount }}{{ .FuzzyWordCount }} word{{ else }}{{ .FuzzyWordCount }} words{{ end }}</div>
|
||||
<div class="reading-time"><div class="middot"></div>{{ if eq 1 .ReadingTime }}{{ .ReadingTime }} minute read{{ else }}{{ .ReadingTime }} minutes read{{ end }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="markdown">
|
||||
{{ .Content }}
|
||||
<br>
|
||||
<p><a href="/">Back home</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ partial "footer.html" . }}
|
||||
11
less-watcher.js
Normal file
11
less-watcher.js
Normal file
@@ -0,0 +1,11 @@
|
||||
const fs = require('fs');
|
||||
const spawn = require('child_process').spawn;
|
||||
|
||||
process.argv.slice(2).forEach(function(file) {
|
||||
fs.watch(file, function(e) {
|
||||
if (e === 'change') {
|
||||
spawn('lessc', ['main.less', 'static/css/main.css']);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
497
main.less
Normal file
497
main.less
Normal file
@@ -0,0 +1,497 @@
|
||||
// Font imports:
|
||||
|
||||
@import url(http://fonts.googleapis.com/css?family=Raleway:200);
|
||||
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,400italic,700,700italic);
|
||||
@import url(http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
|
||||
|
||||
// Less variables
|
||||
|
||||
@base-font-size: 16px;
|
||||
@vspacing: @base-font-size*2;
|
||||
|
||||
@monospace-font-stack: ~"'Ubuntu Mono', 'Menlo', monospace";
|
||||
@body-font-stack: ~"'Proxima Nova', 'Helvetica Neue', 'Arial' sans-serif";
|
||||
@heading-font-stack: ~"'Proxima Nova', 'Helvetica Neue', 'Arial' sans-serif";
|
||||
@special-font-stack-1: ~"'Raleway', 'Helvetica Neue', 'Arial', sans-serif";
|
||||
|
||||
@black: #333;
|
||||
@gray: #b7b7b7;
|
||||
@accent: #21bB5b; // green
|
||||
@white: #fefefe;
|
||||
@milk: #fefefe;
|
||||
|
||||
@transition-speed-1: .1s;
|
||||
@transition-speed-2: .25s;
|
||||
@in-sine: cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
|
||||
// Utils and prefixing
|
||||
|
||||
@import 'flexbox-prefixes';
|
||||
|
||||
.heading(@font-size: 18px) {
|
||||
font-size: @font-size;
|
||||
font-family: @heading-font-stack;
|
||||
letter-spacing: -0.005rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-smoothing: antialiased;
|
||||
color: @black;
|
||||
}
|
||||
|
||||
.transition (@transition) {
|
||||
-webkit-transition: @transition;
|
||||
-moz-transition: @transition;
|
||||
-ms-transition: @transition;
|
||||
-o-transition: @transition;
|
||||
}
|
||||
|
||||
.user-select(@user-select) {
|
||||
-webkit-user-select: @user-select;
|
||||
-moz-user-select: @user-select;
|
||||
-ms-user-select: @user-select;
|
||||
user-select: @user-select;
|
||||
}
|
||||
|
||||
.meta() {
|
||||
font-size: 14px;
|
||||
color: @gray;
|
||||
}
|
||||
|
||||
|
||||
// Slap-on utils
|
||||
|
||||
.dark {
|
||||
color: @black !important;
|
||||
}
|
||||
|
||||
.light {
|
||||
color: @gray !important;
|
||||
}
|
||||
|
||||
.accent {
|
||||
color: @accent !important;
|
||||
}
|
||||
|
||||
// General styles
|
||||
|
||||
*, *:before, *:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
a, a:visited, a:focus, a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
font-size: @base-font-size;
|
||||
}
|
||||
|
||||
body {
|
||||
.flex-display();
|
||||
.flex-direction(column); // vertically stack sections
|
||||
.align-items(center); // horizontally center all sections
|
||||
.justify-content(flex-start); // start sections at the top
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
font-weight: 400;
|
||||
font-family: @body-font-stack;
|
||||
color: @black;
|
||||
line-height: 1.6;
|
||||
text-rendering: optimizeLegibility !important;
|
||||
// TODO: Uncomment when moz supports at subpixel level
|
||||
// -moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
font-smoothing: subpixel-antialiased;
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
body {
|
||||
.justify-content(center); // vertically center all sections
|
||||
}
|
||||
}
|
||||
|
||||
// Ionicon classes
|
||||
|
||||
.icon {
|
||||
// INFO: Comment out if you see performance issues, especially on mobile
|
||||
text-rendering: geometricPrecision !important;
|
||||
}
|
||||
|
||||
// * Sections – the cornerstone of page elements
|
||||
// * Container – contains section contents
|
||||
//
|
||||
// Both classes are flex elements
|
||||
|
||||
.section {
|
||||
.flex-display();
|
||||
// Sections position their containers centrally, with spacing to the sides
|
||||
// The containers can then move their children around as needed.
|
||||
.justify-content(center);
|
||||
.align-items(center);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.container {
|
||||
.flex-display();
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section {
|
||||
padding: 0 20px;
|
||||
margin-left: 100px;
|
||||
margin-right: 100px;
|
||||
max-width: 900px;
|
||||
}
|
||||
}
|
||||
|
||||
// Sections order
|
||||
|
||||
.section.header {
|
||||
.flex-order(0);
|
||||
}
|
||||
.section.icons {
|
||||
.flex-order(1);
|
||||
}
|
||||
.section.main {
|
||||
.flex-order(2);
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section.header {
|
||||
.flex-order(0);
|
||||
}
|
||||
.section.icons {
|
||||
.flex-order(2);
|
||||
}
|
||||
.section.main {
|
||||
.flex-order(1);
|
||||
}
|
||||
}
|
||||
|
||||
// Styles for sections and contents
|
||||
// Header section
|
||||
|
||||
.section.header {
|
||||
background-color: @accent;
|
||||
|
||||
.container {
|
||||
.align-items(center);
|
||||
.justify-content(center);
|
||||
}
|
||||
|
||||
.content {
|
||||
.flex-display();
|
||||
.flex-direction(column);
|
||||
.align-items(center);
|
||||
}
|
||||
|
||||
.name {
|
||||
.heading();
|
||||
color: @white;
|
||||
}
|
||||
|
||||
nav {
|
||||
font-size: 14px;
|
||||
margin-bottom: floor(@vspacing/2);
|
||||
// font-weight: 600;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
.flex-display(inline-flex);
|
||||
}
|
||||
|
||||
ul a {
|
||||
margin-right: 12px;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
ul li {
|
||||
color: @milk;
|
||||
.transition(~'color @{transition-speed-1} @{in-sine}');
|
||||
|
||||
&:hover {
|
||||
color: @white
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section.header {
|
||||
background-color: transparent;
|
||||
|
||||
.container {
|
||||
.justify-content(flex-start);
|
||||
}
|
||||
|
||||
.content {
|
||||
.align-items(flex-start);
|
||||
}
|
||||
|
||||
.name {
|
||||
color: @black;
|
||||
}
|
||||
|
||||
nav {
|
||||
margin-bottom: 0;
|
||||
|
||||
ul {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
ul li {
|
||||
color: @gray;
|
||||
|
||||
&:hover {
|
||||
color: @black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Icons
|
||||
|
||||
.section.icons {
|
||||
background-color: @accent;
|
||||
|
||||
.container {
|
||||
.align-items(center);
|
||||
.justify-content(center);
|
||||
}
|
||||
|
||||
.content {
|
||||
a {
|
||||
margin-right: 4px;
|
||||
color: @milk;
|
||||
.transition(~'color @{transition-speed-1} @{in-sine}');
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: @white;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 16px;
|
||||
|
||||
|
||||
|
||||
&.larger {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section.icons {
|
||||
background-color: transparent;
|
||||
|
||||
.container {
|
||||
.justify-content(flex-start);
|
||||
}
|
||||
|
||||
.content {
|
||||
a {
|
||||
color: @gray;
|
||||
|
||||
&:hover {
|
||||
color: @black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Main section
|
||||
|
||||
.section.main {
|
||||
.container {
|
||||
.align-items(center);
|
||||
.justify-content(flex-start);
|
||||
}
|
||||
|
||||
.content {
|
||||
color: @black;
|
||||
font-size: 16px;
|
||||
|
||||
.page-heading {
|
||||
.heading();
|
||||
margin-bottom: floor(@vspacing/2);
|
||||
}
|
||||
|
||||
.front-matter {
|
||||
.page-heading {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.meta {
|
||||
.meta();
|
||||
.flex-display();
|
||||
margin-bottom: @vspacing;
|
||||
}
|
||||
|
||||
.date, .word-count, .reading-time .middot {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.middot {
|
||||
font-size: 6px;
|
||||
margin: 0 6px;
|
||||
display: inline;
|
||||
vertical-align: middle;
|
||||
|
||||
&:before {
|
||||
content: "•";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section.main {
|
||||
.content {
|
||||
.front-matter {
|
||||
.date, .word-count, .reading-time .middot {
|
||||
display: initial;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 404 page
|
||||
|
||||
.section.main {
|
||||
.container.f04 {
|
||||
.justify-content(center);
|
||||
|
||||
.content {
|
||||
.flex-display();
|
||||
.flex-direction(column);
|
||||
.align-items(center);
|
||||
|
||||
.num {
|
||||
margin: 30px 0px 30px 0;
|
||||
font-weight: 200;
|
||||
font-family: @special-font-stack-1;
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
.detail {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section.main {
|
||||
.container.f04 {
|
||||
.justify-content(flex-start);
|
||||
|
||||
.content {
|
||||
.align-items(flex-start);
|
||||
|
||||
.num {
|
||||
margin: 0 0 10px 0;
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.detail {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Post item
|
||||
|
||||
.section.main {
|
||||
.container {
|
||||
.content {
|
||||
.post-item {
|
||||
.flex-display();
|
||||
.align-items(center);
|
||||
list-style: none;
|
||||
|
||||
.meta {
|
||||
.meta();
|
||||
min-width: 100px;
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Spacing
|
||||
|
||||
.section {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.section.header {
|
||||
padding-top: @vspacing;
|
||||
padding-bottom: floor(@vspacing/2);
|
||||
}
|
||||
|
||||
.section.icons {
|
||||
padding-top: 0;
|
||||
padding-bottom: @vspacing;
|
||||
}
|
||||
|
||||
.section.main {
|
||||
padding-top: @vspacing;
|
||||
padding-bottom: @vspacing;
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
@vspacing: 60px;
|
||||
|
||||
.container {
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
.section.header {
|
||||
padding-top: @vspacing;
|
||||
padding-bottom: @vspacing;
|
||||
}
|
||||
|
||||
.section.icons {
|
||||
padding-top: @vspacing;
|
||||
padding-bottom: @vspacing;
|
||||
}
|
||||
|
||||
.section.main {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.section.main.post {
|
||||
padding-top: @vspacing;
|
||||
padding-bottom: @vspacing;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: @accent;
|
||||
}
|
||||
|
||||
@import 'markdown';
|
||||
181
markdown.less
Normal file
181
markdown.less
Normal file
@@ -0,0 +1,181 @@
|
||||
.section.main .content {
|
||||
.markdown {
|
||||
|
||||
@background-gray: #f9f9f9;
|
||||
|
||||
//
|
||||
// Heading
|
||||
//
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
.heading();
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.75rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1em;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
letter-spacing: none;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
//
|
||||
// Code
|
||||
//
|
||||
|
||||
code, pre {
|
||||
font-family: @monospace-font-stack;
|
||||
font-size: 15px;
|
||||
background-color: @background-gray;
|
||||
}
|
||||
|
||||
code {
|
||||
/* enclosed by single backtick (`) */
|
||||
padding: .15em .5em;
|
||||
color: darken(#d01040, 10%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
pre {
|
||||
/* Hugo specific: consider using the 'highlight' shortcode */
|
||||
display: block;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
padding: 1rem;
|
||||
line-height: 1.5em;
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
pre code {
|
||||
/* enclosed by 4 backticks (````) */
|
||||
padding: 0;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
//
|
||||
// Body text
|
||||
//
|
||||
|
||||
|
||||
p {
|
||||
/* Invoked by line break */
|
||||
font-size: 1rem;
|
||||
margin-top: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
|
||||
// TODO: Try out and adjust properties for selectors below
|
||||
|
||||
// Lists
|
||||
|
||||
ul, ol, dl {
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style-type: disc;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
// Miscenllaneous
|
||||
|
||||
hr {
|
||||
position: relative;
|
||||
margin: 1.75rem 0;
|
||||
border: 0;
|
||||
border-top: 1px solid lighten(@gray, 10%);
|
||||
border-top: 1px solid lighten(@gray, 20%);
|
||||
}
|
||||
|
||||
abbr {
|
||||
font-size: 0.85rem;
|
||||
font-weight: bold;
|
||||
color: lighten(@black, 20%);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
cursor: help;
|
||||
border-bottom: 1px dotted lighten(@gray, 10%);
|
||||
}
|
||||
|
||||
|
||||
// Quotes
|
||||
|
||||
blockquote {
|
||||
padding: .5rem 1rem;
|
||||
margin: .8rem 0;
|
||||
color: #7a7a7a;
|
||||
border-left: .25rem solid #e5e5e5;
|
||||
}
|
||||
|
||||
blockquote p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
blockquote {
|
||||
padding-right: 5rem;
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Images and tables
|
||||
|
||||
img {
|
||||
display: block;
|
||||
margin: 0 0 1rem;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
table {
|
||||
margin-bottom: 1rem;
|
||||
width: 100%;
|
||||
border: 1px solid #e5e5e5;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: .25rem .5rem;
|
||||
border: 1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
tbody tr:nth-child(odd) td,
|
||||
tbody tr:nth-child(odd) th {
|
||||
background-color: @background-gray;
|
||||
}
|
||||
|
||||
} // end .markdown
|
||||
} // end .section.main .content
|
||||
599
static/css/main.css
Normal file
599
static/css/main.css
Normal file
@@ -0,0 +1,599 @@
|
||||
@import url(http://fonts.googleapis.com/css?family=Raleway:200);
|
||||
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,400italic,700,700italic);
|
||||
@import url(http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
|
||||
.dark {
|
||||
color: #333333 !important;
|
||||
}
|
||||
.light {
|
||||
color: #b7b7b7 !important;
|
||||
}
|
||||
.accent {
|
||||
color: #21bb5b !important;
|
||||
}
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
a,
|
||||
a:visited,
|
||||
a:focus,
|
||||
a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
}
|
||||
body {
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
-moz-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: flex-start;
|
||||
-moz-justify-content: flex-start;
|
||||
-ms-justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
font-weight: 400;
|
||||
font-family: 'Proxima Nova', 'Helvetica Neue', 'Arial' sans-serif;
|
||||
color: #333333;
|
||||
line-height: 1.6;
|
||||
text-rendering: optimizeLegibility !important;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
font-smoothing: subpixel-antialiased;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
body {
|
||||
-webkit-justify-content: center;
|
||||
-moz-justify-content: center;
|
||||
-ms-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
text-rendering: geometricPrecision !important;
|
||||
}
|
||||
.section {
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
-webkit-justify-content: center;
|
||||
-moz-justify-content: center;
|
||||
-ms-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
.container {
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section {
|
||||
padding: 0 20px;
|
||||
margin-left: 100px;
|
||||
margin-right: 100px;
|
||||
max-width: 900px;
|
||||
}
|
||||
}
|
||||
.section.header {
|
||||
-webkit-order: 0;
|
||||
-moz-order: 0;
|
||||
-ms-order: 0;
|
||||
order: 0;
|
||||
}
|
||||
.section.icons {
|
||||
-webkit-order: 1;
|
||||
-moz-order: 1;
|
||||
-ms-order: 1;
|
||||
order: 1;
|
||||
}
|
||||
.section.main {
|
||||
-webkit-order: 2;
|
||||
-moz-order: 2;
|
||||
-ms-order: 2;
|
||||
order: 2;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section.header {
|
||||
-webkit-order: 0;
|
||||
-moz-order: 0;
|
||||
-ms-order: 0;
|
||||
order: 0;
|
||||
}
|
||||
.section.icons {
|
||||
-webkit-order: 2;
|
||||
-moz-order: 2;
|
||||
-ms-order: 2;
|
||||
order: 2;
|
||||
}
|
||||
.section.main {
|
||||
-webkit-order: 1;
|
||||
-moz-order: 1;
|
||||
-ms-order: 1;
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
.section.header {
|
||||
background-color: #21bb5b;
|
||||
}
|
||||
.section.header .container {
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-moz-justify-content: center;
|
||||
-ms-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.section.header .content {
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
-moz-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
.section.header .name {
|
||||
font-size: 18px;
|
||||
font-family: 'Proxima Nova', 'Helvetica Neue', 'Arial' sans-serif;
|
||||
letter-spacing: -0.005rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-smoothing: antialiased;
|
||||
color: #333333;
|
||||
color: #fefefe;
|
||||
}
|
||||
.section.header nav {
|
||||
font-size: 14px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.section.header nav ul {
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
display: -webkit-inline-flex;
|
||||
display: -moz-inline-flex;
|
||||
display: -ms-inline-flexbox;
|
||||
display: -ms-inline-flex;
|
||||
display: inline-flex;
|
||||
}
|
||||
.section.header nav ul a {
|
||||
margin-right: 12px;
|
||||
}
|
||||
.section.header nav ul a:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.section.header nav ul li {
|
||||
color: #fefefe;
|
||||
-webkit-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
-moz-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
-ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
-o-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
}
|
||||
.section.header nav ul li:hover {
|
||||
color: #fefefe;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section.header {
|
||||
background-color: transparent;
|
||||
}
|
||||
.section.header .container {
|
||||
-webkit-justify-content: flex-start;
|
||||
-moz-justify-content: flex-start;
|
||||
-ms-justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.section.header .content {
|
||||
-webkit-align-items: flex-start;
|
||||
-moz-align-items: flex-start;
|
||||
-ms-align-items: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.section.header .name {
|
||||
color: #333333;
|
||||
}
|
||||
.section.header nav {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.section.header nav ul {
|
||||
text-align: left;
|
||||
}
|
||||
.section.header nav ul li {
|
||||
color: #b7b7b7;
|
||||
}
|
||||
.section.header nav ul li:hover {
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
.section.icons {
|
||||
background-color: #21bb5b;
|
||||
}
|
||||
.section.icons .container {
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-moz-justify-content: center;
|
||||
-ms-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.section.icons .content a {
|
||||
margin-right: 4px;
|
||||
color: #fefefe;
|
||||
-webkit-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
-moz-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
-ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
-o-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
|
||||
}
|
||||
.section.icons .content a:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.section.icons .content a:hover {
|
||||
color: #fefefe;
|
||||
}
|
||||
.section.icons .content a .icon {
|
||||
font-size: 16px;
|
||||
}
|
||||
.section.icons .content a .icon.larger {
|
||||
font-size: 18px;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section.icons {
|
||||
background-color: transparent;
|
||||
}
|
||||
.section.icons .container {
|
||||
-webkit-justify-content: flex-start;
|
||||
-moz-justify-content: flex-start;
|
||||
-ms-justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.section.icons .content a {
|
||||
color: #b7b7b7;
|
||||
}
|
||||
.section.icons .content a:hover {
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
.section.main .container {
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: flex-start;
|
||||
-moz-justify-content: flex-start;
|
||||
-ms-justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.section.main .content {
|
||||
color: #333333;
|
||||
font-size: 16px;
|
||||
}
|
||||
.section.main .content .page-heading {
|
||||
font-size: 18px;
|
||||
font-family: 'Proxima Nova', 'Helvetica Neue', 'Arial' sans-serif;
|
||||
letter-spacing: -0.005rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-smoothing: antialiased;
|
||||
color: #333333;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.section.main .content .front-matter .page-heading {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.section.main .content .front-matter .meta {
|
||||
font-size: 14px;
|
||||
color: #b7b7b7;
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.section.main .content .front-matter .date,
|
||||
.section.main .content .front-matter .word-count,
|
||||
.section.main .content .front-matter .reading-time .middot {
|
||||
display: none;
|
||||
}
|
||||
.section.main .content .front-matter .middot {
|
||||
font-size: 6px;
|
||||
margin: 0 6px;
|
||||
display: inline;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.section.main .content .front-matter .middot:before {
|
||||
content: "•";
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section.main .content .front-matter .date,
|
||||
.section.main .content .front-matter .word-count,
|
||||
.section.main .content .front-matter .reading-time .middot {
|
||||
display: initial;
|
||||
}
|
||||
}
|
||||
.section.main .container.f04 {
|
||||
-webkit-justify-content: center;
|
||||
-moz-justify-content: center;
|
||||
-ms-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.section.main .container.f04 .content {
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
-moz-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
.section.main .container.f04 .content .num {
|
||||
margin: 30px 0px 30px 0;
|
||||
font-weight: 200;
|
||||
font-family: 'Raleway', 'Helvetica Neue', 'Arial', sans-serif;
|
||||
font-size: 50px;
|
||||
}
|
||||
.section.main .container.f04 .content .detail {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section.main .container.f04 {
|
||||
-webkit-justify-content: flex-start;
|
||||
-moz-justify-content: flex-start;
|
||||
-ms-justify-content: flex-start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.section.main .container.f04 .content {
|
||||
-webkit-align-items: flex-start;
|
||||
-moz-align-items: flex-start;
|
||||
-ms-align-items: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.section.main .container.f04 .content .num {
|
||||
margin: 0 0 10px 0;
|
||||
font-size: 32px;
|
||||
}
|
||||
.section.main .container.f04 .content .detail {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
.section.main .container .content .post-item {
|
||||
display: -webkit-flex;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
-moz-align-items: center;
|
||||
-ms-align-items: center;
|
||||
align-items: center;
|
||||
list-style: none;
|
||||
}
|
||||
.section.main .container .content .post-item .meta {
|
||||
font-size: 14px;
|
||||
color: #b7b7b7;
|
||||
min-width: 100px;
|
||||
text-align: right;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.section {
|
||||
padding: 0 20px;
|
||||
}
|
||||
.section.header {
|
||||
padding-top: 32px;
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
.section.icons {
|
||||
padding-top: 0;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
.section.main {
|
||||
padding-top: 32px;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.container {
|
||||
margin: 0 20px;
|
||||
}
|
||||
.section.header {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
.section.icons {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
.section.main {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.section.main.post {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: #21bb5b;
|
||||
}
|
||||
.section.main .content .markdown h1,
|
||||
.section.main .content .markdown h2,
|
||||
.section.main .content .markdown h3,
|
||||
.section.main .content .markdown h4,
|
||||
.section.main .content .markdown h5,
|
||||
.section.main .content .markdown h6 {
|
||||
/* Heading size corresponds on number of #s used */
|
||||
font-size: 18px;
|
||||
font-family: 'Proxima Nova', 'Helvetica Neue', 'Arial' sans-serif;
|
||||
letter-spacing: -0.005rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-smoothing: antialiased;
|
||||
color: #333333;
|
||||
}
|
||||
.section.main .content .markdown h1 {
|
||||
font-size: 1.75rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.section.main .content .markdown h2 {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.section.main .content .markdown h3 {
|
||||
font-size: 1em;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.section.main .content .markdown h4,
|
||||
.section.main .content .markdown h5,
|
||||
.section.main .content .markdown h6 {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
letter-spacing: none;
|
||||
text-transform: none;
|
||||
}
|
||||
.section.main .content .markdown code,
|
||||
.section.main .content .markdown pre {
|
||||
font-family: 'Ubuntu Mono', 'Menlo', monospace;
|
||||
font-size: 15px;
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
.section.main .content .markdown code {
|
||||
/* enclosed by single backtick (`) */
|
||||
padding: .15em .5em;
|
||||
color: #a10c31;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.section.main .content .markdown pre {
|
||||
/* Hugo specific: consider using the 'highlight' shortcode */
|
||||
display: block;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
padding: 1rem;
|
||||
line-height: 1.5em;
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.section.main .content .markdown pre code {
|
||||
/* enclosed by 4 backticks (````) */
|
||||
padding: 0;
|
||||
font-size: 15px;
|
||||
}
|
||||
.section.main .content .markdown p {
|
||||
/* Invoked by line break */
|
||||
font-size: 1rem;
|
||||
margin-top: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.section.main .content .markdown ul,
|
||||
.section.main .content .markdown ol,
|
||||
.section.main .content .markdown dl {
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.section.main .content .markdown dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
.section.main .content .markdown dd {
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
.section.main .content .markdown ul {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
.section.main .content .markdown li {
|
||||
list-style-type: disc;
|
||||
list-style-position: inside;
|
||||
}
|
||||
.section.main .content .markdown hr {
|
||||
position: relative;
|
||||
margin: 1.75rem 0;
|
||||
border: 0;
|
||||
border-top: 1px solid #d1d1d1;
|
||||
border-top: 1px solid #eaeaea;
|
||||
}
|
||||
.section.main .content .markdown abbr {
|
||||
font-size: 0.85rem;
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.section.main .content .markdown abbr[title] {
|
||||
cursor: help;
|
||||
border-bottom: 1px dotted #d1d1d1;
|
||||
}
|
||||
.section.main .content .markdown blockquote {
|
||||
padding: .5rem 1rem;
|
||||
margin: .8rem 0;
|
||||
color: #7a7a7a;
|
||||
border-left: .25rem solid #e5e5e5;
|
||||
}
|
||||
.section.main .content .markdown blockquote p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@media (min-width: 550px) {
|
||||
.section.main .content .markdown blockquote {
|
||||
padding-right: 5rem;
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
}
|
||||
.section.main .content .markdown img {
|
||||
display: block;
|
||||
margin: 0 0 1rem;
|
||||
max-width: 100%;
|
||||
}
|
||||
.section.main .content .markdown table {
|
||||
margin-bottom: 1rem;
|
||||
width: 100%;
|
||||
border: 1px solid #e5e5e5;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.section.main .content .markdown td,
|
||||
.section.main .content .markdown th {
|
||||
padding: .25rem .5rem;
|
||||
border: 1px solid #e5e5e5;
|
||||
}
|
||||
.section.main .content .markdown tbody tr:nth-child(odd) td,
|
||||
.section.main .content .markdown tbody tr:nth-child(odd) th {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
9
static/css/navlist.css
Normal file
9
static/css/navlist.css
Normal file
@@ -0,0 +1,9 @@
|
||||
.section.header nav ul li[data-switch-original]::after {
|
||||
content: attr(data-switch-original);
|
||||
}
|
||||
|
||||
@media (min-width: 550px) {
|
||||
.section.header nav ul li[data-switch-change]::after {
|
||||
content: attr(data-switch-change);
|
||||
}
|
||||
}
|
||||
61
static/css/pygments.css
Normal file
61
static/css/pygments.css
Normal file
@@ -0,0 +1,61 @@
|
||||
.hll { background-color: #ffffcc }
|
||||
.c { color: #999988; font-style: italic } /* Comment */
|
||||
.err { color: #a61717; background-color: #e3d2d2 } /* Error */
|
||||
.k { color: #000000; font-weight: bold } /* Keyword */
|
||||
.o { color: #000000; font-weight: bold } /* Operator */
|
||||
.cm { color: #999988; font-style: italic } /* Comment.Multiline */
|
||||
.cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
|
||||
.c1 { color: #999988; font-style: italic } /* Comment.Single */
|
||||
.cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
|
||||
.gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
|
||||
.ge { color: #000000; font-style: italic } /* Generic.Emph */
|
||||
.gr { color: #aa0000 } /* Generic.Error */
|
||||
.gh { color: #999999 } /* Generic.Heading */
|
||||
.gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
|
||||
.go { color: #888888 } /* Generic.Output */
|
||||
.gp { color: #555555 } /* Generic.Prompt */
|
||||
.gs { font-weight: bold } /* Generic.Strong */
|
||||
.gu { color: #aaaaaa } /* Generic.Subheading */
|
||||
.gt { color: #aa0000 } /* Generic.Traceback */
|
||||
.kc { color: #000000; font-weight: bold } /* Keyword.Constant */
|
||||
.kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
|
||||
.kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
|
||||
.kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
|
||||
.kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
|
||||
.kt { color: #445588; font-weight: bold } /* Keyword.Type */
|
||||
.m { color: #009999 } /* Literal.Number */
|
||||
.s { color: #d01040 } /* Literal.String */
|
||||
.na { color: #008080 } /* Name.Attribute */
|
||||
.nb { color: #0086B3 } /* Name.Builtin */
|
||||
.nc { color: #445588; font-weight: bold } /* Name.Class */
|
||||
.no { color: #008080 } /* Name.Constant */
|
||||
.nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
|
||||
.ni { color: #800080 } /* Name.Entity */
|
||||
.ne { color: #990000; font-weight: bold } /* Name.Exception */
|
||||
.nf { color: #990000; font-weight: bold } /* Name.Function */
|
||||
.nl { color: #990000; font-weight: bold } /* Name.Label */
|
||||
.nn { color: #555555 } /* Name.Namespace */
|
||||
.nt { color: #000080 } /* Name.Tag */
|
||||
.nv { color: #008080 } /* Name.Variable */
|
||||
.ow { color: #000000; font-weight: bold } /* Operator.Word */
|
||||
.w { color: #bbbbbb } /* Text.Whitespace */
|
||||
.mf { color: #009999 } /* Literal.Number.Float */
|
||||
.mh { color: #009999 } /* Literal.Number.Hex */
|
||||
.mi { color: #009999 } /* Literal.Number.Integer */
|
||||
.mo { color: #009999 } /* Literal.Number.Oct */
|
||||
.sb { color: #d01040 } /* Literal.String.Backtick */
|
||||
.sc { color: #d01040 } /* Literal.String.Char */
|
||||
.sd { color: #d01040 } /* Literal.String.Doc */
|
||||
.s2 { color: #d01040 } /* Literal.String.Double */
|
||||
.se { color: #d01040 } /* Literal.String.Escape */
|
||||
.sh { color: #d01040 } /* Literal.String.Heredoc */
|
||||
.si { color: #d01040 } /* Literal.String.Interpol */
|
||||
.sx { color: #d01040 } /* Literal.String.Other */
|
||||
.sr { color: #009926 } /* Literal.String.Regex */
|
||||
.s1 { color: #d01040 } /* Literal.String.Single */
|
||||
.ss { color: #990073 } /* Literal.String.Symbol */
|
||||
.bp { color: #999999 } /* Name.Builtin.Pseudo */
|
||||
.vc { color: #008080 } /* Name.Variable.Class */
|
||||
.vg { color: #008080 } /* Name.Variable.Global */
|
||||
.vi { color: #008080 } /* Name.Variable.Instance */
|
||||
.il { color: #009999 } /* Literal.Number.Integer.Long */
|
||||
48
static/css/reset.css
Normal file
48
static/css/reset.css
Normal file
@@ -0,0 +1,48 @@
|
||||
/* http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
*/
|
||||
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
418
static/css/skeleton.css
vendored
Normal file
418
static/css/skeleton.css
vendored
Normal file
@@ -0,0 +1,418 @@
|
||||
/*
|
||||
* Skeleton V2.0.4
|
||||
* Copyright 2014, Dave Gamache
|
||||
* www.getskeleton.com
|
||||
* Free to use under the MIT license.
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
* 12/29/2014
|
||||
*/
|
||||
|
||||
|
||||
/* Table of contents
|
||||
––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||
- Grid
|
||||
- Base Styles
|
||||
- Typography
|
||||
- Links
|
||||
- Buttons
|
||||
- Forms
|
||||
- Lists
|
||||
- Code
|
||||
- Tables
|
||||
- Spacing
|
||||
- Utilities
|
||||
- Clearing
|
||||
- Media Queries
|
||||
*/
|
||||
|
||||
|
||||
/* Grid
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box; }
|
||||
.column,
|
||||
.columns {
|
||||
width: 100%;
|
||||
float: left;
|
||||
box-sizing: border-box; }
|
||||
|
||||
/* For devices larger than 400px */
|
||||
@media (min-width: 400px) {
|
||||
.container {
|
||||
width: 85%;
|
||||
padding: 0; }
|
||||
}
|
||||
|
||||
/* For devices larger than 550px */
|
||||
@media (min-width: 550px) {
|
||||
.container {
|
||||
width: 80%; }
|
||||
.column,
|
||||
.columns {
|
||||
margin-left: 4%; }
|
||||
.column:first-child,
|
||||
.columns:first-child {
|
||||
margin-left: 0; }
|
||||
|
||||
.one.column,
|
||||
.one.columns { width: 4.66666666667%; }
|
||||
.two.columns { width: 13.3333333333%; }
|
||||
.three.columns { width: 22%; }
|
||||
.four.columns { width: 30.6666666667%; }
|
||||
.five.columns { width: 39.3333333333%; }
|
||||
.six.columns { width: 48%; }
|
||||
.seven.columns { width: 56.6666666667%; }
|
||||
.eight.columns { width: 65.3333333333%; }
|
||||
.nine.columns { width: 74.0%; }
|
||||
.ten.columns { width: 82.6666666667%; }
|
||||
.eleven.columns { width: 91.3333333333%; }
|
||||
.twelve.columns { width: 100%; margin-left: 0; }
|
||||
|
||||
.one-third.column { width: 30.6666666667%; }
|
||||
.two-thirds.column { width: 65.3333333333%; }
|
||||
|
||||
.one-half.column { width: 48%; }
|
||||
|
||||
/* Offsets */
|
||||
.offset-by-one.column,
|
||||
.offset-by-one.columns { margin-left: 8.66666666667%; }
|
||||
.offset-by-two.column,
|
||||
.offset-by-two.columns { margin-left: 17.3333333333%; }
|
||||
.offset-by-three.column,
|
||||
.offset-by-three.columns { margin-left: 26%; }
|
||||
.offset-by-four.column,
|
||||
.offset-by-four.columns { margin-left: 34.6666666667%; }
|
||||
.offset-by-five.column,
|
||||
.offset-by-five.columns { margin-left: 43.3333333333%; }
|
||||
.offset-by-six.column,
|
||||
.offset-by-six.columns { margin-left: 52%; }
|
||||
.offset-by-seven.column,
|
||||
.offset-by-seven.columns { margin-left: 60.6666666667%; }
|
||||
.offset-by-eight.column,
|
||||
.offset-by-eight.columns { margin-left: 69.3333333333%; }
|
||||
.offset-by-nine.column,
|
||||
.offset-by-nine.columns { margin-left: 78.0%; }
|
||||
.offset-by-ten.column,
|
||||
.offset-by-ten.columns { margin-left: 86.6666666667%; }
|
||||
.offset-by-eleven.column,
|
||||
.offset-by-eleven.columns { margin-left: 95.3333333333%; }
|
||||
|
||||
.offset-by-one-third.column,
|
||||
.offset-by-one-third.columns { margin-left: 34.6666666667%; }
|
||||
.offset-by-two-thirds.column,
|
||||
.offset-by-two-thirds.columns { margin-left: 69.3333333333%; }
|
||||
|
||||
.offset-by-one-half.column,
|
||||
.offset-by-one-half.columns { margin-left: 52%; }
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* Base Styles
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
/* NOTE
|
||||
html is set to 62.5% so that all the REM measurements throughout Skeleton
|
||||
are based on 10px sizing. So basically 1.5rem = 15px :) */
|
||||
html {
|
||||
font-size: 62.5%; }
|
||||
body {
|
||||
font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
|
||||
line-height: 1.6;
|
||||
font-weight: 400;
|
||||
font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color: #222; }
|
||||
|
||||
|
||||
/* Typography
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 2rem;
|
||||
font-weight: 300; }
|
||||
h1 { font-size: 4.0rem; line-height: 1.2; letter-spacing: -.1rem;}
|
||||
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
|
||||
h3 { font-size: 3.0rem; line-height: 1.3; letter-spacing: -.1rem; }
|
||||
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
|
||||
h5 { font-size: 1.8rem; line-height: 1.5; letter-spacing: -.05rem; }
|
||||
h6 { font-size: 1.5rem; line-height: 1.6; letter-spacing: 0; }
|
||||
|
||||
/* Larger than phablet */
|
||||
@media (min-width: 550px) {
|
||||
h1 { font-size: 5.0rem; }
|
||||
h2 { font-size: 4.2rem; }
|
||||
h3 { font-size: 3.6rem; }
|
||||
h4 { font-size: 3.0rem; }
|
||||
h5 { font-size: 2.4rem; }
|
||||
h6 { font-size: 1.5rem; }
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: 0; }
|
||||
|
||||
|
||||
/* Links
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
a {
|
||||
color: #1EAEDB; }
|
||||
a:hover {
|
||||
color: #0FA0CE; }
|
||||
|
||||
|
||||
/* Buttons
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.button,
|
||||
button,
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
input[type="button"] {
|
||||
display: inline-block;
|
||||
height: 38px;
|
||||
padding: 0 30px;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
line-height: 38px;
|
||||
letter-spacing: .1rem;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background-color: transparent;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #bbb;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box; }
|
||||
.button:hover,
|
||||
button:hover,
|
||||
input[type="submit"]:hover,
|
||||
input[type="reset"]:hover,
|
||||
input[type="button"]:hover,
|
||||
.button:focus,
|
||||
button:focus,
|
||||
input[type="submit"]:focus,
|
||||
input[type="reset"]:focus,
|
||||
input[type="button"]:focus {
|
||||
color: #333;
|
||||
border-color: #888;
|
||||
outline: 0; }
|
||||
.button.button-primary,
|
||||
button.button-primary,
|
||||
input[type="submit"].button-primary,
|
||||
input[type="reset"].button-primary,
|
||||
input[type="button"].button-primary {
|
||||
color: #FFF;
|
||||
background-color: #33C3F0;
|
||||
border-color: #33C3F0; }
|
||||
.button.button-primary:hover,
|
||||
button.button-primary:hover,
|
||||
input[type="submit"].button-primary:hover,
|
||||
input[type="reset"].button-primary:hover,
|
||||
input[type="button"].button-primary:hover,
|
||||
.button.button-primary:focus,
|
||||
button.button-primary:focus,
|
||||
input[type="submit"].button-primary:focus,
|
||||
input[type="reset"].button-primary:focus,
|
||||
input[type="button"].button-primary:focus {
|
||||
color: #FFF;
|
||||
background-color: #1EAEDB;
|
||||
border-color: #1EAEDB; }
|
||||
|
||||
|
||||
/* Forms
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
input[type="email"],
|
||||
input[type="number"],
|
||||
input[type="search"],
|
||||
input[type="text"],
|
||||
input[type="tel"],
|
||||
input[type="url"],
|
||||
input[type="password"],
|
||||
textarea,
|
||||
select {
|
||||
height: 38px;
|
||||
padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
|
||||
background-color: #fff;
|
||||
border: 1px solid #D1D1D1;
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box; }
|
||||
/* Removes awkward default styles on some inputs for iOS */
|
||||
input[type="email"],
|
||||
input[type="number"],
|
||||
input[type="search"],
|
||||
input[type="text"],
|
||||
input[type="tel"],
|
||||
input[type="url"],
|
||||
input[type="password"],
|
||||
textarea {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none; }
|
||||
textarea {
|
||||
min-height: 65px;
|
||||
padding-top: 6px;
|
||||
padding-bottom: 6px; }
|
||||
input[type="email"]:focus,
|
||||
input[type="number"]:focus,
|
||||
input[type="search"]:focus,
|
||||
input[type="text"]:focus,
|
||||
input[type="tel"]:focus,
|
||||
input[type="url"]:focus,
|
||||
input[type="password"]:focus,
|
||||
textarea:focus,
|
||||
select:focus {
|
||||
border: 1px solid #33C3F0;
|
||||
outline: 0; }
|
||||
label,
|
||||
legend {
|
||||
display: block;
|
||||
margin-bottom: .5rem;
|
||||
font-weight: 600; }
|
||||
fieldset {
|
||||
padding: 0;
|
||||
border-width: 0; }
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
display: inline; }
|
||||
label > .label-body {
|
||||
display: inline-block;
|
||||
margin-left: .5rem;
|
||||
font-weight: normal; }
|
||||
|
||||
|
||||
/* Lists
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
ul {
|
||||
list-style: circle inside; }
|
||||
ol {
|
||||
list-style: decimal inside; }
|
||||
ol, ul {
|
||||
padding-left: 0;
|
||||
margin-top: 0; }
|
||||
ul ul,
|
||||
ul ol,
|
||||
ol ol,
|
||||
ol ul {
|
||||
margin: 1.5rem 0 1.5rem 3rem;
|
||||
font-size: 90%; }
|
||||
li {
|
||||
margin-bottom: 1rem; }
|
||||
|
||||
|
||||
/* Code
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
code {
|
||||
padding: .2rem .5rem;
|
||||
margin: 0 .2rem;
|
||||
font-size: 90%;
|
||||
white-space: nowrap;
|
||||
background: #F1F1F1;
|
||||
border: 1px solid #E1E1E1;
|
||||
border-radius: 4px; }
|
||||
pre > code {
|
||||
display: block;
|
||||
padding: 1rem 1.5rem;
|
||||
white-space: pre; }
|
||||
|
||||
|
||||
/* Tables
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
th,
|
||||
td {
|
||||
padding: 12px 15px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #E1E1E1; }
|
||||
th:first-child,
|
||||
td:first-child {
|
||||
padding-left: 0; }
|
||||
th:last-child,
|
||||
td:last-child {
|
||||
padding-right: 0; }
|
||||
|
||||
|
||||
/* Spacing
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
button,
|
||||
.button {
|
||||
margin-bottom: 1rem; }
|
||||
input,
|
||||
textarea,
|
||||
select,
|
||||
fieldset {
|
||||
margin-bottom: 1.5rem; }
|
||||
pre,
|
||||
blockquote,
|
||||
dl,
|
||||
figure,
|
||||
table,
|
||||
p,
|
||||
ul,
|
||||
ol,
|
||||
form {
|
||||
margin-bottom: 2.5rem; }
|
||||
|
||||
|
||||
/* Utilities
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
.u-full-width {
|
||||
width: 100%;
|
||||
box-sizing: border-box; }
|
||||
.u-max-full-width {
|
||||
max-width: 100%;
|
||||
box-sizing: border-box; }
|
||||
.u-pull-right {
|
||||
float: right; }
|
||||
.u-pull-left {
|
||||
float: left; }
|
||||
|
||||
|
||||
/* Misc
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
hr {
|
||||
margin-top: 3rem;
|
||||
margin-bottom: 3.5rem;
|
||||
border-width: 0;
|
||||
border-top: 1px solid #E1E1E1; }
|
||||
|
||||
|
||||
/* Clearing
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
/* Self Clearing Goodness */
|
||||
.container:after,
|
||||
.row:after,
|
||||
.u-cf {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both; }
|
||||
|
||||
|
||||
/* Media Queries
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
/*
|
||||
Note: The best way to structure the use of media queries is to create the queries
|
||||
near the relevant code. For example, if you wanted to change the styles for buttons
|
||||
on small devices, paste the mobile query code up in the buttons section and style it
|
||||
there.
|
||||
*/
|
||||
|
||||
|
||||
/* Larger than mobile */
|
||||
@media (min-width: 400px) {}
|
||||
|
||||
/* Larger than phablet (also point when grid becomes active) */
|
||||
@media (min-width: 550px) {}
|
||||
|
||||
/* Larger than tablet */
|
||||
@media (min-width: 750px) {}
|
||||
|
||||
/* Larger than desktop */
|
||||
@media (min-width: 1000px) {}
|
||||
|
||||
/* Larger than Desktop HD */
|
||||
@media (min-width: 1200px) {}
|
||||
BIN
static/img/favicon.ico
Normal file
BIN
static/img/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 361 KiB |
11
theme.toml
Normal file
11
theme.toml
Normal file
@@ -0,0 +1,11 @@
|
||||
name = "Cocoa"
|
||||
license = "MIT"
|
||||
description = "Clear typography and disturbance-free reading"
|
||||
homepage = "https://github.com/nishanths"
|
||||
tags = ["proxima-nova", "minimal", "clear"]
|
||||
features = ["blog", "themes", "responsive", "404"]
|
||||
min_version = 0.1
|
||||
|
||||
[author]
|
||||
name = "Nishanth Shanmugham"
|
||||
homepage = "https://github.com/nishanths"
|
||||
Reference in New Issue
Block a user