jekyll-theme-hydeout 3.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (47) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.md +11 -0
  3. data/README.md +98 -0
  4. data/_includes/comments.html +6 -0
  5. data/_includes/copyright.html +4 -0
  6. data/_includes/custom-foot.html +1 -0
  7. data/_includes/custom-head.html +1 -0
  8. data/_includes/disqus.html +43 -0
  9. data/_includes/favicons.html +2 -0
  10. data/_includes/font-includes.html +6 -0
  11. data/_includes/google-analytics.html +11 -0
  12. data/_includes/head.html +30 -0
  13. data/_includes/pagination.html +16 -0
  14. data/_includes/post-meta.html +30 -0
  15. data/_includes/post-tags.html +9 -0
  16. data/_includes/related_posts.html +15 -0
  17. data/_includes/search-form.html +17 -0
  18. data/_includes/sidebar-icon-links.html +26 -0
  19. data/_includes/sidebar-nav.html +34 -0
  20. data/_includes/sidebar.html +16 -0
  21. data/_includes/svg/back-arrow.svg +4 -0
  22. data/_includes/svg/download.svg +4 -0
  23. data/_includes/svg/feed.svg +5 -0
  24. data/_includes/svg/github.svg +2 -0
  25. data/_includes/svg/search.svg +4 -0
  26. data/_includes/svg/tags.svg +4 -0
  27. data/_includes/tags-list.html +39 -0
  28. data/_layouts/category.html +21 -0
  29. data/_layouts/default.html +16 -0
  30. data/_layouts/home.html +38 -0
  31. data/_layouts/page.html +10 -0
  32. data/_layouts/post.html +18 -0
  33. data/_sass/hydeout.scss +17 -0
  34. data/_sass/hydeout/_base.scss +102 -0
  35. data/_sass/hydeout/_code.scss +82 -0
  36. data/_sass/hydeout/_layout.scss +264 -0
  37. data/_sass/hydeout/_masthead.scss +25 -0
  38. data/_sass/hydeout/_message.scss +11 -0
  39. data/_sass/hydeout/_pagination.scss +41 -0
  40. data/_sass/hydeout/_posts.scss +88 -0
  41. data/_sass/hydeout/_search.scss +16 -0
  42. data/_sass/hydeout/_syntax.scss +65 -0
  43. data/_sass/hydeout/_tags.scss +23 -0
  44. data/_sass/hydeout/_type.scss +125 -0
  45. data/_sass/hydeout/_variables.scss +44 -0
  46. data/assets/css/main.scss +6 -0
  47. metadata +160 -0
