Implement jekyll-now design

This commit is contained in:
Jesper Hess 2017-02-11 11:58:41 +01:00
parent d68318d659
commit 172040906a
Signed by untrusted user: graffen
GPG key ID: 351A89E40D763F0F
23 changed files with 648 additions and 17 deletions

View file

@ -19,6 +19,7 @@ gem "jekyll", "3.4.0"
group :jekyll_plugins do group :jekyll_plugins do
gem "jekyll-feed", "~> 0.6" gem "jekyll-feed", "~> 0.6"
gem "jekyll-livereload" gem "jekyll-livereload"
gem "jekyll-sitemap"
end end
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem # Windows does not include zoneinfo files, so bundle the tzinfo-data gem

View file

@ -13,19 +13,22 @@
# you will see them accessed via {{ site.title }}, {{ site.email }}, and so on. # you will see them accessed via {{ site.title }}, {{ site.email }}, and so on.
# You can create any custom variable you would like, and they will be accessible # You can create any custom variable you would like, and they will be accessible
# in the templates via {{ site.myvariable }}. # in the templates via {{ site.myvariable }}.
title: data.coop name: data.coop
email: kontakt@data.coop email: kontakt@data.coop
description: > # this means to ignore newlines until "baseurl:" description: > # this means to ignore newlines until "baseurl:"
data.coop er en forening hvis primære formål er, at passe på medlemmernes data. data.coop er en forening hvis primære formål er, at passe på medlemmernes data.
baseurl: "" # the subpath of your site, e.g. /blog baseurl: "" # the subpath of your site, e.g. /blog
url: "" # the base hostname & protocol for your site, e.g. http://example.com url: "" # the base hostname & protocol for your site, e.g. http://example.com
avatar: https://raw.githubusercontent.com/barryclark/jekyll-now/master/images/jekyll-logo.png
# Build settings # Build settings
markdown: kramdown markdown: kramdown
gems: gems:
- jekyll-feed - jekyll-feed
- jekyll-sitemap
exclude: exclude:
- Gemfile - Gemfile
- Gemfile.lock - Gemfile.lock
- docker-compose.yml - docker-compose.yml
include: ['_pages']

16
_includes/analytics.html Normal file
View file

@ -0,0 +1,16 @@
{% if site.google_analytics %}
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', '{{ site.google_analytics }}', 'auto');
ga('send', 'pageview', {
'page': '{{ site.baseurl }}{{ page.url }}',
'title': '{{ page.title | replace: "'", "\\'" }}'
});
</script>
<!-- End Google Analytics -->
{% endif %}

17
_includes/disqus.html Normal file
View file

@ -0,0 +1,17 @@
{% if site.disqus %}
<div class="comments">
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = '{{ site.disqus }}';
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
</div>
{% endif %}

18
_includes/meta.html Normal file
View file

@ -0,0 +1,18 @@
<meta charset="utf-8" />
<meta content='text/html; charset=utf-8' http-equiv='Content-Type'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'>
{% if page.excerpt %}
<meta name="description" content="{{ page.excerpt| strip_html }}" />
<meta property="og:description" content="{{ page.excerpt| strip_html }}" />
{% else %}
<meta name="description" content="{{ site.description }}">
<meta property="og:description" content="{{ site.description }}" />
{% endif %}
<meta name="author" content="{{ site.name }}" />
{% if page.title %}
<meta property="og:title" content="{{ page.title }}" />
<meta property="twitter:title" content="{{ page.title }}" />
{% endif %}

13
_includes/svg-icons.html Normal file
View file

