overkyll-jekyll-theme 0.8 → 0.9

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 077463d5e282da0fa25c28cd9e127114cefa7308
4
- data.tar.gz: 6606a14ddcb690337ad554dc92b17151d058c3c9
3
+ metadata.gz: 31e550353f4d66b2eee8b1e09bac8f6693aca6ee
4
+ data.tar.gz: de36128fd166bd319a60b54bd2ea72dcf1ebfb15
5
5
  SHA512:
6
- metadata.gz: d36ccc42a7263a14520cfab28305bac0a6a2b0300f090557bf381f3a71787def541eb897ae0c267aa34483de7d5bcf7cc69786a7542f45a2dff900b3b0ec57a4
7
- data.tar.gz: e3e25db6c5626ac86e585ef92f0835af55e0434430d2da48f272cf69b41a9c4636be823384a111eb71e0d3bb54a1a862f04dedf25a15129e8f318ef143262e43
6
+ metadata.gz: 0de066a6ab7cf10617a9b4dab449a3196344fd078ca7016365306b9ebd8ff4dd40f9067287af7307cfd4abe74bd4f75fde49e781c3941e98417891fd178c8684
7
+ data.tar.gz: bd0daf724c568a3b48f1967f8b9415cbf14a6aba5d9bfc020bb79649f64dcfaf435b60ff187e814fcf86bb6160b7dd128125d0bae5521bd764c53ed4cb1b8f2f
data/_includes/base.scss CHANGED
@@ -3,10 +3,14 @@
3
3
  ////
4
4
  //// Import partials from `sass_dir` (defaults to `_sass`)
5
5
 
6
- @import "config/colors";
7
- @import "config/mediaqueries";
8
- @import "config/typography";
9
- @import "base/normalize";
10
- @import "base/base";
11
- @import "base/layout";
12
-
6
+ @import "overkyll/config/open-color";
7
+ @import "overkyll/config/colors";
8
+ @import "overkyll/config/mediaqueries";
9
+ @import "overkyll/config/typography";
10
+ @import "overkyll/base/normalize";
11
+ @import "overkyll/base/base";
12
+ @import "overkyll/base/layout";
13
+ @import "overkyll/base/font";
14
+ @import "overkyll/generic/skiplink";
15
+ @import "overkyll/object/header";
16
+ @import "overkyll/object/navigation";
@@ -1,29 +1,21 @@
1
1
  <div class="skip-links">
2
2
  <a href="#main">Contenu principal</a>
3
3
  </div>
4
- {% for page in site.html_pages %}
5
- {% if page.navigation %}
6
- {% assign loopindex = loopindex | plus: 1 %}
7
- {% endif %}
8
- {% endfor %}
9
4
  <header class="site-header" role="banner">
5
+ <div class="site-header-top wrapper">
6
+ <div class="site-logo">
7
+ <a class="site-title" href="{{ site.baseurl }}/">{{ site.title }}</a>
8
+ </div>
10
9
 
11
- <div class="wrapper {% if loopindex <= 3 %}wrapper--flex{% endif %}">
12
-
13
- <div class="site-logo">
14
- <a class="site-title" href="{{ site.baseurl }}/">{{ site.title }}</a>
15
- </div>
16
-
17
- <nav class="nav-main" role="navigation">
18
- <ul>
19
- {% for page in site.html_pages %}
20
- {% if page.navigation %}
21
- <li><a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a></li>
22
- {% endif %}
23
- {% endfor %}
24
- </ul>
25
- </nav>
26
-
10
+ <nav class="nav-main" role="navigation">
11
+ <ul>
12
+ {% for page in site.html_pages %}
13
+ {% if page.navigation %}
14
+ <li><a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a></li>
15
+ {% endif %}
16
+ {% endfor %}
17
+ </ul>
18
+ </nav>
27
19
  </div>
28
20
 
29
21
  </header>
@@ -1,18 +1,18 @@
1
1
  {% if page.previous || page.next %}
2
2
 
3
- <nav class="pagination" role="navigation">
3
+ <nav class="pagination--prevnext" role="navigation">
4
4
 
5
5
  {% if page.previous %}
6
- <div class="left">
7
- <a class="pagination-item" href="{{ page.previous.url }}">
6
+ <div class="pagination--prev">
7
+ <a class="pagination--item" href="{{ page.previous.url }}">
8
8
  {{ page.previous.title }}
