cosy-jekyll-theme 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. checksums.yaml +7 -0
  2. data/README.md +22 -0
  3. data/_includes/browser-upgrade.html +1 -0
  4. data/_includes/disqus_comments.html +26 -0
  5. data/_includes/feed-footer.html +1 -0
  6. data/_includes/footer.html +33 -0
  7. data/_includes/gallery +21 -0
  8. data/_includes/head.html +42 -0
  9. data/_includes/header.html +63 -0
  10. data/_includes/icons.html +3 -0
  11. data/_includes/pagination.html +66 -0
  12. data/_includes/read-more.html +20 -0
  13. data/_includes/scripts.html +22 -0
  14. data/_layouts/home.html +25 -0
  15. data/_layouts/page.html +37 -0
  16. data/_layouts/post.html +60 -0
  17. data/_sass/_animations.scss +327 -0
  18. data/_sass/_coderay.scss +66 -0
  19. data/_sass/_elements.scss +156 -0
  20. data/_sass/_grid.scss +47 -0
  21. data/_sass/_mixins.scss +381 -0
  22. data/_sass/_page.scss +649 -0
  23. data/_sass/_reset.scss +156 -0
  24. data/_sass/_rouge.scss +73 -0
  25. data/_sass/_site.scss +56 -0
  26. data/_sass/_typography.scss +125 -0
  27. data/_sass/_variables.scss +46 -0
  28. data/_sass/vendor/font-awesome/_animated.scss +34 -0
  29. data/_sass/vendor/font-awesome/_bordered-pulled.scss +25 -0
  30. data/_sass/vendor/font-awesome/_core.scss +12 -0
  31. data/_sass/vendor/font-awesome/_fixed-width.scss +6 -0
  32. data/_sass/vendor/font-awesome/_icons.scss +697 -0
  33. data/_sass/vendor/font-awesome/_larger.scss +13 -0
  34. data/_sass/vendor/font-awesome/_list.scss +19 -0
  35. data/_sass/vendor/font-awesome/_mixins.scss +26 -0
  36. data/_sass/vendor/font-awesome/_path.scss +15 -0
  37. data/_sass/vendor/font-awesome/_rotated-flipped.scss +20 -0
  38. data/_sass/vendor/font-awesome/_stacked.scss +20 -0
  39. data/_sass/vendor/font-awesome/_variables.scss +708 -0
  40. data/_sass/vendor/font-awesome/font-awesome.scss +17 -0
  41. data/assets/css/main.scss +26 -0
  42. data/assets/fonts/FontAwesome.otf +0 -0
  43. data/assets/fonts/fontawesome-webfont.eot +0 -0
  44. data/assets/fonts/fontawesome-webfont.svg +655 -0
  45. data/assets/fonts/fontawesome-webfont.ttf +0 -0
  46. data/assets/fonts/fontawesome-webfont.woff +0 -0
  47. data/assets/fonts/fontawesome-webfont.woff2 +0 -0
  48. data/assets/js/fitvids.min.js +1 -0
  49. data/assets/js/main.js +20 -0
  50. metadata +134 -0