@ -0,0 +1,13 @@
{% if site.footer-links.dribbble %}<a href="https://dribbble.com/{{ site.footer-links.dribbble }}"><i class="svg-icon dribbble"></i></a>{% endif %}
{% if site.footer-links.email %}<a href="mailto:{{ site.footer-links.email }}"><i class="svg-icon email"></i></a>{% endif %}
{% if site.footer-links.facebook %}<a href="https://www.facebook.com/{{ site.footer-links.facebook }}"><i class="svg-icon facebook"></i></a>{% endif %}
{% if site.footer-links.flickr %}<a href="https://www.flickr.com/{{ site.footer-links.flickr }}"><i class="svg-icon flickr"></i></a>{% endif %}
{% if site.footer-links.github %}<a href="https://github.com/{{ site.footer-links.github }}"><i class="svg-icon github"></i></a>{% endif %}
{% if site.footer-links.instagram %}<a href="https://instagram.com/{{ site.footer-links.instagram }}"><i class="svg-icon instagram"></i></a>{% endif %}
{% if site.footer-links.linkedin %}<a href="https://www.linkedin.com/in/{{ site.footer-links.linkedin }}"><i class="svg-icon linkedin"></i></a>{% endif %}
{% if site.footer-links.pinterest %}<a href="https://www.pinterest.com/{{ site.footer-links.pinterest }}"><i class="svg-icon pinterest"></i></a>{% endif %}
{% if site.footer-links.rss %}<a href="{{ site.baseurl }}/feed.xml"><i class="svg-icon rss"></i></a>{% endif %}
{% if site.footer-links.twitter %}<a href="https://www.twitter.com/{{ site.footer-links.twitter }}"><i class="svg-icon twitter"></i></a>{% endif %}
{% if site.footer-links.stackoverflow %}<a href="http://stackoverflow.com/{{ site.footer-links.stackoverflow }}"><i class="svg-icon stackoverflow"></i></a>{% endif %}
{% if site.footer-links.youtube %}<a href="https://youtube.com/{{ site.footer-links.youtube }}"><i class="svg-icon youtube"></i></a>{% endif %}
{% if site.footer-links.googleplus %}<a href="https://plus.google.com/{{ site.footer-links.googleplus }}"><i class="svg-icon googleplus"></i></a>{% endif %}

52
_layouts/default.html Normal file
View file

@ -0,0 +1,52 @@
<!DOCTYPE html>
<html>
<head>
<title>{% if page.title %}{{ page.title }} {% endif %}{{ site.name }} {{ site.description }}</title>
{% include meta.html %}
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/style.css" />
<link rel="alternate" type="application/rss+xml" title="{{ site.name }} - {{ site.description }}" href="{{ site.baseurl }}/feed.xml" />
<!-- Created with Jekyll Now - http://github.com/barryclark/jekyll-now -->
</head>
<body>
<div class="wrapper-masthead">
<div class="container">
<header class="masthead clearfix">
<a href="{{ site.baseurl }}/" class="site-avatar"><img src="{{ site.avatar }}" /></a>
<div class="site-info">
<h1 class="site-name"><a href="{{ site.baseurl }}/">{{ site.name }}</a></h1>
<p class="site-description">{{ site.description }}</p>
</div>
<nav>
{% for page in site.pages %}
{% if page.title %}
<a href="{{ page.url | relative-url }}">{{ page.title }}</a>
{% endif %}
{% endfor %}
</nav>
</header>
</div>
</div>
<div id="main" role="main" class="container">
{{ content }}
</div>
<div class="wrapper-footer">
<div class="container">
<footer class="footer">
{% include svg-icons.html %}
</footer>
</div>
</div>
</body>
</html>

12
_layouts/page.html Normal file
View file

@ -0,0 +1,12 @@
---
layout: default
---
<article class="page">
<h1>{{ page.title }}</h1>
<div class="entry">
{{ content }}
</div>
</article>

17
_layouts/post.html Normal file
View file

@ -0,0 +1,17 @@
---
layout: default
---
<article class="post">
<h1>{{ page.title }}</h1>
<div class="entry">
{{ content }}
</div>
<div class="date">
Written on {{ page.date | date: "%B %e, %Y" }}
</div>
{% include disqus.html %}
</article>

View file

