dev-blog-theme 0.1.0 → 0.2.0

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
  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
- }