dev-blog-theme 0.1.0 → 0.2.0

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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 0e49f398fc9964b87e05c2629aec3664666ea7f35ed274ac76ecfbfc069f54de
4
- data.tar.gz: 8108834d111bb1d7bcff8c7f925f3f942d368b1b91119e8f24a1111e0ecdac93
3
+ metadata.gz: 81b606fd8eecb56c5e8cc0d65b48ce4085f18a561ffcd0dd6e7179970b4521af
4
+ data.tar.gz: c5b3c6c2a2d4d0ca5b4d0aeda94bf027706bc7420774a5e2fa78fcee50a4dbb7
5
5
  SHA512:
6
- metadata.gz: e682cef124d5d1d83c6fd62437b282f3da7c2c31e5e35c870ac580a564950fde0f259ce7e729ec42fa472e2fc564e0f83c4e104d363ad411166fd6e2266168c6
7
- data.tar.gz: 1732ce85089963ca69e8b5413a364c1b2baac19525f0684b91927a7426abb9118c76b90e64fc174d9befb44a486cae960a36e4bd7dd1d8f7a1f6983e86d9dcee
6
+ metadata.gz: fe278f2ffcb9d5229fd4cc11cb592d14834ad71558fff0bd3824a6d4dd57d239fdf63bc64f3a7d30e4cf84c00265f44effd2707067c1d1c360d63e3b9d6a3ac9
7
+ data.tar.gz: c550d12adcbc379e3074066ef202de9d3c8968205c7d12636817a252501e38868eac68b4932a22be1cb929363afd64958269d9833e66bf2cb370793e23d16c11
@@ -0,0 +1,30 @@
1
+ {% if comment.url %}
2
+ <a href="{{ comment.url }}" rel="nofollow">
3
+ <img alt="Gravatar for {{ comment.name | xml_escape }}" src="https://secure.gravatar.com/avatar/{{ comment.gravatar }}?s=64&amp;d=retro&amp;r=pg" srcset="https://secure.gravatar.com/avatar/{{ comment.gravatar }}?s=128&amp;d=retro&amp;r=pg 2x" class="avatar avatar-48 photo" height="48" width="48">
4
+ </a>
5
+ {% else %}
6
+ <img alt="Gravatar for {{ comment.name | xml_escape }}" src="https://secure.gravatar.com/avatar/{{ comment.gravatar }}?s=64&amp;d=retro&amp;r=pg" srcset="https://secure.gravatar.com/avatar/{{ comment.gravatar }}?s=128&amp;d=retro&amp;r=pg 2x" class="avatar avatar-48 photo" height="48" width="48">
7
+ {% endif %}
8
+
9
+ <blockquote id="{{ comment.id }}">
10
+ <cite>
11
+ {% if comment.url %}
12
+ <a href="{{ comment.url }}" rel="nofollow">{{ comment.name | xml_escape }}</a>
13
+ {% else %}
14
+ {{ comment.name | xml_escape }}
15
+ {% endif %}
16
+ &ndash;
17
+ <span class="muted" title="{{ comment.date | date_to_rfc822 }}">
18
+ {{ comment.date | date: '%B' }}
19
+ {% assign d = comment.date | date: "%-d" %}
20
+ {% case d %}
21
+ {% when '1' or '21' or '31' %}{{d}}st,
22
+ {% when '2' or '22' %}{{d}}nd,
23
+ {% when '3' or '23' %}{{d}}rd,
24
+ {% else %}{{d}}th,
25
+ {% endcase %}
26
+ {{ comment.date | date: '%Y' }}
27
+ </span>
28
+ <div class="comment-body">{{ comment.message | markdownify }}</div>
29
+ </cite>
30
+ </blockquote>
@@ -0,0 +1,22 @@
1
+ {% capture default_slug %}{{ page.slug | default: (page.title | slugify) }}{% endcapture %}
2
+ {% capture slug %}{{ (page.slug | fallback: default_slug) | downcase | replace: '.', '-' }}{% endcapture %}
3
+ {% assign comments_map = site.data.comments[slug] %}
4
+ {% assign comments = site.emptyArray %}
5
+ {% for comment in comments_map %}
6
+ {% assign comments = comments | push: comment[1] %}
7
+ {% endfor %}
8
+ {% assign comment_count = comments | size %}
9
+ {% assign author = site.authors[page.author] %}
10
+ <div id="comments">
11
+ <h2>Comentários</h2>
12
+ {% include new-comment.html %}
13
+ <h3 id="comment-count">{% if comment_count == 1 %}Um comentário{% else %}{{ comment_count }} comentários{% endif %}</h3>
14
+ <ol id="comments-list">
15
+ {% assign sorted_comments = comments | sort: 'date' %}
16
+ {% for comment in sorted_comments %}
17
+ <li{% if comment.name == author.name %} class="byauthor" {% endif %}>
18
+ {% include comment.html %}
19
+ </li>
20
+ {% endfor %}
21
+ </ol>
22
+ </div>
@@ -1,4 +1,30 @@
1
1
  <footer>