@ -2,15 +2,14 @@
layout: page layout: page
title: Vedtægter title: Vedtægter
--- ---
# Vedtægter for datafællesskabet data.coop
## § 1. Navn og tilhørsforhold # § 1. Navn og tilhørsforhold
Foreningens navn er: data.coop Foreningens navn er: data.coop
Foreningens hjemsted er Københavns Kommune, men primært internettet. Foreningens hjemsted er Københavns Kommune, men primært internettet.
## § 2. Formål # § 2. Formål
Foreningen data.coop ønsker at stille digital infrastruktur til rådighed for Foreningen data.coop ønsker at stille digital infrastruktur til rådighed for
sine medlemmer, på en måde hvor foreningens kerneprincipper -- sine medlemmer, på en måde hvor foreningens kerneprincipper --
@ -20,7 +19,7 @@ for sine kerneprincipper, hjælpe folk til at at agere på nettet på forsvarlig
vis, samt samarbejde med andre datafællesskaber/hjælpe andre i gang med lign. vis, samt samarbejde med andre datafællesskaber/hjælpe andre i gang med lign.
foreninger. foreninger.
## § 3. Organisation # § 3. Organisation
Foreningens overordnede ledelse er generalforsamlingen, som består af medlemmer med gyldigt medlemsbevis. Foreningens overordnede ledelse er generalforsamlingen, som består af medlemmer med gyldigt medlemsbevis.
Generalforsamlingen vælger: Generalforsamlingen vælger:
@ -33,7 +32,7 @@ Generalforsamlingen vælger:
Valg til bestyrelsen sker for en periode på 2 år, således at mindst 2 personer Valg til bestyrelsen sker for en periode på 2 år, således at mindst 2 personer
er på valg hvert år. Revisor og suppleanter er på valg hvert år. er på valg hvert år. Revisor og suppleanter er på valg hvert år.
## § 4. Generalforsamlingen # § 4. Generalforsamlingen
Bestyrelsen indkalder generalforsamlingen med mindst 14 dages varsel via Bestyrelsen indkalder generalforsamlingen med mindst 14 dages varsel via
foreningens hjemmeside og mailinglister. Ordinær generalforsamling afholdes foreningens hjemmeside og mailinglister. Ordinær generalforsamling afholdes
@ -48,11 +47,11 @@ generalforsamling skal indeholde følgende punkter:
1. Valg (Jf. § 3) 1. Valg (Jf. § 3)
1. Eventuelt 1. Eventuelt
### § 4.1. Afholdelse af generalforsamlinger og bestyrelsesmøder ## § 4.1. Afholdelse af generalforsamlinger og bestyrelsesmøder
Generalforsamlinger og bestyrelsesmøder kan afholdes på internettet. Generalforsamlinger og bestyrelsesmøder kan afholdes på internettet.
## § 5. Foreningens bestyrelse # § 5. Foreningens bestyrelse
Foreningens daglige ledelse forestås af bestyrelsen (Jf. § 3). Bestyrelsen Foreningens daglige ledelse forestås af bestyrelsen (Jf. § 3). Bestyrelsen
konstituerer sig selv med formand, næstformand og kasserer. Bestyrelsen konstituerer sig selv med formand, næstformand og kasserer. Bestyrelsen
@ -70,7 +69,7 @@ Tegningsret for foreningen har formanden og kassereren, dog ved køb, salg eller
pantsætning af fast ejendom, indgåelse af driftsaftaler samt ved optagelse af pantsætning af fast ejendom, indgåelse af driftsaftaler samt ved optagelse af
lån, af den samlede bestyrelse. lån, af den samlede bestyrelse.
## § 6. Medlemskab # § 6. Medlemskab
Som medlem kan enhver fysisk person optages, som har interesse i at støtte Som medlem kan enhver fysisk person optages, som har interesse i at støtte
foreningens formål. Medlemskab er bindende for et år ad gangen. foreningens formål. Medlemskab er bindende for et år ad gangen.
@ -78,7 +77,7 @@ foreningens formål. Medlemskab er bindende for et år ad gangen.
Bestyrelsen kan ekskludere medlemmer fra foreningen, hvis disse har handlet i Bestyrelsen kan ekskludere medlemmer fra foreningen, hvis disse har handlet i
uoverenstemmelse med Acceptable Use Policy (AUP). uoverenstemmelse med Acceptable Use Policy (AUP).
## § 7. Kontingent/finansiering # § 7. Kontingent/finansiering
De årlige kontingenter fastsættes af generalforsamlingen. De årlige kontingenter fastsættes af generalforsamlingen.
@ -86,12 +85,12 @@ Foreningen kan herudover finansieres ved sponsor- og annoncestøtte samt bidrag
fra offentlige/private virksomheder, fonde, øvrige foreninger/institutioner og fra offentlige/private virksomheder, fonde, øvrige foreninger/institutioner og
private personer, så længe det ikke stiller krav til foreningens dispositioner. private personer, så længe det ikke stiller krav til foreningens dispositioner.
## § 8. Vedtægtsændringer # § 8. Vedtægtsændringer
Vedtægtsændringer kræver et flertal på ¾ af generalforsamlingens fremmødte Vedtægtsændringer kræver et flertal på ¾ af generalforsamlingens fremmødte
medlemmer. medlemmer.
## § 9. Ekstraordinær generalforsamling # § 9. Ekstraordinær generalforsamling
Indkaldelse sker, hvis et flertal af bestyrelsen ønsker det. Indkaldelse sker, hvis et flertal af bestyrelsen ønsker det.
@ -101,11 +100,11 @@ Indkaldelse sker under samme betingelser, som anført i §4.
Dagsorden skal motiveres. Dagsorden skal motiveres.
## § 10. Regnskab # § 10. Regnskab
Regnskabsåret for Foreningen er kalenderåret. Regnskabsåret for Foreningen er kalenderåret.
## § 11. Opløsning # § 11. Opløsning
Opløsning af foreningen kræver et flertal på ¾ af generalforsamlingens eller Opløsning af foreningen kræver et flertal på ¾ af generalforsamlingens eller
den ekstraordinære generalforsamlings fremmødte medlemmer. den ekstraordinære generalforsamlings fremmødte medlemmer.

