Skip to content

Commit 0c07c85

Browse files
sghowerisghoweri
authored
Merge pull request #14 from drupal-pattern-lab/feature/adding-theme
1st pass adding Jekyll theme
2 parents 906fe29 + 4b24e87 commit 0c07c85

33 files changed

+1390
-18
lines changed

‎.editorconfig‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# Unix-style newlines with a newline ending every file
2+
[*]
3+
indent_style = space
4+
indent_size = 2
5+
insert_final_newline = true

‎_config.yml‎

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,19 +8,30 @@ name: Drupal Pattern Lab
88

99

1010
# Short bio or description (displayed in the header)
11-
description: Curated resources on integrating Pattern Lab with Drupal 8.
11+
description: Curated resources for integrating Pattern Lab with Drupal 8.
1212

1313

1414
# URL of your avatar or profile pic (you could use your GitHub profile pic)
1515
# avatar: https://raw.githubusercontent.com/drupal-pattern-lab/drupal-pattern-lab.github.io/master/images/drupal-pl-logo--grayscale.png
16-
#theme: jekyll-theme-midnight
16+
#theme: jekyll-theme-cayman
1717

1818

19-
# Includes an icon in the footer for each username you enter
20-
#footer-links:
21-
# github: drupal-pattern-lab/drupal-pattern-lab.github.io
22-
# slack:
23-
#
19+
sass:
20+
sass_dir: styles
21+
22+
navItems:
23+
-
24+
text: Blog
25+
url: /blog
26+
-
27+
text: GitHub Org
28+
url: https://github.com/drupal-pattern-lab
29+
-
30+
text: Slack Channel
31+
url: https://drupaltwig-slack.herokuapp.com
32+
-
33+
text: Roadmap
34+
url: https://github.com/drupal-pattern-lab/roadmap/projects/1
2435

2536

2637
# Enter your Google Analytics web tracking code (e.g. UA-2110908-2) to activate tracking

‎_layouts/default.html‎

Lines changed: 52 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,63 @@
11
<!doctype html>
2-
<html>
2+
<html class="no-js">
33
<head>
44
<meta charset="utf-8">
55
<title>{% if page.title %}{{ page.title }} | {% endif %}{{ site.name }}</title>
66
<meta name="description" content="{{ site.description }}">
77
<meta name="viewport" content="width=device-width,initial-scale=1">
8+
9+
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
10+
<link rel="stylesheet" href="{{ '/styles/styles.drupal-pattern-lab.css?v=' | append: site.github.build_revision | relative_url }}">
811
</head>
912
<body>
10-
<div class="site">
11-
<header class="site__header">
12-
{% include header.html %}
13-
</header>
14-
<div class="site__content">
15-
{{ content }}
13+
14+
<header class="c-global-header">
15+
<div class="o-flag c-global-header__intro">
16+
<div class="o-flag__image">
17+
<a href="/" alt="Home">
18+
<img src="{{ '/assets/images/logo--inverted.svg' | relative_url }}" alt="Pattern Lab logo combined with the Drupal Drop" width="100">
19+
</a>
20+
</div>
21+
22+
<div class="o-flag__body c-global-header__intro-text">
23+
<h1 class="c-project-name">{{ site.name | default: site.github.repository_name }}</h1>
24+
</div>
1625
</div>
17-
</div>
26+
27+
<h2 class="c-project-tagline">{{ site.description | default: site.github.project_tagline }}</h2>
28+
29+
30+
{% for nav_item in site.navItems %}
31+
<a href="{{ nav_item.url }}" class="c-btn">{{ nav_item.text }}</a>
32+
{% endfor %}
33+
</header>
34+
35+
36+
37+
<section class="c-page">
38+
{{ content }}
39+
40+
<footer class="c-global-footer">
41+
{% if site.github.is_project_page %}
42+
<span class="c-global-footer__owner">
43+
<a href="{{ site.github.repository_url }}">{{ site.github.repository_name }}</a> is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.</span>
44+
{% endif %}
45+
<span class="c-global-footer__credits">This page was generated by <a href="https://pages.github.com">GitHub Pages</a>.</span>
46+
</footer>
47+
</section>
48+
49+
<script src="/assets/script.js" defer></script>
50+
51+
{% if site.google_analytics %}
52+
<script type="text/javascript">
53+
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
54+
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
55+
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
56+
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
57+
ga('create', '{{ site.google_analytics }}', 'auto');
58+
ga('send', 'pageview');
59+
</script>
60+
{% endif %}
1861
</body>
62+
1963
</html>