2
2
  Made with <span>&#9829;</span> by Me in Brasil
3
3
  </footer>
4
-
4
+ <script>
5
+ function setupForm() {
6
+ var status = document.getElementById('commentstatus')
7
+ status.innerText = ''
8
+
9
+ var requiredIds = [ 'message', 'email', 'name']
10
+ var missing = requiredIds.filter(id => document.getElementById(id).value.length < 3)
11
+ if (missing.length > 0) {
12
+ status.innerText = 'Alguns campos são obrigatórios - (' + missing.join(', ') + ')'
13
+ return
14
+ }
15
+
16
+ var button = document.getElementById('commentbutton')
17
+ if (button.innerText != 'Clique novamente para Confirmar') {
18
+ button.innerText = 'Clique novamente para Confirmar'
19
+ return
20
+ }
21
+
22
+ var form = document.getElementById('commentform')
23
+ form.action = '{{ site.comments.receiver }}'
24
+ button.innerText = 'Enviando...'
25
+ button.disabled = true
26
+ form.submit()
27
+ var fields = document.getElementById('commentfields')
28
+ fields.disabled = true
29
+ }
30
+ </script>
data/_includes/head.html CHANGED
@@ -3,7 +3,7 @@
3
3
  {%- seo -%}
4
4
  <link href="https://fonts.googleapis.com/css?family=Pacifico|Roboto"
5
5
  rel="stylesheet">
6
- <link rel="stylesheet" href="{{ "/assets/css/style.css" | relative_url }}">
6
+ <link rel="stylesheet" href="{{ "/css/main.css" | relative_url }}">
7
7
  {%- feed_meta -%}
8
8
  {%- if jekyll.environment == 'production' and site.google_analytics -%}
9
9
  {%- include google-analytics.html -%}
@@ -0,0 +1,23 @@
1
+ <form action="/fake" data-action="{{ site.comments.receiver }}" method="post" id="commentform" class="form-horizontal comment-box">
2
+ <input name="redirect" type="hidden" value="{{site.url}}/thanks">
3
+ <input name="post_id" type="hidden" value="{{ slug }}">
4
+ <input name="comment-site" type="hidden" value="{{ site.url }}">
5
+ <div id="comment-box">
6
+ <img src="https://avatars.io/twitter//medium" data-fallbacksrc="/images/comments/unknown-avatar.png" data-role="user-avatar" alt="avatar" class="avatar" id="avatarPreview" />
7
+ <div id="commenttext">
8
+ <div id="commentstatus" class="status"></div>
9
+ <textarea name="message" id="message" class="textarea" placeholder="Escreva algum comentario."></textarea>
10
+ </div>
11
+ </div>
12
+ <div id="comment-author">
13
+ <div class="control-group">
14
+ <input type="hidden" name="avatar" id="avatarInput" />
15
+ <input type="text" name="name" id="name" placeholder="Nome de exibição" title="Nome que ficará visivel nos comentarios" data-required="true" />
16
+ <input type="email" name="email" id="email" placeholder="email" data-required="true" value="" />
17
+ <input type="url" name="url" id="url" placeholder="https://mywebsite.com" />
18
+ <span class="info-circle" title="Identity is used to generate an avatar image only. It is not submitted with the form."></span>
19
+ <button type="button" onclick="setupForm()" id="commentbutton">Comentar</button>
20
+ </div>
21
+ </div>
22
+ </form>
23
+ <div id="commentstatus" style="clear:both" class="status"></div>
@@ -0,0 +1,33 @@
1
+ {% if paginator.total_pages > 1 %}
2
+ <div class="pagination">
3
+ {% if paginator.previous_page %}
4
+ <a href="{{ paginator.previous_page_path | relative_url }}">
5
+ &laquo; Prev
6
+ </a>
7
+ {% else %}
8
+ <span>&laquo; Prev</span>
9
+ {% endif %}
10
+
11
+ {% for page in (1..paginator.total_pages) %}
12
+ {% if page == paginator.page %}
13
+ <em>{{ page }}</em>
14
+ {% elsif page == 1 %}
15
+ <a href="{{ paginator.previous_page_path | relative_url }}">
16
+ {{ page }}
17
+ </a>
18
+ {% else %}
19
+ <a href="{{ site.paginate_path | relative_url | replace: ':num', page }}">
20
+ {{ page }}
21
+ </a>
22
+ {% endif %}
23
+ {% endfor %}
24
+
25
+ {% if paginator.next_page %}
26
+ <a href="{{ paginator.next_page_path | relative_url }}">
27
+ Next &raquo;
28
+ </a>
29
+ {% else %}
30
+ <span>Next &raquo;</span>
31
+ {% endif %}
32
+ </div>
33
+ {% endif %}
data/_layouts/home.html CHANGED
@@ -1,17 +1,14 @@
1
1
  ---