@@ -0,0 +1,25 @@
1
+ // Masthead
2
+ //
3
+ // Super small header above the content for site name and short description.
4
+
5
+ .masthead {
6
+ padding-top: 1rem;
7
+ padding-bottom: 1rem;
8
+ margin-bottom: 3rem;
9
+ }
10
+
11
+ .masthead-title {
12
+ margin-top: 0;
13
+ margin-bottom: 0;
14
+ color: $gray-5;
15
+
16
+ a {
17
+ color: inherit;
18
+ }
19
+
20
+ small {
21
+ font-size: 75%;
22
+ font-weight: 400;
23
+ opacity: .5;
24
+ }
25
+ }
@@ -0,0 +1,11 @@
1
+ // Messages
2
+ //
3
+ // Show alert messages to users. You may add it to single elements like a `<p>`,
4
+ // or to a parent if there are multiple elements to show.
5
+
6
+ .message {
7
+ margin-bottom: 1rem;
8
+ padding: 1rem;
9
+ color: #717171;
10
+ background-color: #f9f9f9;
11
+ }
@@ -0,0 +1,41 @@
1
+ // Pagination
2
+ //
3
+ // Super lightweight (HTML-wise) blog pagination. `span`s are provide for when
4
+ // there are no more previous or next posts to show.
5
+
6
+ .pagination {
7
+ overflow: hidden; // clearfix
8
+ margin: $section-spacing 0;
9
+ color: $gray-3;
10
+ text-align: center;
11
+ display: flex;
12
+ width: 100%;
13
+
14
+ > * {
15
+ display: block;
16
+ padding: $padding-v $padding-h;
17
+ border: solid $border-color;
18
+ border-width: 1px;
19
+ flex-grow: 1;
20
+ margin-left: -1px;
21
+
22
+ &:first-child {
23
+ margin-left: 0;
24
+ border-top-left-radius: $border-radius;
25
+ border-bottom-left-radius: $border-radius;
26
+ }
27
+
28
+ &:last-child {
29
+ border-top-right-radius: $border-radius;
30
+ border-bottom-right-radius: $border-radius;
31
+ }
32
+ }
33
+ }
34
+
35
+ /*
36
+ Pagination items can be `span`s or `a`s but
37
+ only provide a hover state for linked pagination items
38
+ */
39
+ a.pagination-item:hover {
40
+ background-color: $border-color;
41
+ }
@@ -0,0 +1,88 @@
1
+ // Posts and pages
2
+ //
3
+ // Each post is wrapped in `.post` and is used on default and post layouts. Each
4
+ // page is wrapped in `.page` and is only used on the page layout.
5
+
6
+ .post-body + *, .post .post-body ~ * + * {
7
+ padding-top: $section-spacing;
8
+ border-top: 1px solid $border-color;
9
+ margin-top: $section-spacing;
10
+ }
11
+
12
+ .post, .page {
13
+ .content {
14
+ li + li {
15
+ margin-top: .25rem;
16
+ }
17
+ }
18
+ }
19
+
20
+ // Blog post or page title
21
+ .page-title,
22
+ .post-title,
23
+ .post-title a {
24
+ color: $heading-color;
25
+ }
26
+ .page-title,
27
+ .post-title {
28
+ margin-top: 0;
29
+ }
30
+
31
+ // h1-size h2
32
+ h2.post-title, h2.page-title {
33
+ font-size: 2rem;
34
+ }
35
+
36
+ // Meta data line below post title
37
+ .post-meta {
38
+ margin-top: -.5rem;
39
+ margin-bottom: 1rem;
40
+ color: $body-muted;
41
+ }
42
+
43
+ .post-tags a {
44
+ font-size: 0.8em;
45
+ margin-right: 0.5rem;
46
+ white-space:nowrap;
47
+ .tag-name { text-transform: capitalize; }
48
+
49
+ opacity: 0.75;
50
+ &:hover {
51
+ text-decoration: none;
52
+ opacity: 1;
53
+ }
54
+ }
55
+
56
+ .posts-by-tag h2 {
57
+ text-transform: capitalize;
58
+ }
59
+
60
+ .posts-list {
61
+ padding-left: 0;
62
+ list-style: none;
63
+
64
+ h3 {
65
+ margin-top: 0;
66
+ }
67
+
68
+ li {
69
+ small {
70
+ font-size: 75%;
71
+ color: #999;
72
+ white-space: nowrap;
73
+ }
74
+
75
+ a:hover {
76
+ color: $link-color;
77
+ text-decoration: none;
78
+
79
+ small {
80
+ color: inherit;
81
+ }
82
+ }
83
+ }
84
+ }
85
+
86
+ button.disqus-load {
87
+ margin-top: 1em;
88
+ }
@@ -0,0 +1,16 @@
1
+ .search-row {
2
+ display: flex;
3
+ border: 1px solid $border-color;
4
+ border-radius: $border-radius;
5
+ padding: 2px;
6
+
7
+ input {
8
+ border: 0;
9
+ }
10
+
11
+ input + input { margin-left: 2px; }
12
+
13
+ input[type="text"], input[type="search"] {
14
+ flex-grow: 1;
15
+ }
16
+ }
@@ -0,0 +1,65 @@
1
+ .highlight .hll { background-color: #ffc; }
2
+ .highlight .c { color: #999; } /* Comment */
3
+ .highlight .err { color: #a00; background-color: #faa } /* Error */
4
+ .highlight .k { color: #069; } /* Keyword */
5
+ .highlight .o { color: #555 } /* Operator */
6
+ .highlight .cm { color: #09f; font-style: italic } /* Comment.Multiline */
7
+ .highlight .cp { color: #099 } /* Comment.Preproc */
8
+ .highlight .c1 { color: #999; } /* Comment.Single */
9
+ .highlight .cs { color: #999; } /* Comment.Special */
10
+ .highlight .gd { background-color: #fcc; border: 1px solid #c00 } /* Generic.Deleted */
11
+ .highlight .ge { font-style: italic } /* Generic.Emph */
12
+ .highlight .gr { color: #f00 } /* Generic.Error */
13
+ .highlight .gh { color: #030; } /* Generic.Heading */
14
+ .highlight .gi { background-color: #cfc; border: 1px solid #0c0 } /* Generic.Inserted */
15
+ .highlight .go { color: #aaa } /* Generic.Output */
16
+ .highlight .gp { color: #009; } /* Generic.Prompt */
17
+ .highlight .gs { } /* Generic.Strong */
18
+ .highlight .gu { color: #030; } /* Generic.Subheading */
19
+ .highlight .gt { color: #9c6 } /* Generic.Traceback */
20
+ .highlight .kc { color: #069; } /* Keyword.Constant */
21
+ .highlight .kd { color: #069; } /* Keyword.Declaration */
22
+ .highlight .kn { color: #069; } /* Keyword.Namespace */
23
+ .highlight .kp { color: #069 } /* Keyword.Pseudo */
24
+ .highlight .kr { color: #069; } /* Keyword.Reserved */
25
+ .highlight .kt { color: #078; } /* Keyword.Type */
26
+ .highlight .m { color: #f60 } /* Literal.Number */
27
+ .highlight .s { color: #d44950 } /* Literal.String */
28
+ .highlight .na { color: #4f9fcf } /* Name.Attribute */
29
+ .highlight .nb { color: #366 } /* Name.Builtin */
30
+ .highlight .nc { color: #0a8; } /* Name.Class */
31
+ .highlight .no { color: #360 } /* Name.Constant */
32
+ .highlight .nd { color: #99f } /* Name.Decorator */
33
+ .highlight .ni { color: #999; } /* Name.Entity */
34
+ .highlight .ne { color: #c00; } /* Name.Exception */
35
+ .highlight .nf { color: #c0f } /* Name.Function */
36
+ .highlight .nl { color: #99f } /* Name.Label */
37
+ .highlight .nn { color: #0cf; } /* Name.Namespace */
38
+ .highlight .nt { color: #2f6f9f; } /* Name.Tag */
39
+ .highlight .nv { color: #033 } /* Name.Variable */
40
+ .highlight .ow { color: #000; } /* Operator.Word */
41
+ .highlight .w { color: #bbb } /* Text.Whitespace */
42
+ .highlight .mf { color: #f60 } /* Literal.Number.Float */
43
+ .highlight .mh { color: #f60 } /* Literal.Number.Hex */
44
+ .highlight .mi { color: #f60 } /* Literal.Number.Integer */
45
+ .highlight .mo { color: #f60 } /* Literal.Number.Oct */
46
+ .highlight .sb { color: #c30 } /* Literal.String.Backtick */
47
+ .highlight .sc { color: #c30 } /* Literal.String.Char */
48
+ .highlight .sd { color: #c30; font-style: italic } /* Literal.String.Doc */
49
+ .highlight .s2 { color: #c30 } /* Literal.String.Double */
50
+ .highlight .se { color: #c30; } /* Literal.String.Escape */
51
+ .highlight .sh { color: #c30 } /* Literal.String.Heredoc */
52
+ .highlight .si { color: #a00 } /* Literal.String.Interpol */
53
+ .highlight .sx { color: #c30 } /* Literal.String.Other */
54
+ .highlight .sr { color: #3aa } /* Literal.String.Regex */
55
+ .highlight .s1 { color: #c30 } /* Literal.String.Single */
56
+ .highlight .ss { color: #fc3 } /* Literal.String.Symbol */
57
+ .highlight .bp { color: #366 } /* Name.Builtin.Pseudo */
58
+ .highlight .vc { color: #033 } /* Name.Variable.Class */
59
+ .highlight .vg { color: #033 } /* Name.Variable.Global */
60
+ .highlight .vi { color: #033 } /* Name.Variable.Instance */
61
+ .highlight .il { color: #f60 } /* Literal.Number.Integer.Long */
62
+
63
+ .css .o,
64
+ .css .o + .nt,
65
+ .css .nt + .nt { color: #999; }
@@ -0,0 +1,23 @@
1
+ .tags-list {
2
+ a {
3
+ margin-right: 0.5em;
4
+ white-space: nowrap;
5
+ opacity: 0.75;
6
+
7
+ .tag-count {
8
+ background: $link-color;
9
+ color: rgba(255, 255, 255, 0.8);
10
+ margin-left: 0.25em;
11
+ border-radius: 1000px;
12
+ font-size: 0.75em;
13
+ padding-left: 0.6em;
14
+ padding-right: 0.6em;
15
+ }
16
+
17
+ // No underline because it looks weird with badge
18
+ &:hover {
19
+ text-decoration: none;
20
+ opacity: 1;
21
+ }
22
+ }
23
+ }
@@ -0,0 +1,125 @@
1
+ // Typography
2
+ //
3
+ // Headings, body text, lists, and other misc typographic elements.
4
+
5
+ h1, h2, h3, h4, h5, h6, .site-title {
6
+ margin-bottom: $heading-spacing;
7
+ font-weight: 600;
8
+ line-height: 1.25;
9
+ color: $heading-color;
10
+ text-rendering: optimizeLegibility;
11
+ }
12
+
13
+ h1 {
14
+ font-size: 2rem;
15
+ }
16
+
17
+ h2 {
18
+ margin-top: 1rem;
19
+ font-size: 1.5rem;
20
+ }
21
+
22
+ h3 {
23
+ margin-top: 1.5rem;
24
+ font-size: 1.25rem;
25
+ }
26
+
27
+ h4, h5, h6 {
28
+ margin-top: 1rem;
29
+ font-size: 1rem;
30
+ }
31
+
32
+ p {
33
+ margin-top: 0;
34
+ margin-bottom: 1rem;
35
+ }
36
+
37
+ strong {
38
+ color: #303030;
39
+ }
40
+
41
+ ul, ol, dl {
42
+ margin-top: 0;
43
+ margin-bottom: 1rem;
44
+ }
45
+
46
+ dt {
47
+ font-weight: bold;
48
+ }
49
+
50
+ dd {
51
+ margin-bottom: .5rem;
52
+ }
53
+
54
+ hr {
55
+ position: relative;
56
+ margin: 1.5rem 0;
57
+ border: 0;
58
+ border-top: 1px solid #eee;
59
+ border-bottom: 1px solid #fff;
60
+ }
61
+
62
+ abbr {
63
+ font-size: 85%;
64
+ font-weight: bold;
65
+ color: #555;
66
+ text-transform: uppercase;
67
+
68
+ &[title] {
69
+ cursor: help;
70
+ border-bottom: 1px dotted $border-color;
71
+ }
72
+ }
73
+
74
+ blockquote {
75
+ padding: .5rem 1rem;
76
+ margin: .8rem 0;
77
+ color: #7a7a7a;
78
+ border-left: .25rem solid $border-color;
79
+
80
+ p:last-child {
81
+ margin-bottom: 0;
82
+ }
83
+
84
+ @media (min-width: 30em) {
85
+ padding-right: 5rem;
86
+ padding-left: 1.25rem;
87
+ }
88
+ }
89
+
90
+
91
+ // Markdown footnotes
92
+ //
93
+ // See the example content post for an example.
94
+
95
+ // Footnote number within body text
96
+ a[href^="#fn:"],
97
+ // Back to footnote link
98
+ a[href^="#fnref:"] {
99
+ display: inline-block;
100
+ margin-left: .1rem;
101
+ font-weight: bold;
102
+ }
103
+
104
+ // List of footnotes
105
+ .footnotes {
106
+ margin-top: 2rem;
107
+ font-size: 85%;
108
+ }
109
+
110
+ // Custom type
111
+ //
112
+ // Extend paragraphs with `.lead` for larger introductory text.
113
+
114
+ .lead {
115
+ font-size: 1.25rem;
116
+ font-weight: 300;
117
+ }
118
+
119
+ // SVG Icons
120
+ a svg, .icon svg {
121
+ height: 1em;
122
+ width: auto;
123
+ }
124
+ a svg { fill: $link-color; }
125
+ .icon { vertical-align: middle; }
@@ -0,0 +1,44 @@
1
+ $gray-1: #f9f9f9 !default;
2
+ $gray-2: #e5e5e5 !default;
3
+ $gray-3: #ccc !default;
4
+ $gray-4: #767676 !default;
5
+ $gray-5: #515151 !default;
6
+ $gray-6: #313131 !default;
7
+
8
+ $red: #ac4142 !default;
9
+ $orange: #d28445 !default;
10
+ $yellow: #f4bf75 !default;
11
+ $green: #90a959 !default;
12
+ $cyan: #75b5aa !default;
13
+ $blue: #268bd2 !default;
14
+ $brown: #8f5536 !default;
15
+
16
+ $root-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif !default;
17
+ $root-font-size: 1rem !default;
18
+ $root-line-height: 1.5 !default;
19
+
20
+ $body-color: $gray-5 !default;
21
+ $body-muted: $gray-4 !default;
22
+ $body-bg: #fff !default;
23
+ $link-color: $blue !default;
24
+ $heading-color: $gray-6 !default;
25
+
26
+ $border-color: $gray-2 !default;
27
+ $border-radius: 300px !default;
28
+ $padding-v: 1em !default;
29
+ $padding-h: 1.5em !default;
30
+ $heading-spacing: 0.5rem !default;
31
+ $section-spacing: 2rem !default;
32
+ $sidebar-width: 18rem !default;
33
+
34
+ $large-breakpoint: 48rem !default;
35
+ $large-font-size: 1.25rem !default;
36
+
37
+ $code-font-family: Menlo, Monaco, "Courier New", monospace !default;
38
+ $code-color: #bf616a !default;
39
+
40
+
41
+ // Hyde theming
42
+ $sidebar-bg-color: #202020 !default;
43
+ $sidebar-sticky: true !default;
44
+ $layout-reverse: false !default;