wip
This commit is contained in:
parent
9212cdb015
commit
13a3c1c866
18
assets/less/base/base.less
Normal file
18
assets/less/base/base.less
Normal file
|
@ -0,0 +1,18 @@
|
|||
h1, h2, h3 {
|
||||
@apply .mb-2;
|
||||
}
|
||||
|
||||
.content {
|
||||
h2,
|
||||
h3 {
|
||||
@apply .mt-6;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ul,
|
||||
ol,
|
||||
table,
|
||||
pre {
|
||||
@apply .mb-4;
|
||||
}
|
7
assets/less/base/images.less
Normal file
7
assets/less/base/images.less
Normal file
|
@ -0,0 +1,7 @@
|
|||
img.with-border {
|
||||
@apply .border .border-solid .border-grey-light;
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: currentColor;
|
||||
}
|
3
assets/less/components/blockquote.less
Normal file
3
assets/less/components/blockquote.less
Normal file
|
@ -0,0 +1,3 @@
|
|||
blockquote {
|
||||
@apply .border-l-4 .border-blue .pl-4;
|
||||
}
|
13
assets/less/components/button.less
Normal file
13
assets/less/components/button.less
Normal file
|
@ -0,0 +1,13 @@
|
|||
.button {
|
||||
@apply .bg-blue;
|
||||
@apply .inline-block;
|
||||
@apply .rounded;
|
||||
@apply .text-white;
|
||||
@apply .px-4;
|
||||
@apply .py-2;
|
||||
|
||||
&:active,
|
||||
&:hover {
|
||||
@apply .bg-blue-dark;
|
||||
}
|
||||
}
|
3
assets/less/components/link.less
Normal file
3
assets/less/components/link.less
Normal file
|
@ -0,0 +1,3 @@
|
|||
.link {
|
||||
@apply .text-blue;
|
||||
}
|
31
assets/less/components/markdown.less
Normal file
31
assets/less/components/markdown.less
Normal file
|
@ -0,0 +1,31 @@
|
|||
.markdown {
|
||||
p,
|
||||
li {
|
||||
a {
|
||||
@apply .link;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
li {
|
||||
code {
|
||||
@apply .bg-grey-lighter .inline-block .font-mono .text-xs;
|
||||
padding: 1px 3px;
|
||||
}
|
||||
}
|
||||
|
||||
pre code,
|
||||
pre code.hljs,
|
||||
.hljs {
|
||||
@apply .bg-grey-lighter;
|
||||
@apply .block;
|
||||
@apply .border-grey-dark;
|
||||
@apply .border-l-4;
|
||||
@apply .font-mono;
|
||||
@apply .leading-loose;
|
||||
@apply .overflow-x-scroll;
|
||||
@apply .p-4;
|
||||
@apply .rounded;
|
||||
@apply .text-xs;
|
||||
}
|
||||
}
|
16
assets/less/components/note.less
Normal file
16
assets/less/components/note.less
Normal file
|
@ -0,0 +1,16 @@
|
|||
.note {
|
||||
@apply .bg-blue-lighter;
|
||||
@apply .border-blue;
|
||||
@apply .border-l-4;
|
||||
@apply .mb-4;
|
||||
@apply .p-4;
|
||||
@apply .rounded;
|
||||
|
||||
& > *:last-child {
|
||||
@apply .mb-0;
|
||||
}
|
||||
|
||||
p a {
|
||||
@apply .text-black;
|
||||
}
|
||||
}
|
|
@ -1,31 +0,0 @@
|
|||
pre code,
|
||||
pre code.hljs,
|
||||
.hljs {
|
||||
@apply .p-4;
|
||||
@apply .text-sm;
|
||||
@apply .border-l-4;
|
||||
@apply .border-grey-dark;
|
||||
@apply .block;
|
||||
@apply .bg-grey-lighter;
|
||||
@apply .overflow-x-scroll;
|
||||
@apply .font-mono;
|
||||
}
|
||||
|
||||
p,
|
||||
li {
|
||||
code {
|
||||
@apply .bg-grey-lighter .inline-block .font-mono;
|
||||
padding: 1px 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.note {
|
||||
@apply .bg-blue-lighter;
|
||||
@apply .p-4;
|
||||
@apply .border-l-4;
|
||||
@apply .border-blue;
|
||||
}
|
||||
|
||||
.note > *:last-child {
|
||||
@apply .mb-0;
|
||||
}
|
|
@ -1,4 +0,0 @@
|
|||
.about-author {
|
||||
@apply .mr-4 .float-left .rounded-full;
|
||||
width: 75px;
|
||||
}
|
|
@ -1,22 +0,0 @@
|
|||
p,
|
||||
li {
|
||||
code {
|
||||
@apply .bg-grey-lighter .inline-block .font-mono .text-xs;
|
||||
padding: 1px 3px;
|
||||
}
|
||||
}
|
||||
|
||||
pre code,
|
||||
pre code.hljs,
|
||||
.hljs {
|
||||
@apply .bg-grey-lighter;
|
||||
@apply .block;
|
||||
@apply .border-grey-dark;
|
||||
@apply .border-l-4;
|
||||
@apply .font-mono;
|
||||
@apply .leading-loose;
|
||||
@apply .overflow-x-scroll;
|
||||
@apply .p-4;
|
||||
@apply .rounded;
|
||||
@apply .text-xs;
|
||||
}
|
|
@ -1,5 +0,0 @@
|
|||
.testimonial-image {
|
||||
@apply .rounded-full .mb-3 .ml-3;
|
||||
height: 65px;
|
||||
width: 65px;
|
||||
}
|
|
@ -3,79 +3,14 @@
|
|||
|
||||
@tailwind preflight;
|
||||
|
||||
p,
|
||||
li,
|
||||
td {
|
||||
a {
|
||||
@apply .text-blue;
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
@apply .bg-blue;
|
||||
@apply .inline-block;
|
||||
@apply .rounded;
|
||||
@apply .text-white;
|
||||
@apply .px-4;
|
||||
@apply .py-2;
|
||||
|
||||
&:active,
|
||||
&:hover {
|
||||
@apply .bg-blue-dark;
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
@apply .border-l-4 .border-blue .pl-4;
|
||||
}
|
||||
|
||||
img.with-border {
|
||||
@apply .border .border-solid .border-grey-light;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
@apply .mb-2;
|
||||
}
|
||||
|
||||
.content {
|
||||
h2,
|
||||
h3 {
|
||||
@apply .mt-6;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ul,
|
||||
ol,
|
||||
table,
|
||||
pre,
|
||||
.note {
|
||||
@apply .mb-4;
|
||||
}
|
||||
|
||||
a {
|
||||
@apply .text-grey-darkest;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
main a:not(.button) {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.bullets,
|
||||
main ul {
|
||||
list-style: disc;
|
||||
@apply .pl-4;
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: currentColor;
|
||||
}
|
||||
@import 'base/base';
|
||||
@import 'base/images';
|
||||
|
||||
@import 'components/button';
|
||||
@import 'components/link';
|
||||
@import 'components/listing';
|
||||
@import 'components/post';
|
||||
@import 'components/post/about-author';
|
||||
@import 'components/post/code';
|
||||
@import 'components/markdown';
|
||||
@import 'components/note';
|
||||
@import 'components/table';
|
||||
@import 'components/talk/slides';
|
||||
@import 'components/talk/video';
|
||||
|
|
|
@ -30,13 +30,13 @@
|
|||
<link rel="icon" href="{{ site.favicon.url }}?s={{ size }}" sizes="{{ size }}x{{ size }}">
|
||||
{% endfor %}
|
||||
</head>
|
||||
<body class="text-grey-darkest text-sm leading-normal">
|
||||
<body class="text-black text-sm leading-normal">
|
||||
<div class="navbar border-bottom border-b border-grey-light mb-6" role="banner">
|
||||
<header class="container mx-auto px-4">
|
||||
<div class="md:flex">
|
||||
<div class="w-full md:w-1/3 lg:w-1/4 flex items-center">
|
||||
<div class="w-3/4 py-5">
|
||||
<a href="/" title="Home">
|
||||
<a href="/" title="Home" class="text-grey-darkest no-underline hover:underline">
|
||||
{{ site.title }}
|
||||
</a>
|
||||
</div>
|
||||
|
@ -116,7 +116,8 @@
|
|||
|
||||
<footer class="border-t border-grey-light pt-4 mt-4" role="contentinfo">
|
||||
<p>
|
||||
© 2010-{{ 'now'|date('Y') }} {{ site.title }}. Built with <a href="https://sculpin.io">Sculpin</a> and <a href="https://tailwindcss.com">Tailwind CSS</a>.
|
||||
© 2010-{{ 'now'|date('Y') }} {{ site.title }}.
|
||||
Built with <a class="link" href="https://sculpin.io">Sculpin</a> and <a class="link" href="https://tailwindcss.com">Tailwind CSS</a>.
|
||||
</p>
|
||||
|
||||
<div class="mt-2">
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
{% include 'post/header' %}
|
||||
{% include 'post/intro-image' %}
|
||||
|
||||
<div class="content mb-6">
|
||||
<div class="markdown mb-6">
|
||||
{% set limit = 'now'|date_modify('-12 months')|date('U') %}
|
||||
{% if page.date|date('U') < limit %}
|
||||
<div class="border-2 border-blue p-4 mb-4">
|
||||
|
@ -19,7 +19,10 @@
|
|||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
|
||||
{% include 'post/twitter-link' %}
|
||||
<div class="mb-4 italic text-grey-dark">
|
||||
<p>Questions? Comments? I’m <a href="https://twitter.com/{{ site.twitter.name }}" class="link">@{{ site.twitter.name }}</a> on Twitter.</p>
|
||||
</div>
|
||||
|
||||
{% include 'post/tags' %}
|
||||
{% include 'post/pager' %}
|
||||
{% include 'post/about-author' %}
|
||||
|
|
|
@ -2,8 +2,7 @@
|
|||
|
||||
{% block content_wrapper %}
|
||||
<div>
|
||||
<div>
|
||||
<h2>Abstract</h2>
|
||||
<div class="markdown">
|
||||
{{ page.summary|markdown }}
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
|
|
|
@ -1,9 +1,7 @@
|
|||
{% set classes = [
|
||||
'-mx-4 p-4 md:border-b-2 md:border-transparent md:ml-4 md:mr-0 md:p-0',
|
||||
loop.first ? 'border-t border-grey-lighter md:border-t-0 md:border-transparent',
|
||||
page.url matches '#' ~ pattern ~ '#' ? 'md:bg-transparent md:border-blue',
|
||||
] %}
|
||||
<a href="{{ href }}" class="{{ classes|join(' ')|trim }}">
|
||||
<a
|
||||
href="{{ href }}"
|
||||
class="block text-grey-darkest no-underline p-4 border-l-2 md:border-l-0 md:border-b-2 border-transparent md:ml-4 md:mr-0 md:p-0 hover:border-grey-light {{ loop.first ? 'border-t border-grey-lighter md:border-t-0 md:border-transparent' }} {{ page.url matches '#' ~ pattern ~ '#' ? 'border-blue' }}"
|
||||
>
|
||||
<span class="flex items-center h-full">
|
||||
{{- title -}}
|
||||
</span>
|
||||
|
|
|
@ -3,12 +3,12 @@
|
|||
<div class="md:w-1/2 md:px-2 mb-4 flex">
|
||||
<div class="border p-3 w-full flex flex-col {{ project.versions ? 'justify-between' }}">
|
||||
<h3>
|
||||
<a href="{{ project.url }}">
|
||||
<a href="{{ project.url }}" class="text-black no-underline hover:underline focus:underline">
|
||||
{{ project.name }}
|
||||
</a>
|
||||
</h3>
|
||||
|
||||
<div class="flex-1">
|
||||
<div class="markdown flex-1">
|
||||
{{ project.description }}
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<div class="clearfix mt-4">
|
||||
<h2>About the Author</h2>
|
||||
|
||||
<div class="flex items-center">
|
||||
<div class="flex">
|
||||
<div class="mr-4 flex-none leading-none">
|
||||
<img
|
||||
src="{{ site.images_url }}{{ site.avatar.url }}"
|
||||
|
@ -10,6 +10,9 @@
|
|||
>
|
||||
</div>
|
||||
|
||||
<p class="mb-0">Oliver Davies is a full-stack Web Developer and System Administrator based in the UK. He is a {{ site.work.role }} at <a href="{{ site.companies[site.work.company].url }}?utm_source={{ site.short_url }}&utm_medium=about-author">{{ site.companies[site.work.company].name }}</a> and a part-time freelancer specialising in Drupal, Symfony and Laravel development and Linux systems administration.</p>
|
||||
<p class="mb-0">
|
||||
Oliver Davies is a full-stack Web Developer and System Administrator based in the UK.
|
||||
He is a {{ site.work.role }} at <a href="{{ site.companies[site.work.company].url }}?utm_source={{ site.short_url }}&utm_medium=about-author" class="link">{{ site.companies[site.work.company].name }}</a> and a part-time freelancer specialising in Drupal, Symfony and Laravel development and Linux systems administration.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,3 +0,0 @@
|
|||
<div class="mb-4 italic text-grey-dark">
|
||||
<p>Questions? Comments? I’m <a href="https://twitter.com/{{ site.twitter.name }}">@{{ site.twitter.name }}</a> on Twitter.</p>
|
||||
</div>
|
|
@ -2,10 +2,10 @@
|
|||
<div class="widget lh-copy">
|
||||
<h2>Latest Blog Posts</h2>
|
||||
|
||||
<ul class="bullets">
|
||||
<ul class="pl-4">
|
||||
{% for post in data.posts|slice(0, site.latest_posts) %}
|
||||
<li>
|
||||
<a href="{{ post.url }}">
|
||||
<a href="{{ post.url }}" class="link">
|
||||
{{ post.title }}
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
@ -31,11 +31,11 @@
|
|||
{% if not talk_page %}
|
||||
<td>
|
||||
{% if talk.talk.url is not empty %}
|
||||
<a href="{{ talk.talk.url }}">
|
||||
<a href="{{ talk.talk.url }}" class="link">
|
||||
{{ talk.talk.title }}
|
||||
</a>
|
||||
{% else %}
|
||||
{{ talk.talk.title }}
|
||||
{{ talk.talk.title }}
|
||||
{% endif %}
|
||||
|
||||
<div class="text-xs text-grey-dark">
|
||||
|
@ -50,7 +50,7 @@
|
|||
|
||||
<td>
|
||||
{% if talk.event.website is not empty %}
|
||||
<a href="{{ talk.event.website }}">
|
||||
<a href="{{ talk.event.website }}" class="link">
|
||||
{{ talk.event.name }}
|
||||
</a>
|
||||
{% else %}
|
||||
|
@ -69,7 +69,7 @@
|
|||
{% if talk.event.joindin and talk.event.date <= 'today'|date('Y-m-d') %}
|
||||
<a
|
||||
href="{{ talk.event.joindin }}"
|
||||
class="button"
|
||||
class="button no-underline"
|
||||
title="Read or leave feedback for this talk"
|
||||
>
|
||||
<i class="fa fa-comment-o"></i> joind.in
|
||||
|
|
|
@ -141,7 +141,7 @@ experiences:
|
|||
</div>
|
||||
|
||||
{% if experience.description %}
|
||||
<div>
|
||||
<div class="markdown">
|
||||
{{ experience.description|markdown }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
|
|
@ -11,6 +11,7 @@ use:
|
|||
- posts
|
||||
- testimonials
|
||||
---
|
||||
<div class="markdown" markdown="1">
|
||||
# About Me
|
||||
|
||||
<div class="mb-4 w-1/3 sm:w-1/4 lg:w-1/6">
|
||||
|
@ -43,6 +44,7 @@ You can usually find me on Twitter ([@{{ site.twitter.name }}][21]) and IRC ({{
|
|||
- User group and conference organiser
|
||||
- Blogger and author
|
||||
- Speaker
|
||||
</div>
|
||||
|
||||
[1]: https://www.google.com/#q=opdavies
|
||||
[2]: https://www.drupal.org
|
||||
|
|
|
@ -11,30 +11,8 @@ talks:
|
|||
events:
|
||||
- { date: '2014-08-19', event: swdug }
|
||||
---
|
||||
{% block breadcrumb %}
|
||||
<div class="breadcrumb border-b border-grey-lighter mb-6 -mt-6 bg-grey-lightest">
|
||||
<div class="container mx-auto px-4">
|
||||
<ul class="flex pl-0 mb-0">
|
||||
<li class="list-reset flex items-center">
|
||||
<a class="inline py-2" href="{{ site.url }}/">Home</a>
|
||||
{% include "svg/chevron-right" with { class: 'text-grey-light mx-1', style: "height: 20px" } %}
|
||||
</li>
|
||||
<li class="list-reset flex items-center">
|
||||
<a class="inline py-2" href="{{ site.url }}/talks">Talks</a>
|
||||
{% include "svg/chevron-right" with { class: 'text-grey-light mx-1', style: "height: 20px" } %}
|
||||
</li>
|
||||
<li class="list-reset flex truncate">
|
||||
<span class="inline py-2 truncate">Archive</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
<p>Here are a list of my previous conference and user group talks:</p>
|
||||
|
||||
{% block content %}
|
||||
<p>Here are a list of my previous conference and user group talks:</p>
|
||||
{% include "talks-table" with { talks: getPastTalks(data.talks, site.events) } %}
|
||||
|
||||
{% include "talks-table" with { talks: getPastTalks(data.talks, site.events) } %}
|
||||
|
||||
<p>Upcoming talks can be found on the <a href="{{ site.url }}/talks">talks page</a>.</p>
|
||||
{% endblock %}
|
||||
<p>Upcoming talks can be found on the <a href="{{ site.url }}/talks" class="link">talks page</a>.</p>
|
||||
|
|
|
@ -6,20 +6,24 @@ meta:
|
|||
use: [talks]
|
||||
---
|
||||
{% block content %}
|
||||
<p>I regularly speak at conferences and user groups about a range of subjects including Drupal, Sculpin and Git. If you would like to me to speak at your group or conference, please <a href="{{ site.url }}/contact">get in touch</a>.</p>
|
||||
<p>I regularly speak at conferences and user groups about a range of subjects including Drupal, Sculpin and Git. If you would like to me to speak at your group or conference, please <a href="/contact" class="link">get in touch</a>.</p>
|
||||
|
||||
<h2>Upcoming Talks</h2>
|
||||
<div>
|
||||
<h2>Upcoming Talks</h2>
|
||||
|
||||
{% set upcoming_talks = getUpcomingTalks(data.talks, site.events) %}
|
||||
{% if not upcoming_talks.empty %}
|
||||
{% include "talks-table" with { talks: upcoming_talks, upcoming: true } %}
|
||||
{% else %}
|
||||
<p>Nothing scheduled at the moment.</p>
|
||||
{% endif %}
|
||||
{% set upcoming_talks = getUpcomingTalks(data.talks, site.events) %}
|
||||
{% if not upcoming_talks.empty %}
|
||||
{% include "talks-table" with { talks: upcoming_talks, upcoming: true } %}
|
||||
{% else %}
|
||||
<p>Nothing scheduled at the moment.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<h2>Last 5 Talks</h2>
|
||||
<div>
|
||||
<h2>Last 5 Talks</h2>
|
||||
|
||||
{% include "talks-table" with { talks: getPastTalks(data.talks, site.events)|slice(0,5) } %}
|
||||
{% include "talks-table" with { talks: getPastTalks(data.talks, site.events)|slice(0,5) } %}
|
||||
|
||||
<p>All previous talks can be found in the <a href="{{ site.url }}/talks/archive">talks archive</a>.</p>
|
||||
<p>All previous talks can be found in the <a href="/talks/archive" class="link">talks archive</a>.</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
@ -4,6 +4,7 @@ title: 'Test Driven Drupal: The Book'
|
|||
mailchimp_url: 'https://oliverdavi.us18.list-manage.com/subscribe/post?u=b4ac8dd177796d37b93f9c285&id=033c84e0d5'
|
||||
contact_email: 'oliver@testdrivendrupal.com'
|
||||
---
|
||||
<div class="markdown" markdown="1">
|
||||
Having [given talks][1] and [written blog posts][0] about automated testing in Drupal, I’m currently in the planning phase of a book and potentially some accompanying screencasts about it, focussing on Drupal 8.
|
||||
|
||||
I’m still thinking about what use-cases to cover and examples to include, but here are some of the things I’m considering:
|
||||
|
@ -36,10 +37,10 @@ I’m still thinking about what use-cases to cover and examples to include, but
|
|||
I’ll most likely be publishing it via Leanpub, and will be sending free chapters, early-bird discounts and links to screencasts and blog posts as I write the book to subscribers of the mailing list.
|
||||
|
||||
If you have questions or would like to suggest something for me to include in the book, please <a href="mailto:{{ page.contact_email }}">contact me</a>.
|
||||
|
||||
## Mailing List
|
||||
|
||||
Enter your email address to subscribe to the Test Driven Drupal mailing list.
|
||||
</div>
|
||||
|
||||
<div id="mc_embed_signup">
|
||||
<form action="{{ page.mailchimp_url }}" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate p-0" target="_blank" novalidate>
|
||||
|
|
|
@ -69,19 +69,19 @@ testimonials:
|
|||
{% block content %}
|
||||
<div class="listing">
|
||||
{% for testimonial in page.testimonials|reverse %}
|
||||
<article class="listing-item">
|
||||
<article class="mb-12">
|
||||
{% if testimonial.image %}
|
||||
<div class="float-right mb-4 ml-4">
|
||||
<img
|
||||
src="{{ site.url }}/build/images/testimonials/{{ testimonial.image }}"
|
||||
alt="{{ testimonial.name }}"
|
||||
class="rounded-full w-24 h-24"
|
||||
class="rounded-full w-16 h-16"
|
||||
>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="mb-4">
|
||||
<h2>{{ testimonial.name }}</h2>
|
||||
<div class="mb-2">
|
||||
<h2 class="mb-1 leading-none">{{ testimonial.name }}</h2>
|
||||
|
||||
{% if testimonial.role %}
|
||||
<div class="text-grey-dark">
|
||||
|
|
|
@ -284,10 +284,10 @@ module.exports = {
|
|||
backgroundPosition: ['responsive'],
|
||||
backgroundRepeat: ['responsive'],
|
||||
backgroundSize: ['responsive'],
|
||||
borderColors: ['responsive', 'hover'],
|
||||
borderColors: ['responsive', 'hover', 'focus'],
|
||||
borderRadius: ['responsive'],
|
||||
borderStyle: ['responsive'],
|
||||
borderWidths: ['responsive'],
|
||||
borderStyle: ['responsive', 'hover', 'focus'],
|
||||
borderWidths: ['responsive', 'hover', 'focus'],
|
||||
cursor: ['responsive'],
|
||||
display: ['responsive'],
|
||||
flexbox: ['responsive'],
|
||||
|
|
Loading…
Reference in a new issue