2
2
  layout: default
3
3
  ---
4
- {%- if page.title -%}
5
- <h1 class="page-heading"></h1>
6
- {%- endif -%}
7
4
 
8
5
  {{ content }}
9
6
 
10
7
  {%- if site.posts.size > 0 -%}
11
- <h2 class="post-list-heading">{{ page.list_title | default: "Posts" }}</h2>
8
+ <h2 class="post-list-heading">{{ page.list_title | default: "" }}</h2>
12
9
 
13
10
  <div class="post-list">
14
- {%- for post in site.posts -%}
11
+ {%- for post in paginator.posts -%}
15
12
  <div class="post-item">
16
13
  <span class="post-item-title">
17
14
  <h2>
@@ -28,4 +25,5 @@ layout: default
28
25
  </div>
29
26
  {%- endfor -%}
30
27
  </div>
28
+ {%- include paginator.html -%}
31
29
  {%- endif -%}
data/_layouts/post.html CHANGED
@@ -16,5 +16,7 @@ layout: default
16
16
  <div class="post">
17
17
  {{ content }}
18
18
  </div>
19
+ <hr>
20
+ {%- include comments.html -%}
19
21
  <a class="u-url" href="{{ page.url | relative_url }}" hidden></a>
20
22
  </article>
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: dev-blog-theme
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.0
4
+ version: 0.2.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Nicolas Tarzia
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2019-01-31 00:00:00.000000000 Z
11
+ date: 2019-02-01 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -89,16 +89,18 @@ extra_rdoc_files: []
89
89
  files:
90
90
  - LICENSE.txt
91
91
  - README.md
92
+ - _includes/comment.html
93
+ - _includes/comments.html
92
94
  - _includes/footer.html
93
95
  - _includes/head.html
94
96
  - _includes/header.html
97
+ - _includes/new-comment.html
98
+ - _includes/paginator.html
95
99
  - _includes/social.html
96
100
  - _layouts/default.html
97
101
  - _layouts/home.html
98
102
  - _layouts/page.html
99
103
  - _layouts/post.html
100
- - _sass/dev-blog-theme.scss
101
- - assets/css/style.css
102
104
  homepage: https://github.com/nicolastarzia/dev-blog-theme.
103
105
  licenses:
104
106
  - MIT