‎_layouts/post.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
---
22
layout: default
33
---
4-
<article>
4+
<article class="c-article">
55
<header>
66
{% if page.title %}<h2>{{ page.title }}</h2>{% endif %}
77
<ul>
88
{% if page.author %}<li>by {{ page.author }}</li>{% endif %}
9-
<li>{{ page.date }}</li>
9+
<li>{{ page.date | date_to_string }}</li>
1010
</ul>
1111
</header>
1212
{{ content }}

‎assets/images/logo--inverted.svg‎

Lines changed: 83 additions & 0 deletions
Loading

‎assets/images/logo.svg‎

Lines changed: 84 additions & 0 deletions
Loading

‎assets/script.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/**
2+
* Query selector using Vanilla JS and `querySelectorAll`, returning Array instead of NodeList..
3+
* @param {String} selector
4+
* @param {HTMLElement} [el=document] - Element to search within.
5+
* @returns {Array}
6+
*/
7+
function query(selector, el) {
8+
el = el || document;
9+
// returning an Array instead of a NodeList
10+
return Array.prototype.slice.call(el.querySelectorAll(selector));
11+
}
12+
13+
function globalSetup() {
14+
document.documentElement.classList.remove('no-js');
15+
document.documentElement.classList.add('js');
16+
17+
// External links open in new tab
18+
query('a[href^=http]').forEach(function (el) {
19+
el.setAttribute('target', '_blank');
20+
});
21+
}
22+
23+
document.addEventListener('DOMContentLoaded', function () {
24+
globalSetup();
25+
});

‎blog/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ <h2>Blog</h2>
1010
<h3><a href="{{ post.url }}">{{ post.title }}</a></h3>
1111
<ul>
1212
{% if post.author %}<li>by {{ post.author }}</li>{% endif %}
13-
<li>{{ post.date }}</li>
13+
<li>{{ post.date | date_to_string }}</li>
1414
</ul>
1515
</header>
1616
<p> {{ post.excerpt }} </p>

‎styles/01-settings/_settings.variables.scss‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
/* ------------------------------------ *\
2+
#SETTINGS - VARIABLES
3+
\* ------------------------------------ */
4+
5+
// Breakpoints
6+
$large-breakpoint: 64em !default;
7+
$medium-breakpoint: 42em !default;
8+
9+
// Headers
10+
$header-heading-color: #fff !default;
11+
$header-bg-color: #159957 !default;
12+
$header-bg-color-secondary: #155799 !default;
13+
14+
// Text
15+
$section-headings-color: #159957 !default;
16+
$body-text-color: #606c71 !default;
17+
$body-link-color: #1e6bb8 !default;
18+
$blockquote-text-color: #819198 !default;
19+
20+
// Code
21+
$code-bg-color: #f3f6fa !default;
22+
$code-text-color: #567482 !default;
23+
24+
// Borders
25+
$border-color: #dce6f0 !default;
26+
$table-border-color: #e9ebec !default;
27+
$hr-border-color: #eff0f1 !default;

‎styles/02-tools/_tools.mixins.scss‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/* ------------------------------------ *\
2+
#TOOLS - MIXINS
3+
\* ------------------------------------ */
4+
5+
@mixin large {
6+
@media screen and (min-width: #{$large-breakpoint}) {
7+
@content;
8+
}
9+
}
10+
11+
@mixin medium {
12+
@media screen and (min-width: #{$medium-breakpoint}) and (max-width: #{$large-breakpoint}) {
13+
@content;
14+
}
15+
}
16+
17+
@mixin small {
18+
@media screen and (max-width: #{$medium-breakpoint}) {
19+
@content;
20+
}
21+
}

0 commit comments

Comments
 (0)