9
9
  </a>
10
10
  </div>
11
11
  {% endif %}
12
12
 
13
13
  {% if page.next %}
14
- <div class="right">
15
- <a class="pagination-item" href="{{ page.next.url }}">
14
+ <div class="pagination--next">
15
+ <a class="pagination--item" href="{{ page.next.url }}">
16
16
  {{ page.next.title }}
17
17
  </a>
18
18
  </div>
@@ -20,3 +20,5 @@
20
20
 
21
21
  </nav>
22
22
  {% endif %}
23
+
24
+
@@ -0,0 +1,10 @@
1
+ @charset "utf-8";
2
+
3
+ // Import partials from `sass_dir` (defaults to `_sass`)
4
+
5
+ $base-font-name: Overpass;
6
+ $title-font-name: Overpass;
7
+
8
+ // Configuration
9
+ @import "overkyll/overkyll";
10
+
@@ -0,0 +1,188 @@
1
+ ////
2
+ /// Very basic styles
3
+ ////
4
+
5
+ html,
6
+ body {
7
+ box-sizing: border-box;
8
+ margin: 0;
9
+ }
10
+
11
+ *,
12
+ *:before,
13
+ *:after {
14
+ box-sizing: inherit;
15
+ }
16
+
17
+ // Images
18
+ // -------------------------
19
+
20
+ img {
21
+ max-width: 100%;
22
+ height: auto;
23
+ vertical-align: middle;
24
+ border: 0;
25
+ -ms-interpolation-mode: bicubic;
26
+ }
27
+
28
+ // We need to revert these for Google maps cause else it breaks!
29
+ %img--no-max,
30
+ .img--no-max {
31
+ max-width: none;
32
+ }
33
+
34
+
35
+ // Figures
36
+ // -------------------------
37
+
38
+ figure > img {
39
+ display: block;
40
+ }
41
+
42
+ figcaption {
43
+ font-size: $smaller;
44
+ }
45
+
46
+ // Links
47
+ // -------------------------
48
+
49
+ a {
50
+ text-decoration: underline;
51
+ color: $link-color;
52
+ &:visited {
53
+ color: $link-color;
54
+ }
55
+ &:hover {
56
+ text-decoration: none;
57
+ }
58
+ &:focus {
59
+ outline: thin dotted;
60
+ }
61
+ &:hover, &:active {
62
+ outline: none;
63
+ }
64
+ }
65
+
66
+ // Lists
67
+ // -------------------------
68
+
69
+ ul,ol {
70
+ margin-bottom: $base-line;
71
+ li {
72
+ margin-bottom: 0.5rem;
73
+ }
74
+ }
75
+
76
+ // List options
77
+ // -------------------------
78
+
79
+ // Unstyled keeps list items block level, just removes default browser padding and list-style
80
+ .list-unstyled {
81
+ padding-left: 0;
82
+ list-style: none;
83
+ }
84
+
85
+ // Inline turns list items into inline-block
86
+ .list-inline {
87
+ @extend .list-unstyled;
88
+
89
+ > li {
90
+ display: inline-block;
91
+ margin: 0 -5px 0 0;
92
+ }
93
+ }
94
+
95
+ // Description Lists
96
+ // -------------------------
97
+
98
+ dl {
99
+ margin-top: 0; // Remove browser default
100
+ margin-bottom: $base-line;
101
+ }
102
+ dt,
103
+ dd {
104
+ line-height: $line-height-base;
105
+ }
106
+ dt {
107
+ font-weight: bold;
108
+ }
109
+ dd {
110
+ margin-left: 0; // Undo browser default
111
+ }
112
+
113
+ // Blockquotes
114
+ // -------------------------
115
+
116
+ blockquote,
117
+ blockquote p,
118
+ q {
119
+ color: $color-grey;
120
+ }
121
+
122
+ blockquote {
123
+ padding-left: $base-line / 2;
124
+ font-size: $base-em * $ms1;
125
+ letter-spacing: -1px;
126
+ border-left: 4px solid $color-grey;
127
+ > :last-child {
128
+ margin-bottom: 0;
129
+ }
130
+ }
131
+
132
+ blockquote cite {
133
+ display: block;
134
+ color: $color-grey-dark;
135
+ }
136
+
137
+ blockquote cite:before {
138
+ content: "\2014 \0020";
139
+ }
140
+
141
+ blockquote cite a,
142
+ blockquote cite a:visited {
143
+ color: $color-grey-dark;
144
+ }
145
+
146
+
147
+ // Code formatting
148
+ // -------------------------
149
+
150
+ pre,
151
+ code {
152
+ font-size: 15px;
153
+ border: 1px solid $color-grey-light;
154
+ border-radius: 3px;
155
+ background-color: #eef;
156
+ }
157
+
158
+ code {
159
+ padding: 1px 5px;
160
+ }
161
+
162
+ pre {
163
+ overflow-x: scroll;
164
+ padding: 8px 12px;
165
+ > code {
166
+ padding-right: 0;
167
+ padding-left: 0;
168
+ border: 0;
169
+ }
170
+ }
171
+
172
+ table {
173
+ width: 100%;
174
+ table-layout: fixed;
175
+ border: 1px solid #ccc;
176
+ > thead, > tbody, > tfoot {
177
+ > tr {
178
+ > th, > td {
179
+ border: 1px solid #ccc;
180
+ }
181
+ }
182
+ }
183
+ > thead > tr {
184
+ > th, > td {
185
+ border-bottom-width: 2px;
186
+ }
187
+ }
188
+ }
@@ -0,0 +1,125 @@
1
+
2
+ /* Webfont: call local webfont */
3
+ @if $base-font-name != '-apple-system' {
4
+ @font-face {
5
+ font-family: '#{$base-font-name}';
6
+ src: url('../fonts/#{$base-font-name}-Bold.woff2') format('woff2');
7
+ font-style: normal;
8
+ font-weight: bold;
9
+ }
10
+
11
+ /* Webfont: Overpass-BoldItalic */
12
+ @font-face {
13
+ font-family: '#{$base-font-name}';
14
+ src: url('../fonts/#{$base-font-name}-Italic.woff2') format('woff2');
15
+ font-style: italic;
16
+ font-weight: normal;
17
+ }
18
+
19
+ /* Webfont: Overpass-Light */
20
+ @font-face {
21
+ font-family: '#{$base-font-name}';
22
+ src: url('../fonts/#{$base-font-name}-Light.woff2') format('woff2');
23
+ font-style: normal;
24
+ font-weight: normal;
25
+ }
26
+
27
+ /* Webfont: Overpass-ExtraLight */
28
+ @font-face {
29
+ font-family: '#{$base-font-name}';
30
+ src: url('../fonts/#{$base-font-name}-ExtraLight.woff2') format('woff2');
31
+ font-style: normal;
32
+ font-weight: 300;
33
+ }
34
+ }
35
+
36
+ @if $title-font-name != '-apple-system' {
37
+ @font-face {
38
+ font-family: '#{$title-font-name}';
39
+ src: url('../fonts/#{$base-font-name}-Bold.woff2') format('woff2');
40
+ font-style: normal;
41
+ font-weight: bold;
42
+ }
43
+
44
+ /* Webfont: Overpass-BoldItalic */
45
+ @font-face {
46
+ font-family: '#{$title-font-name}';
47
+ src: url('../fonts/#{$base-font-name}-Italic.woff2') format('woff2');
48
+ font-style: italic;
49
+ font-weight: normal;
50
+ }
51
+
52
+ /* Webfont: Overpass-Light */
53
+ @font-face {
54
+ font-family: '#{$title-font-name}';
55
+ src: url('../fonts/#{$base-font-name}-Light.woff2') format('woff2');
56
+ font-style: normal;
57
+ font-weight: normal;
58
+ }
59
+
60
+ /* Webfont: Overpass-ExtraLight */
61
+ @font-face {
62
+ font-family: '#{$title-font-name}';
63
+ src: url('../fonts/#{$base-font-name}-ExtraLight.woff2') format('woff2');
64
+ font-style: normal;
65
+ font-weight: 300;
66
+ }
67
+ }
68
+
69
+ /*! system-font.css v1.1.0 | CC0-1.0 License | github.com/jonathantneal/system-font-face */
70
+
71
+ @font-face {
72
+ font-family: system;
73
+ font-style: normal;
74
+ font-weight: 300;
75
+ src: local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Segoe UI Light"), local("Ubuntu Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma");
76
+ }
77
+
78
+ @font-face {
79
+ font-family: system;
80
+ font-style: italic;
81
+ font-weight: 300;
82
+ src: local(".SFNSText-LightItalic"), local(".HelveticaNeueDeskInterface-Italic"), local(".LucidaGrandeUI"), local("Segoe UI Light Italic"), local("Ubuntu Light Italic"), local("Roboto-LightItalic"), local("DroidSans"), local("Tahoma");
83
+ }
84
+
85
+ @font-face {
86
+ font-family: system;
87
+ font-style: normal;
88
+ font-weight: 400;
89
+ src: local(".SFNSText-Regular"), local(".HelveticaNeueDeskInterface-Regular"), local(".LucidaGrandeUI"), local("Segoe UI"), local("Ubuntu"), local("Roboto-Regular"), local("DroidSans"), local("Tahoma");
90
+ }
91
+
92
+ @font-face {
93
+ font-family: system;
94
+ font-style: italic;
95
+ font-weight: 400;
96
+ src: local(".SFNSText-Italic"), local(".HelveticaNeueDeskInterface-Italic"), local(".LucidaGrandeUI"), local("Segoe UI Italic"), local("Ubuntu Italic"), local("Roboto-Italic"), local("DroidSans"), local("Tahoma");
97
+ }
98
+
99
+ @font-face {
100
+ font-family: system;
101
+ font-style: normal;
102
+ font-weight: 500;
103
+ src: local(".SFNSText-Medium"), local(".HelveticaNeueDeskInterface-MediumP4"), local(".LucidaGrandeUI"), local("Segoe UI Semibold"), local("Ubuntu Medium"), local("Roboto-Medium"), local("DroidSans-Bold"), local("Tahoma Bold");
104
+ }
105
+
106
+ @font-face {
107
+ font-family: system;
108
+ font-style: italic;
109
+ font-weight: 500;
110
+ src: local(".SFNSText-MediumItalic"), local(".HelveticaNeueDeskInterface-MediumItalicP4"), local(".LucidaGrandeUI"), local("Segoe UI Semibold Italic"), local("Ubuntu Medium Italic"), local("Roboto-MediumItalic"), local("DroidSans-Bold"), local("Tahoma Bold");
111
+ }
112
+
113
+ @font-face {
114
+ font-family: system;
115
+ font-style: normal;
116
+ font-weight: 700;
117
+ src: local(".SFNSText-Bold"), local(".HelveticaNeueDeskInterface-Bold"), local(".LucidaGrandeUI"), local("Segoe UI Bold"), local("Ubuntu Bold"), local("Roboto-Bold"), local("DroidSans-Bold"), local("Tahoma Bold");
118
+ }
119
+
120
+ @font-face {
121
+ font-family: system;
122
+ font-style: italic;
123
+ font-weight: 700;
124
+ src: local(".SFNSText-BoldItalic"), local(".HelveticaNeueDeskInterface-BoldItalic"), local(".LucidaGrandeUI"), local("Segoe UI Bold Italic"), local("Ubuntu Bold Italic"), local("Roboto-BoldItalic"), local("DroidSans-Bold"), local("Tahoma Bold");
125
+ }
@@ -0,0 +1,40 @@
1
+ ////
2
+ /// Layout
3
+ ////
4
+
5
+ $layout-max-width: 40em !default;
6
+ $column-gutter: $base-em;
7
+ $column-number: 4 !default;
8
+
9
+ // Page & Wrapper
10
+ // -------------------------
11
+
12
+ .page {
13
+ padding-bottom: $base-line*4;
14
+ }
15
+
16
+ .page, .wrapper {
17
+ margin-right: auto;
18
+ margin-left: auto;
19
+ max-width: 100%;
20
+ }
21
+
22
+ .wrapper {
23
+ padding-right: $base-line;
24
+ padding-left: $base-line;
25
+ max-width: $layout-max-width;
26
+ }
27
+
28
+ // Grid
29
+ // -------------------------
30
+
31
+ @mixin grid($column-number:$column-number, $column-gutter:$column-gutter) {
32
+ display: grid;
33
+ grid-template-columns: repeat(auto-fill, minmax($layout-max-width/($column-number+1), 1fr));
34
+ grid-gap: 2vmin;
35
+ margin-bottom: $base-line;
36
+ }
37
+
38
+ .grid {
39
+ @include grid();
40
+ }