@@ -1,106 +0,0 @@
1
- html, body{
2
- margin: 0;
3
- display:flex;
4
- flex-direction: column;
5
- min-height:100vh;
6
- font-family:Roboto, sans-serif;
7
- }
8
- body > header{
9
- display: flex;
10
- flex-wrap: wrap;
11
- justify-content: space-between;
12
- align-items: center;
13
- padding: 0.25rem 1rem 0;
14
- box-shadow: 0 -3px 9px #000;
15
- }
16
- body > header h1{
17
- margin: 0;
18
- }
19
- header div, header nav{
20
- flex: 0 1 100%;
21
- }
22
- header nav{
23
- flex-basis: auto !important;
24
- }
25
- header nav ul{
26
- list-style: none;
27
- padding: 0;
28
- display: flex;
29
- justify-content: space-between;
30
- }
31
- @media(min-width: 1300px){
32
- header div{
33
- flex: 0 1 75%;
34
- }
35
- header nav{
36
- flex: 0 1 25%;
37
- }
38
- }
39
- @media(min-width: 550px){
40
- body > header{
41
- padding: 0 1rem;
42
- }
43
- header div{
44
- flex: 0 1 60%;
45
- }
46
- header nav{
47
- flex: 0 1 40%;
48
- }
49
- header nav ul li{
50
- justify-content: space-around;
51
- }
52
- }
53
- footer{
54
- background-color: #005F97;
55
- color: #B7D7D8;
56
- margin-top: auto;
57
- text-align: center;
58
- }
59
- footer span{
60
- color: #e25555;
61
- }
62
- a{
63
- text-decoration: none;
64
- color: #FF8984;
65
- transition: background-color 400ms linear;
66
- }
67
- a:hover,
68
- a:focus{
69
- background-color: #204E5F !important;
70
- }
71
- section{
72
- max-width: 700px;
73
- margin: 0 auto;
74
- padding:1rem;
75
- }
76
- h2{
77
- margin-bottom:0;
78
- }
79
- .post-item{
80
- margin-bottom: 20px;
81
- }
82
- .post-item-date{
83
- margin-bottom: 20px;
84
- color: #666;
85
- font-weight: 600;
86
- font-size: 0.7rem;
87
- }
88
- .post-item-summary{
89
- line-height: 1.375rem;
90
- }
91
- article h1{
92
- font-size: 2rem;
93
- }
94
- .pagination{
95
- display: flex;
96
- flex-direction: row;
97
- flex-wrap: wrap;
98
- justify-content: center;
99
- }
100
- .pagination a{
101
- font-size: 20px;
102
- border: 1px solid #005F97;
103
- margin: 10px;
104
- padding: 10px;
105
- }
106
-
data/assets/css/style.css DELETED
@@ -1,139 +0,0 @@
1
- html, body{
2
- margin: 0;
3
- display:flex;
4
- flex-direction: column;
5
- min-height:100vh;
6
- font-family:Roboto, sans-serif;
7
- }
8
- body > header{
9
- display: flex;
10
- flex-wrap: wrap;
11
- justify-content: space-between;
12
- align-items: center;
13
- padding: 0.25rem 1rem 0;
14
- box-shadow: 0 -3px 9px #000;
15
- }
16
- body > header h1{
17
- margin: 0;
18
- letter-spacing: 0.25rem;
19
- }
20
- header div, header nav{
21
- flex: 0 1 100%;
22
- }
23
- header nav{
24
- flex-basis: auto !important;
25
- }
26
- header nav ul{
27
- list-style: none;
28
- padding: 0;
29
- display: flex;
30
- justify-content: space-between;
31
- }
32
- @media(min-width: 1300px){
33
- header div{
34
- flex: 0 1 75%;
35
- }
36
- header nav{
37
- flex: 0 1 25%;
38
- }
39
- }
40
- @media(min-width: 550px){
41
- body > header{
42
- padding: 0 1rem;
43
- }
44
- header div{
45
- flex: 0 1 60%;
46
- }
47
- header nav{
48
- flex: 0 1 40%;
49
- }
50
- header nav ul li{
51
- justify-content: space-around;
52
- }
53
- }
54
- footer{
55
- background-color: #005F97;
56
- color: #B7D7D8;
57
- margin-top: auto;
58
- text-align: center;
59
- }
60
- footer span{
61
- color: #e25555;
62
- }
63
- a{
64
- text-decoration: none;
65
- color: #FF8984;
66
- transition: background-color 400ms linear;
67
- }
68
- a:hover,
69
- a:focus{
70
- background-color: #204E5F !important;
71
- }
72
- h1{
73
- color: #FF8984;
74
- }
75
- section{
76
- max-width: 700px;
77
- margin: 0 auto;
78
- padding:1rem;
79
- }
80
- h2{
81
- margin-bottom:0;
82
- }
83
- .post-item{
84
- margin-bottom: 20px;
85
- }
86
- .post-item-date{
87
- margin-bottom: 20px;
88
- color: #666;
89
- font-weight: 600;
90
- font-size: 0.7rem;
91
- }
92
- .post-item-summary{
93
- line-height: 1.375rem;
94
- }
95
- article h1{
96
- font-size: 2rem;
97
- }
98
- .pagination{
99
- display: flex;
100
- flex-direction: row;
101
- flex-wrap: wrap;
102
- justify-content: center;
103
- }
104
- .pagination a{
105
- font-size: 20px;
106
- border: 1px solid #005F97;
107
- margin: 10px;
108
- padding: 10px;
109
- }
110
- .next{
111
- float:right;
112
- }
113
- #tags{
114
- list-style-type: none;
115
- margin:0;
116
- padding:0;
117
- }
118
- #tags > li{
119
- float:left;
120
- }
121
- #tags > li a{
122
- text-align:center;
123
- padding: 0px 16px;
124
- text-decoration:none;
125
- }
126
- #meta div{
127
- display:block;
128
- height: 50px;
129
- }
130
- #content h4{
131
- font-weight: 100;
132
- font-size: 0.75rem;
133
- margin:0;
134
- }
135
- #content h1{
136
- font-size: 2rem;
137
- letter-spacing: 0.25rem;
138
- margin: 0 0;
139
- }