data/_sass/_page.scss ADDED
@@ -0,0 +1,649 @@
1
+ body {
2
+ margin: 0;
3
+ padding: 0;
4
+ width: 100%;
5
+ background-color: $body-color;
6
+ overflow-x: hidden;
7
+ }
8
+
9
+ // Main
10
+ // --------------------------------------------------
11
+ .entry,
12
+ .hentry {
13
+ @include clearfix;
14
+ h1, h2, h3, h4, h5, h6, p, li {
15
+ word-wrap: break-word;
16
+ }
17
+ }
18
+
19
+ .body-title {
20
+ display: block;
21
+ }
22
+
23
+ .hentry-dark {
24
+ background-color: $header-color;
25
+ }
26
+
27
+ .entry-content {
28
+ @include font-size(16);
29
+ word-wrap: break-word;
30
+ word-break: break-all;
31
+ // Dotted line underlines for links
32
+ p > a,
33
+ li > a {
34
+ border-bottom: 1px dotted lighten($link-color, 50);
35
+ &:hover {
36
+ border-bottom-style: solid;
37
+ }
38
+ }
39
+ }
40
+
41
+ ///sections
42
+
43
+ .content-header-title {
44
+ text-align: center;
45
+ margin: 30px 0 0;
46
+ h1 {
47
+ margin: 10px 20px;
48
+ font-weight: 700;
49
+ @include font-rem(32);
50
+ color: lighten($base-color, 20);
51
+ @media #{$medium} {
52
+ @include font-rem(48);
53
+ }
54
+ @media #{$large} {
55
+ @include font-rem(60);
56
+ }
57
+ }
58
+ h2 {
59
+ margin: 0;
60
+ @include font-rem(18);
61
+ text-transform: uppercase;
62
+ color: lighten($base-color, 40);
63
+ @media #{$medium} {
64
+ @include font-rem(24);
65
+ }
66
+ }
67
+ p {
68
+ color: lighten($base-color, 20);
69
+ }
70
+ }
71
+
72
+ // Feature Image Caption
73
+ .image-credit {
74
+ position: absolute;
75
+ bottom: 0;
76
+ right: 0;
77
+ margin: 0 auto;
78
+ max-width: 440px;
79
+ padding: 10px 15px;
80
+ background-color: rgba($base-color, 0.5);
81
+ color: $white;
82
+ @include font-rem(12);
83
+ text-align: right;
84
+ @include border-radius(3px, 0, 0, 3px);
85
+ z-index: 10;
86
+ @media #{$medium} {
87
+ max-width: 760px;
88
+ }
89
+ @media #{$large} {
90
+ max-width: 960px;
91
+ }
92
+ a {
93
+ color: $white;
94
+ text-decoration: none;
95
+ }
96
+ }
97
+
98
+ // Single Post and Page
99
+ // --------------------------------------------------
100
+ .entry-meta {
101
+ @include font-rem(12);
102
+ margin-left: 10px;
103
+ color: lighten($base-color, 60);
104
+ a {
105
+ color: lighten($base-color, 60);
106
+ }
107
+ .vcard {
108
+ &:before {
109
+ content: "bye";
110
+ }
111
+ }
112
+ .tag {
113
+ display: inline-block;
114
+ margin: 4px;
115
+ color: $white;
116
+ @include rounded(3px);
117
+ background-color: lighten($base-color, 50);
118
+ span {
119
+ float: left;
120
+ padding: 2px 6px;
121
+ }
122
+ .count {
123
+ background-color: lighten($base-color, 40);
124
+ @include border-radius(3px, 3px, 0, 0);
125
+ }
126
+ &:hover {
127
+ background-color: lighten($base-color, 40);
128
+ }
129
+ }
130
+ .entry-reading-time {
131
+ float: right;
132
+ }
133
+ }
134
+
135
+ header .entry-meta {
136
+ display: none; // hide header meta on small screens
137
+ @media #{$medium} {
138
+ display: block;
139
+ }
140
+ }
141
+
142
+ #post,
143
+ #page {
144
+ .entry-content {
145
+ margin: 30px 2px 20px 2px;
146
+ padding: 10px 15px;
147
+ background-color: $white;
148
+ box-shadow: 0 0 0 0, 0 6px 12px rgba($black, 0.1);
149
+ @include rounded(3px);
150
+ @media #{$medium} {
151
+ margin-left: 10px;
152
+ margin-right: 10px;
153
+ padding: 20px 30px;
154
+ }
155
+ @media #{$large} {
156
+ max-width: 800px;
157
+ margin: 30px auto 30px auto;
158
+ padding: 50px 80px;
159
+ > p:first-child {
160
+ @include font-size(20);
161
+ }
162
+ }
163
+ }
164
+ #disqus_thread {
165
+ margin: 40px 2px 20px 2px;
166
+ padding: 10px 15px;
167
+ background-color: $white;
168
+ box-shadow: 0 0 0 1px rgba($border-color, 0.1), 0 6px 12px rgba($black, 0.1);
169
+ @include rounded(3px);
170
+ @media #{$medium} {
171
+ margin-left: 10px;
172
+ margin-right: 10px;
173
+ padding: 20px 30px;
174
+ }
175
+ @media #{$large} {
176
+ max-width: 800px;
177
+ padding: 50px 80px;
178
+ margin: 0 auto 30px auto;
179
+ }
180
+ }
181
+ .entry-meta {
182
+ margin: 50px 30px 30px;
183
+ text-align: center;
184
+ }
185
+ }
186
+
187
+ .entry-tags {
188
+ display: block;
189
+ margin-bottom: 6px;
190
+ }
191
+
192
+ .tag-heading,
193
+ .year-heading {
194
+ margin-top: 0;
195
+ }
196
+
197
+ .tag-list{
198
+ line-height: 1.5;
199
+ }
200
+
201
+ // Go to the exact location of bookmarks in tags, categories
202
+ .anchor-bookmark {
203
+ display: block;
204
+ height: $menu-height; /*same height as header*/
205
+ margin-top: -$menu-height; /*same height as header*/
206
+ visibility: hidden;
207
+ }
208
+
209
+ // Permalink icon for link post
210
+ .permalink {
211
+ margin-right: 7px;
212
+ }
213
+
214
+ // Post Pagination Module
215
+ .pagination {
216
+ margin: 20px 10px;
217
+ text-align: center;
218
+ ul {
219
+ display: inline;
220
+ margin-left: 10px;
221
+ margin-right: 10px;
222
+ }
223
+ li {
224
+ padding-left: 4px;
225
+ padding-right: 4px;
226
+ }
227
+ .current-page {
228
+ font-weight: 700;
229
+ }
230
+ }
231
+
232
+ // Read More Module
233
+ .read-more {
234
+ position: relative;
235
+ margin: 40px 2px 20px 2px;
236
+ padding: 40px 15px 25px;
237
+ background-color: $white;
238
+ box-shadow: 0 0 0 1px rgba($border-color, 0.1), 0 6px 12px rgba($black, 0.1);
239
+ @include rounded(3px);
240
+ @media #{$medium} {
241
+ margin: 50px 10px 20px 10px;
242
+ padding: 50px 40px 25px;
243
+ }
244
+ @media #{$large} {
245
+ max-width: 800px;
246
+ padding: 50px 80px;
247
+ margin: 60px auto;
248
+ }
249
+ text-align: center;
250
+ @include clearfix;
251
+ }
252
+
253
+ .read-more-header {
254
+ position: absolute;
255
+ top: -20px;
256
+ left: 0;
257
+ right: 0;
258
+ height: 35px;
259
+ a {
260
+ @extend .btn;
261
+ }
262
+ }
263
+
264
+ .read-more-content {
265
+ @include font-size(16);
266
+ // Dotted line underlines for links
267
+ p {
268
+ text-align: left;
269
+ }
270
+ p > a,
271
+ li > a {
272
+ border-bottom: 1px dotted lighten($link-color, 50);
273
+ &:hover {
274
+ border-bottom-style: solid;
275
+ }
276
+ }
277
+ h3 {
278
+ margin: 0;
279
+ @include font-rem(28);
280
+ a {
281
+ color: $text-color;
282
+ }
283
+ @media #{$medium} {
284
+ @include font-rem(36);
285
+ }
286
+ }
287
+ }
288
+
289
+ .list-inline {
290
+ padding-left: 0;
291
+ margin-left: -5px;
292
+ list-style: none;
293
+ }
294
+
295
+ .list-inline > li {
296
+ display: inline-block;
297
+ padding-right: 5px;
298
+ padding-left: 5px;
299
+ }
300
+
301
+ .read-more-list {
302
+ border-top: solid 2px lighten($base-color, 80);
303
+ }
304
+
305
+ .list-item {
306
+ width: 100%;
307
+ text-align: left;
308
+ h4 {
309
+ @include font-rem(18);
310
+ margin-bottom: 0;
311
+ }
312
+ span {
313
+ display: block;
314
+ @include font-rem(14);
315
+ color: lighten($base-color, 50);
316
+ }
317
+ @media #{$medium} {
318
+ width: 49%;
319
+ float: left;
320
+ &:nth-child(2) {
321
+ text-align: right;
322
+ }
323
+ }
324
+ }
325
+
326
+ // Post Index
327
+ // --------------------------------------------------
328
+ #post-index {
329
+ #main {
330
+ margin: 30px 2px 20px 2px;
331
+ @media #{$medium} {
332
+ margin-left: 20px;
333
+ margin-right: 20px;
334
+ }
335
+ @media #{$large} {
336
+ max-width: 800px;
337
+ margin-top: 50px;
338
+ margin-left: auto;
339
+ margin-right: auto;
340
+ }
341
+ }
342
+ article {
343
+ background-color: $white;
344
+ box-shadow: 0 0 0 0, 0 6px 12px rgba($base-color, 0.1);
345
+ @include rounded(3px);
346
+ margin-bottom: 20px;
347
+ padding: 15px;
348
+ @media #{$medium} {
349
+ padding: 30px;
350
+ }
351
+ @media #{$large} {
352
+ margin-bottom: 30px;
353
+ padding: 30px 80px;
354
+ }
355
+ }
356
+ }
357
+
358
+ .entry-image-index {
359
+ margin-top: -25px;
360
+ margin-left: -15px;
361
+ margin-right: -15px;
362
+ margin-bottom: 10px;
363
+ position: relative;
364
+ @media #{$medium} {
365
+ margin-top: -30px;
366
+ margin-left: -30px;
367
+ margin-right: -30px;
368
+ margin-bottom: 15px;
369
+ }
370
+ @media #{$large} {
371
+ margin-top: -50px;
372
+ margin-left: -80px;
373
+ margin-right: -80px;
374
+ margin-bottom: 20px;
375
+ }
376
+ img {
377
+ @include border-radius(3px, 0, 0, 3px); // round image corners
378
+ }
379
+ }
380
+
381
+ // Footer
382
+ // --------------------------------------------------
383
+ .footer-wrapper {
384
+ @include clearfix;
385
+ margin: 2em auto;
386
+ text-align: center;
387
+ color: lighten($text-color, 20);
388
+ a {
389
+ color: lighten($text-color, 20);
390
+ }
391
+ }
392
+
393
+ // Browser Upgrade
394
+ // --------------------------------------------------
395
+ .upgrade {
396
+ padding: 10px;
397
+ text-align: center;
398
+ }
399
+
400
+ // Google Search
401
+ // --------------------------------------------------
402
+ #goog-fixurl {
403
+ ul {
404
+ list-style: none;
405
+ margin-left: 0;
406
+ padding-left: 0;
407
+ li {
408
+ list-style-type: none;
409
+ }
410
+ }
411
+ }
412
+
413
+ #goog-wm-qt {
414
+ width: auto;
415
+ margin-right: 10px;
416
+ margin-bottom: 20px;
417
+ padding: 8px 20px;
418
+ display: inline-block;
419
+ @include font-rem(14);
420
+ background-color: $white;
421
+ color: $text-color;
422
+ border-width: 2px !important;
423
+ border-style: solid !important;
424
+ border-color: lighten($primary, 50);
425
+ @include rounded(3px);
426
+ }
427
+
428
+ #goog-wm-sb {
429
+ @extend .btn;
430
+ }
431
+
432
+ // Header
433
+ // --------------------------------------------------
434
+ .entry-header {
435
+ width: 100%;
436
+ overflow: hidden;
437
+ position: relative;
438
+ width: 100%;
439
+ overflow: hidden;
440
+ height: 50px;
441
+ @media #{$medium} {
442
+ background-color: $header-color;
443
+ min-height: 260px;
444
+ }
445
+ }
446
+
447
+ .header-title {
448
+ margin-top: 0;
449
+ width: 100%;
450
+ overflow: hidden;
451
+ line-height: 1;
452
+ display: none;
453
+ @media #{$medium} {
454
+ @include flexbox();
455
+ @include align-items(center);
456
+ @include justify-content(center);
457
+ @include flex-direction(column);
458
+ min-height: 200px;
459
+ margin-top: 60px;
460
+ }
461
+ h2 {
462
+ color: $white;
463
+ }
464
+ h1 {
465
+ font-weight: 700;
466
+ margin-bottom: 20px;
467
+ @include font-rem(32);
468
+ color: $white;
469
+ text-shadow: 1px 1px 4px rgba($base-color, 0.6);
470
+ display: block;
471
+ a {
472
+ color: $white;
473
+ }
474
+ @media #{$medium} {
475
+ @include font-rem(26);
476
+ }
477
+ @media #{$large} {
478
+ @include font-rem(36);
479
+ }
480
+ }
481
+ h1.post-title {
482
+ display: block;
483
+ @media #{$medium}{
484
+ display: none;
485
+ }
486
+ }
487
+ p {
488
+ color: $white;
489
+ }
490
+ }
491
+
492
+ .header-menu {
493
+ position: fixed;
494
+ top: 0;
495
+ left: 0;
496
+ width: 100%;
497
+ height: $menu-height;
498
+ z-index: 20;
499
+ ul {
500
+ margin: 0 auto;
501
+ list-style-type: none;
502
+ height: 100%;
503
+ padding: 0;
504
+ @media #{$large} {
505
+ max-width: 900px;
506
+ }
507
+ }
508
+ }
509
+
510
+ .header-menu-top {
511
+ background-color: $menu-top;
512
+ box-shadow: 0px 6px 5px rgba(0, 0, 0, 0.4);
513
+ }
514
+
515
+ .header-menu-overflow {
516
+ background-color: $menu-overflow;
517
+ z-index: 100;
518
+ box-shadow: 0px 6px 5px rgba(0, 0, 0, 0.4);
519
+ display: none;
520
+ }
521
+
522
+ .header-menu-overflow ul li a {
523
+ color: $white;
524
+ }
525
+
526
+ .header-menu-top .sub-item {
527
+ background-color: $menu-top;
528
+ }
529
+
530
+ .header-menu-overflow .sub-item {
531
+ background-color: $menu-overflow;
532
+ }
533
+
534
+ .header-item,
535
+ .header-item-title {
536
+ float: right;
537
+ padding-left: 20px;
538
+ padding-right: 20px;
539
+ border-top-color: transparent;
540
+ border-top-style: solid;
541
+ border-top-width: 5px;
542
+ box-sizing: border-box;
543
+
544
+ a {
545
+ vertical-align: middle;
546
+ display: table-cell;
547
+ height: $menu-height - 2;
548
+ font-size: 12px;
549
+ }
550
+ }
551
+
552
+ ///sections
553
+ .logo {
554
+ width: $menu-height;
555
+ height: $menu-height;
556
+ float: left;
557
+ padding: 10px;
558
+ }
559
+
560
+ .header-item-container {
561
+ height: 100%;
562
+ }
563
+
564
+ .header-item {
565
+ height: 100%;
566
+ @media #{$large} {
567
+ display: block;
568
+ }
569
+ }
570
+
571
+ .header-item-title {
572
+ float: left;
573
+ border-top-width: 0px;
574
+ height: 100%;
575
+ a.title {
576
+ font-size: 1.5rem;
577
+ padding-left: 5px;
578
+ vertical-align: middle;
579
+ height: $menu-height - 2;
580
+ @media #{$medium}{
581
+ display: table-cell;
582
+ }
583
+ }
584
+ }
585
+
586
+ .header-item.active,
587
+ .header-item:hover {
588
+ border-top-color: $header-margin;
589
+ }
590
+
591
+ .header-item:hover .header-submenu {
592
+ display: block;
593
+ position: absolute;
594
+ }
595
+
596
+ .header-submenu {
597
+ display: none;
598
+ border-top: 2px solid $header-margin;
599
+ width: 200px;
600
+ z-index: 100;
601
+ list-style-type: none;
602
+ transform: translateX(-25%);
603
+ }
604
+
605
+ .sub-item {
606
+ position: relative;
607
+ padding-left: 10px;
608
+ width: 100%;
609
+ border-bottom: 1px solid gray;
610
+ border-left: 1px solid;
611
+ height: 50px;
612
+ text-decoration: none;
613
+ }
614
+
615
+ .sub-item a {
616
+ vertical-align: middle;
617
+ display: table-cell;
618
+ height: 50px;
619
+ }
620
+
621
+ .sub-item:hover {
622
+ border-bottom-color: $header-margin;
623
+ border-left-color: $header-margin;
624
+ }
625
+
626
+ .button-twitter {
627
+ color: $white;
628
+ position: fixed;
629
+ margin-top: $menu-height / 2 - 20;
630
+ margin-right: 10px;
631
+ top: 0;
632
+ right: 0;
633
+ z-index: 10000000000;
634
+ @media #{$large}{
635
+ top: auto;
636
+ bottom: 0;
637
+ }
638
+
639
+ span {
640
+ display: none;
641
+ @media #{$medium}{
642
+ display: inline;
643
+ }
644
+ }
645
+ }
646
+
647
+ footer {
648
+ font-size: 13px;
649
+ }