84
_sass/_highlights.scss Normal file
View file

@ -0,0 +1,84 @@
.highlight {
background-color: #efefef;
padding: 7px 7px 7px 10px;
border: 1px solid #ddd;
-moz-box-shadow: 3px 3px rgba(0,0,0,0.1);
-webkit-box-shadow: 3px 3px rgba(0,0,0,0.1);
box-shadow: 3px 3px rgba(0,0,0,0.1);
margin: 20px 0 20px 0;
overflow: scroll;
}
code {
font-family:'Bitstream Vera Sans Mono','Courier', monospace;
}
.highlight .c { color: #586E75 } /* Comment */
.highlight .err { color: #93A1A1 } /* Error */
.highlight .g { color: #93A1A1 } /* Generic */
.highlight .k { color: #859900 } /* Keyword */
.highlight .l { color: #93A1A1 } /* Literal */
.highlight .n { color: #93A1A1 } /* Name */
.highlight .o { color: #859900 } /* Operator */
.highlight .x { color: #CB4B16 } /* Other */
.highlight .p { color: #93A1A1 } /* Punctuation */
.highlight .cm { color: #586E75 } /* Comment.Multiline */
.highlight .cp { color: #859900 } /* Comment.Preproc */
.highlight .c1 { color: #586E75 } /* Comment.Single */
.highlight .cs { color: #859900 } /* Comment.Special */
.highlight .gd { color: #2AA198 } /* Generic.Deleted */
.highlight .ge { color: #93A1A1; font-style: italic } /* Generic.Emph */
.highlight .gr { color: #DC322F } /* Generic.Error */
.highlight .gh { color: #CB4B16 } /* Generic.Heading */
.highlight .gi { color: #859900 } /* Generic.Inserted */
.highlight .go { color: #93A1A1 } /* Generic.Output */
.highlight .gp { color: #93A1A1 } /* Generic.Prompt */
.highlight .gs { color: #93A1A1; font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #CB4B16 } /* Generic.Subheading */
.highlight .gt { color: #93A1A1 } /* Generic.Traceback */
.highlight .kc { color: #CB4B16 } /* Keyword.Constant */
.highlight .kd { color: #268BD2 } /* Keyword.Declaration */
.highlight .kn { color: #859900 } /* Keyword.Namespace */
.highlight .kp { color: #859900 } /* Keyword.Pseudo */
.highlight .kr { color: #268BD2 } /* Keyword.Reserved */
.highlight .kt { color: #DC322F } /* Keyword.Type */
.highlight .ld { color: #93A1A1 } /* Literal.Date */
.highlight .m { color: #2AA198 } /* Literal.Number */
.highlight .s { color: #2AA198 } /* Literal.String */
.highlight .na { color: #93A1A1 } /* Name.Attribute */
.highlight .nb { color: #B58900 } /* Name.Builtin */
.highlight .nc { color: #268BD2 } /* Name.Class */
.highlight .no { color: #CB4B16 } /* Name.Constant */
.highlight .nd { color: #268BD2 } /* Name.Decorator */
.highlight .ni { color: #CB4B16 } /* Name.Entity */
.highlight .ne { color: #CB4B16 } /* Name.Exception */
.highlight .nf { color: #268BD2 } /* Name.Function */
.highlight .nl { color: #93A1A1 } /* Name.Label */
.highlight .nn { color: #93A1A1 } /* Name.Namespace */
.highlight .nx { color: #555 } /* Name.Other */
.highlight .py { color: #93A1A1 } /* Name.Property */
.highlight .nt { color: #268BD2 } /* Name.Tag */
.highlight .nv { color: #268BD2 } /* Name.Variable */
.highlight .ow { color: #859900 } /* Operator.Word */
.highlight .w { color: #93A1A1 } /* Text.Whitespace */
.highlight .mf { color: #2AA198 } /* Literal.Number.Float */
.highlight .mh { color: #2AA198 } /* Literal.Number.Hex */
.highlight .mi { color: #2AA198 } /* Literal.Number.Integer */
.highlight .mo { color: #2AA198 } /* Literal.Number.Oct */
.highlight .sb { color: #586E75 } /* Literal.String.Backtick */
.highlight .sc { color: #2AA198 } /* Literal.String.Char */
.highlight .sd { color: #93A1A1 } /* Literal.String.Doc */
.highlight .s2 { color: #2AA198 } /* Literal.String.Double */
.highlight .se { color: #CB4B16 } /* Literal.String.Escape */
.highlight .sh { color: #93A1A1 } /* Literal.String.Heredoc */
.highlight .si { color: #2AA198 } /* Literal.String.Interpol */
.highlight .sx { color: #2AA198 } /* Literal.String.Other */
.highlight .sr { color: #DC322F } /* Literal.String.Regex */
.highlight .s1 { color: #2AA198 } /* Literal.String.Single */
.highlight .ss { color: #2AA198 } /* Literal.String.Symbol */
.highlight .bp { color: #268BD2 } /* Name.Builtin.Pseudo */
.highlight .vc { color: #268BD2 } /* Name.Variable.Class */
.highlight .vg { color: #268BD2 } /* Name.Variable.Global */
.highlight .vi { color: #268BD2 } /* Name.Variable.Instance */
.highlight .il { color: #2AA198 } /* Literal.Number.Integer.Long */

53
_sass/_reset.scss Normal file
View file

@ -0,0 +1,53 @@
/***************/
/* MEYER RESET */
/***************/
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;
}
// Apply a natural box layout model to all elements
// from: http://www.paulirish.com/2012/box-sizing-border-box-ftw/
*, *:before, *:after {
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

20
_sass/_svg-icons.scss Normal file

File diff suppressed because one or more lines are too long

27
_sass/_variables.scss Normal file
View file

@ -0,0 +1,27 @@
//
// VARIABLES
//
// Colors
$blue: #4183C4;
// Grays
$black: #000;
$darkerGray: #222;
$darkGray: #333;
$gray: #666;
$lightGray: #eee;
$white: #fff;
// Font stacks
$helvetica: Helvetica, Arial, sans-serif;
$helveticaNeue: "Helvetica Neue", Helvetica, Arial, sans-serif;
$georgia: Georgia, serif;
// Mobile breakpoints
@mixin mobile {
@media screen and (max-width: 640px) {
@content;
}
}

BIN
images/404.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

BIN
images/config.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

BIN
images/first-post.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

BIN
images/jekyll-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 134 KiB

BIN
images/step1.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 954 KiB

View file

@ -1,8 +1,18 @@
--- ---
layout: home layout: page
--- ---
data.coop er et datakollektiv hvor vi, i form af en forening, arbejder på, at kunne passe bedre på hinandens data. # Velkommen til data.coop
Foreningen holdt stiftende generalforsamling i 2014 og blev "genstartet" i 2016. Vi er en forening som har formålet, at passe på medlemmernes data. Vores kerneprincipper er
- Privatlivsbeskyttelse
- Kryptering
- Decentralisering
- Zero-knowledge
Ud fra de kerneprincipper vil vi med tiden udbyde onlinetjenester til medlemmerne. Hovedtanken er,
at vi som udgangspunkt stoler mere på hinanden end på "de store" som f.eks. Google, Microsoft eller Facebook.
Foreningen holdt stiftende generalforsamling i 2014 og blev genstartet i 2016.
Foreningen arbejder nu på, at få gang i aktiviteterne. Inden længe vil du her på siden kunne læse om, Foreningen arbejder nu på, at få gang i aktiviteterne. Inden længe vil du her på siden kunne læse om,
hvad du kan få ud af et medlemsskab samt detaljer om, hvordan du kan melde dig ind og være med til at opbygge noget fedt. hvad du kan få ud af et medlemsskab samt detaljer om, hvordan du kan melde dig ind og være med til at opbygge noget fedt.

289
style.scss Normal file
View file

@ -0,0 +1,289 @@
---
---
//
// IMPORTS
//
@import "reset";
@import "variables";
// Syntax highlighting @import is at the bottom of this file
/**************/
/* BASE RULES */
/**************/
html {
font-size: 100%;
}
body {
background: $white;
font: 18px/1.4 $helvetica;
color: $darkGray;
}
.container {
margin: 0 auto;
max-width: 740px;
padding: 0 10px;
width: 100%;
}
h1, h2, h3, h4, h5, h6 {
font-family: $helveticaNeue;
color: $darkerGray;
font-weight: bold;
line-height: 1.7;
margin: 1em 0 15px;
padding: 0;
@include mobile {
line-height: 1.4;
}
}
h1 {
font-size: 30px;
a {
color: inherit;
}
}
h2 {
font-size: 24px;
}
h3 {
font-size: 20px;
}
h4 {
font-size: 18px;
color: $gray;
}
p {
margin: 15px 0;
}
a {
color: $blue;
text-decoration: none;
cursor: pointer;
&:hover, &:active {
color: $blue;
}
}
ul, ol {
margin: 15px 0;
padding-left: 30px;
}
ul {
list-style-type: disc;
}
ol {
list-style-type: decimal;
}
ol ul, ul ol, ul ul, ol ol {
margin: 0;
}
ul ul, ol ul {
list-style-type: circle;
}
em, i {
font-style: italic;
}
strong, b {
font-weight: bold;
}
img {
max-width: 100%;
}
// Fixes images in popup boxes from Google Translate
.gmnoprint img {
max-width: none;
}
.date {
font-style: italic;
color: $gray;
}
// Specify the color of the selection
::-moz-selection {
color: $black;
background: $lightGray;
}
::selection {
color: $black;
background: $lightGray;
}
// Nicolas Gallagher's micro clearfix hack
// http://nicolasgallagher.com/micro-clearfix-hack/
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
/*********************/
/* LAYOUT / SECTIONS */
/*********************/
//
// .masthead
//
.wrapper-masthead {
margin-bottom: 50px;
}
.masthead {
padding: 20px 0;
border-bottom: 1px solid $lightGray;
@include mobile {
text-align: center;
}
}
.site-avatar {
float: left;
width: 70px;
height: 70px;
margin-right: 15px;
@include mobile {
float: none;
display: block;
margin: 0 auto;
}
img {
border-radius: 5px;
}
}
.site-info {
float: left;
@include mobile {
float: none;
display: block;
margin: 0 auto;
}
}
.site-name {
margin: 0;
color: $darkGray;
cursor: pointer;
font-family: $helveticaNeue;
font-weight: 300;
font-size: 28px;
letter-spacing: 1px;
}
.site-description {
margin: -5px 0 0 0;
color: $gray;
font-size: 16px;
@include mobile {
margin: 3px 0;
}
}
nav {
float: right;
margin-top: 23px; // @TODO: Vertically middle align
font-family: $helveticaNeue;
font-size: 18px;
@include mobile {
float: none;
margin-top: 9px;
display: block;
font-size: 16px;
}
a {
margin-left: 20px;
color: $darkGray;
text-align: right;
font-weight: 300;
letter-spacing: 1px;
@include mobile {
margin: 0 10px;
color: $blue;
}
}
}
//
// .main
//
.posts > .post {
padding-bottom: 2em;
border-bottom: 1px solid $lightGray;
}
.posts > .post:last-child {
padding-bottom: 1em;
border-bottom: none;
}
.post {
blockquote {
margin: 1.8em .8em;
border-left: 2px solid $gray;
padding: 0.1em 1em;
color: $gray;
font-size: 22px;
font-style: italic;
}
.comments {
margin-top: 10px;
}
.read-more {
text-transform: uppercase;
font-size: 15px;
}
}
.wrapper-footer {
margin-top: 50px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background-color: $lightGray;
}
footer {
padding: 20px 0;
text-align: center;
}
// Settled on moving the import of syntax highlighting to the bottom of the CSS
// ... Otherwise it really bloats up the top of the CSS file and makes it difficult to find the start
@import "highlights";
@import "svg-icons";