Move comments above form elements and add missing English UI text strings

This commit is contained in:
Michael Rose 2016-08-11 10:14:27 -04:00
parent cb26538572
commit 7aa4e3ca3d
4 changed files with 281 additions and 186 deletions

View file

@ -3,35 +3,45 @@
# English (default)
# -----------------
en: &DEFAULT_EN
page : "Page"
pagination_previous : "Previous"
pagination_next : "Next"
breadcrumb_home_label : "Home"
breadcrumb_separator : "/"
toc_label : "On This Page"
ext_link_label : "Direct Link"
less_than : "less than"
minute_read : "minute read"
share_on_label : "Share on"
meta_label :
tags_label : "Tags:"
categories_label : "Categories:"
date_label : "Updated:"
comments_label : "Leave a Comment"
comments_title : "Comments"
more_label : "Learn More"
related_label : "You May Also Enjoy"
follow_label : "Follow:"
feed_label : "Feed"
powered_by : "Powered by"
website_label : "Website"
email_label : "Email"
recent_posts : "Recent Posts"
undefined_wpm : "Undefined parameter words_per_minute at _config.yml"
comment_success_title : "Comment submitted"
comment_success_msg : "Thanks for your comment! It will show on the site once it has been approved."
comment_error_title : "I Am Error"
comment_error_msg : "Sorry, there was an error with your submission. Please make sure all required fields have been completed and try again."
page : "Page"
pagination_previous : "Previous"
pagination_next : "Next"
breadcrumb_home_label : "Home"
breadcrumb_separator : "/"
toc_label : "On This Page"
ext_link_label : "Direct Link"
less_than : "less than"
minute_read : "minute read"
share_on_label : "Share on"
meta_label :
tags_label : "Tags:"
categories_label : "Categories:"
date_label : "Updated:"
comments_label : "Leave a Comment"
comments_title : "Comments"
more_label : "Learn More"
related_label : "You May Also Enjoy"
follow_label : "Follow:"
feed_label : "Feed"
powered_by : "Powered by"
website_label : "Website"
email_label : "Email"
recent_posts : "Recent Posts"
undefined_wpm : "Undefined parameter words_per_minute at _config.yml"
comment_form_info : "Your email address will not be published. Required fields are marked"
comment_form_comment_label : "Comment"
comment_form_md_info : "Markdown is supported."
comment_form_name_label : "Name"
comment_form_email_label : "Email address"
comment_form_website_label : "Website (optional)"
comment_btn_submit : "Submit Comment"
comment_btn_submitted : "Submitted"
comment_success_title : "Comment submitted"
comment_success_msg : "Thanks for your comment! It will show on the site once it has been approved."
comment_error_title : "Error"
comment_error_msg : "Sorry, there was an error with your submission. Please make sure all required fields have been completed and try again."
close_btn_label : "close"
loading_label : "Loading..."
en-US:
<<: *DEFAULT_EN
en-CA:
@ -44,30 +54,45 @@ en-AU:
# Spanish
# --------------
es: &DEFAULT_ES
page : "Página"
pagination_previous : "Anterior"
pagination_next : "Siguiente"
breadcrumb_home_label : "Inicio"
breadcrumb_separator : "/"
toc_label : "Contenidos"
ext_link_label : "Enlace"
less_than : "menos de"
minute_read : "minuto de lectura"
share_on_label : "Compartir"
meta_label :
tags_label : "Etiquetas:"
categories_label : "Categorías:"
date_label : "Actualizado:"
comments_label : "Comentar"
more_label : "Ver más"
related_label : "Podrías ver también"
follow_label : "Seguir:"
feed_label : "Feed"
powered_by : "Powered by"
website_label : "Sitio web"
email_label : "Email"
recent_posts : "Entradas recientes"
undefined_wpm : "Parametro words_per_minute (Palabras por minuto) no definido en _config.yml"
page : "Página"
pagination_previous : "Anterior"
pagination_next : "Siguiente"
breadcrumb_home_label : "Inicio"
breadcrumb_separator : "/"
toc_label : "Contenidos"
ext_link_label : "Enlace"
less_than : "menos de"
minute_read : "minuto de lectura"
share_on_label : "Compartir"
meta_label :
tags_label : "Etiquetas:"
categories_label : "Categorías:"
date_label : "Actualizado:"
comments_label : "Comentar"
comments_title :
more_label : "Ver más"
related_label : "Podrías ver también"
follow_label : "Seguir:"
feed_label : "Feed"
powered_by : "Powered by"
website_label : "Sitio web"
email_label : "Email"
recent_posts : "Entradas recientes"
undefined_wpm : "Parametro words_per_minute (Palabras por minuto) no definido en _config.yml"
comment_form_info :
comment_form_comment_label :
comment_form_md_info :
comment_form_name_label :
comment_form_email_label :
comment_form_website_label :
comment_btn_submit :
comment_btn_submitted :
comment_success_title :
comment_success_msg :
comment_error_title :
comment_error_msg :
close_btn_label :
loading_label :
es-ES:
<<: *DEFAULT_ES
es-CO:
@ -76,30 +101,45 @@ es-CO:
# French
# -----------------
fr: &DEFAULT_FR
page : "Page"
pagination_previous : "Précédent"
pagination_next : "Suivant"
breadcrumb_home_label : "Accueil"
breadcrumb_separator : "/"
toc_label : "Sur cette page"
ext_link_label : "Lien direct"
less_than : "plus petit que"
minute_read : "minute de lecture"
share_on_label : "Partager sur"
meta_label :
tags_label : "Tags :"
categories_label : "Catégories :"
date_label : "Mis à jour :"
comments_label : "Laisser un commentaire"
more_label : "Lire plus"
related_label : "Vous pourriez aimer"
follow_label : "Suivez moi"
feed_label : "Flux"
powered_by : "Propulsé par"
website_label : "Site"
email_label : "Email"
recent_posts : "Posts récents"
undefined_wpm : "Le paramètre words_per_minute n'est pas défini dans _config.yml"
page : "Page"
pagination_previous : "Précédent"
pagination_next : "Suivant"
breadcrumb_home_label : "Accueil"
breadcrumb_separator : "/"
toc_label : "Sur cette page"
ext_link_label : "Lien direct"
less_than : "plus petit que"
minute_read : "minute de lecture"
share_on_label : "Partager sur"
meta_label :
tags_label : "Tags :"
categories_label : "Catégories :"
date_label : "Mis à jour :"
comments_label : "Laisser un commentaire"
comments_title :
more_label : "Lire plus"
related_label : "Vous pourriez aimer"
follow_label : "Suivez moi"
feed_label : "Flux"
powered_by : "Propulsé par"
website_label : "Site"
email_label : "Email"
recent_posts : "Posts récents"
undefined_wpm : "Le paramètre words_per_minute n'est pas défini dans _config.yml"
comment_form_info :
comment_form_comment_label :
comment_form_md_info :
comment_form_name_label :
comment_form_email_label :
comment_form_website_label :
comment_btn_submit :
comment_btn_submitted :
comment_success_title :
comment_success_msg :
comment_error_title :
comment_error_msg :
close_btn_label :
loading_label :
fr-FR:
<<: *DEFAULT_FR
fr-BE:
@ -110,60 +150,90 @@ fr-CH:
# Turkish
# -----------------
tr: &DEFAULT_TR
page : "Sayfa"
pagination_previous : "Önceki"
pagination_next : "Sonraki"
breadcrumb_home_label : "Ana Sayfa"
breadcrumb_separator : "/"
toc_label : "İçindekiler"
ext_link_label : "Doğrudan Bağlantı"
less_than : "Şu süreden az: "
minute_read : "dakika tahmini okuma süresi"
share_on_label : "Paylaş"
meta_label :
tags_label : "Etiketler:"
categories_label : "Kategoriler:"
date_label : "Güncelleme tarihi:"
comments_label : "Yorum yapın"
more_label : "Daha fazlasını öğrenin"
related_label : "Bunlar ilginizi çekebilir:"
follow_label : "Takip et:"
feed_label : "RSS"
powered_by : "Emeği geçenler: "
website_label : "Web sayfası"
email_label : "E-posta"
recent_posts : "Son yazılar"
undefined_wpm : "_config.yml dosyasında tanımlanmamış words_per_minute parametresi"
page : "Sayfa"
pagination_previous : "Önceki"
pagination_next : "Sonraki"
breadcrumb_home_label : "Ana Sayfa"
breadcrumb_separator : "/"
toc_label : "İçindekiler"
ext_link_label : "Doğrudan Bağlantı"
less_than : "Şu süreden az: "
minute_read : "dakika tahmini okuma süresi"
share_on_label : "Paylaş"
meta_label :
tags_label : "Etiketler:"
categories_label : "Kategoriler:"
date_label : "Güncelleme tarihi:"
comments_label : "Yorum yapın"
comments_title :
more_label : "Daha fazlasını öğrenin"
related_label : "Bunlar ilginizi çekebilir:"
follow_label : "Takip et:"
feed_label : "RSS"
powered_by : "Emeği geçenler: "
website_label : "Web sayfası"
email_label : "E-posta"
recent_posts : "Son yazılar"
undefined_wpm : "_config.yml dosyasında tanımlanmamış words_per_minute parametresi"
comment_form_info :
comment_form_comment_label :
comment_form_md_info :
comment_form_name_label :
comment_form_email_label :
comment_form_website_label :
comment_btn_submit :
comment_btn_submitted :
comment_success_title :
comment_success_msg :
comment_error_title :
comment_error_msg :
close_btn_label :
loading_label :
tr-TR:
<<: *DEFAULT_TR
# Brazilian Portguese
# -----------------
pt: &DEFAULT_PT
page : "Página"
pagination_previous : "Anterior"
pagination_next : "Próxima"
breadcrumb_home_label : "Home"
breadcrumb_separator : "/"
toc_label : "Nesta página"
ext_link_label : "Link direto"
less_than : "meno que"
minute_read : "minutos de leitura"
share_on_label : "Compartilhe em"
meta_label :
tags_label : "Tags:"
categories_label : "Categorias:"
date_label : "Atualizado em:"
comments_label : "Deixe um comentário"
more_label : "Aprenda Mais"
related_label : "Você Talvez Goste Também"
follow_label : "Acompanhe em"
feed_label : "Feed"
powered_by : "Feito com"
website_label : "Site"
email_label : "Email"
recent_posts : "Postagens recentes"
undefined_wpm : "Parâmetro indefinido em word_per_minute no _config.yml"
page : "Página"
pagination_previous : "Anterior"
pagination_next : "Próxima"
breadcrumb_home_label : "Home"
breadcrumb_separator : "/"
toc_label : "Nesta página"
ext_link_label : "Link direto"
less_than : "meno que"
minute_read : "minutos de leitura"
share_on_label : "Compartilhe em"
meta_label :
tags_label : "Tags:"
categories_label : "Categorias:"
date_label : "Atualizado em:"
comments_label : "Deixe um comentário"
comments_title :
more_label : "Aprenda Mais"
related_label : "Você Talvez Goste Também"
follow_label : "Acompanhe em"
feed_label : "Feed"
powered_by : "Feito com"
website_label : "Site"
email_label : "Email"
recent_posts : "Postagens recentes"
undefined_wpm : "Parâmetro indefinido em word_per_minute no _config.yml"
comment_form_info :
comment_form_comment_label :
comment_form_md_info :
comment_form_name_label :
comment_form_email_label :
comment_form_website_label :
comment_btn_submit :
comment_btn_submitted :
comment_success_title :
comment_success_msg :
comment_error_title :
comment_error_msg :
close_btn_label :
loading_label :
pt-BR:
<<: *DEFAULT_PT
pt-PT:
@ -172,30 +242,45 @@ pt-PT:
# Italian
# -----------------
it: &DEFAULT_IT
page : "Pagina"
pagination_previous : "Precedente"
pagination_next : "Prossima"
breadcrumb_home_label : "Home"
breadcrumb_separator : "/"
toc_label : "Indice della pagina"
ext_link_label : "Link"
less_than : "meno di"
minute_read : "minuto/i di lettura"
share_on_label : "Condividi"
meta_label :
tags_label : "Tags:"
categories_label : "Categorie:"
date_label : "Aggiornato:"
comments_label : "Scrivi un commento"
more_label : "Scopri di più"
related_label : "Potrebbe Piacerti Anche"
follow_label : "Segui:"
feed_label : "Feed"
powered_by : "Powered by"
website_label : "Website"
email_label : "Email"
recent_posts : "Articoli Recenti"
undefined_wpm : "Parametro words_per_minute non definito in _config.yml"
page : "Pagina"
pagination_previous : "Precedente"
pagination_next : "Prossima"
breadcrumb_home_label : "Home"
breadcrumb_separator : "/"
toc_label : "Indice della pagina"
ext_link_label : "Link"
less_than : "meno di"
minute_read : "minuto/i di lettura"
share_on_label : "Condividi"
meta_label :
tags_label : "Tags:"
categories_label : "Categorie:"
date_label : "Aggiornato:"
comments_label : "Scrivi un commento"
comments_title :
more_label : "Scopri di più"
related_label : "Potrebbe Piacerti Anche"
follow_label : "Segui:"
feed_label : "Feed"
powered_by : "Powered by"
website_label : "Website"
email_label : "Email"
recent_posts : "Articoli Recenti"
undefined_wpm : "Parametro words_per_minute non definito in _config.yml"
comment_form_info :
comment_form_comment_label :
comment_form_md_info :
comment_form_name_label :
comment_form_email_label :
comment_form_website_label :
comment_btn_submit :
comment_btn_submitted :
comment_success_title :
comment_success_msg :
comment_error_title :
comment_error_msg :
close_btn_label :
loading_label :
it-IT:
<<: *DEFAULT_IT

View file

@ -4,7 +4,7 @@
<h2 class="modal__title js-modal-title"></h2>
<div class="modal__supporting-text js-modal-text"></div>
<div class="modal__actions">
<button class="btn btn--danger js-close-modal">Close</button>
<button class="btn btn--danger js-close-modal">{{ site.data.ui-text[site.locale].close_btn_label | default: "close" }}</button>
</div>
</article>
<!-- End comment form modal -->
@ -26,6 +26,7 @@
success: function (data) {
showModal('{{ site.data.ui-text[site.locale].comment_success_title | default: "Comment submitted" }}', '{{ site.data.ui-text[site.locale].comment_success_msg | default: "Thanks for your comment! It will show on the site once it has been approved." }}');
$(form).removeClass('form--loading');
$('#comment-form-submit').addClass('btn--disabled').html('{{ site.data.ui-text[site.locale].comment_btn_submitted | default: "Submitted" }}');
},
error: function (err) {
console.log(err);

View file

@ -1,52 +1,20 @@
{% include base_path %}
<div class="page__comments">
<h4 class="page__comments-title">{{ site.data.ui-text[site.locale].comments_label | default: "Leave a Comment" }}</h4>
{% capture comments_label %}{{ site.data.ui-text[site.locale].comments_label | default: "Comments" }}{% endcapture %}
{% case site.comments.provider %}
{% when "disqus" %}
<h4 class="page__comments-title">{{ comments_label }}</h4>
<section id="disqus_thread"></section>
{% when "facebook" %}
<h4 class="page__comments-title">{{ comments_label }}</h4>
<section class="fb-comments" data-href="{{ base_path }}{{ page.url }}" data-mobile="true" data-num-posts="{{ site.comments.facebook.num_posts | default: 5 }}" data-width="100%" data-colorscheme="{{ site.comments.facebook.colorscheme | default: 'light' }}"></section>
{% when "google-plus" %}
<h4 class="page__comments-title">{{ comments_label }}</h4>
<section class="g-comments" data-href="{{ base_path }}{{ page.url }}" data-first_party_property="BLOGGER" data-view_type="FILTERED_POSTMOD">Loading Google+ Comments ...</section>
{% when "staticman" %}
<section id="comments">
{% if site.repository and site.staticman.branch %}
<!-- Start new comment form -->
<form class="js-form form" method="post" action="https://api.staticman.net/v1/entry/{{ site.repository }}/{{ site.staticman.branch }}">
<div class="form__spinner">
<i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
<span class="sr-only">Loading...</span>
</div>
<fieldset>
<label for="comment-form-name">Your name <small class="required">*</small></label>
<input type="text" id="comment-form-name" name="fields[name]" tabindex="1" />
</fieldset>
<fieldset>
<label for="comment-form-email">Email address <small class="required">*</small></label>
<input type="email" id="comment-form-email" name="fields[email]" tabindex="2" />
<div class="small help-block">Your email address will remain private and won't be shared with anyone.</div>
</fieldset>
<fieldset>
<label for="comment-form-url">Website <small>(optional)</small></label>
<input type="url" id="comment-form-url" name="fields[url]" tabindex="3"/>
</fieldset>
<fieldset>
<label for="comment-form-message">Your comment <small class="required">*</small></label>
<textarea type="text" rows="3" id="comment-form-message" name="fields[message]" tabindex="4"></textarea>
<div class="small help-block"><a href="https://daringfireball.net/projects/markdown/">Markdown</a> is supported.</div>
</fieldset>
<fieldset class="hidden">
<input type="hidden" name="options[slug]" value="{{ page.slug }}">
<input type="hidden" name="fields[hidden]"/>
</fieldset>
<fieldset>
<button class="btn btn--large">Submit</button>
</fieldset>
</form>
<!-- End new comment form -->
<!-- Start static comments -->
<div class="js-comments">
{% if site.data.comments[page.slug] %}
@ -64,6 +32,42 @@
{% endif %}
</div>
<!-- End static comments -->
<!-- Start new comment form -->
<h4 class="page__comments-title">{{ site.data.ui-text[site.locale].comments_label | default: "Leave a Comment" }}</h4>
<p class="small help-block">{{ site.data.ui-text[site.locale].comment_form_info | default: "Your email address will not be published. Required fields are marked" }} <span class="required">*</span></p>
<form id="new_comment" class="page__comments-form js-form form" method="post" action="https://api.staticman.net/v1/entry/{{ site.repository }}/{{ site.staticman.branch }}">
<div class="form__spinner">
<i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
<span class="sr-only">{{ site.data.ui-text[site.locale].loading_label | default: "Loading..." }}</span>
</div>
<fieldset>
<label for="comment-form-message">{{ site.data.ui-text[site.locale].comment_form_comment_label | default: "Comment" }} <small class="required">*</small></label>
<textarea type="text" rows="3" id="comment-form-message" name="fields[message]" tabindex="1"></textarea>
<div class="small help-block"><a href="https://daringfireball.net/projects/markdown/">{{ site.data.ui-text[site.locale].comment_form_md_info | default: "Markdown is supported." }}</a></div>
</fieldset>
<fieldset>
<label for="comment-form-name">{{ site.data.ui-text[site.locale].comment_form_name_label | default: "Name" }} <small class="required">*</small></label>
<input type="text" id="comment-form-name" name="fields[name]" tabindex="2" />
</fieldset>
<fieldset>
<label for="comment-form-email">{{ site.data.ui-text[site.locale].comment_form_email_label | default: "Email address" }} <small class="required">*</small></label>
<input type="email" id="comment-form-email" name="fields[email]" tabindex="3" />
</fieldset>
<fieldset>
<label for="comment-form-url">{{ site.data.ui-text[site.locale].comment_form_website_label | default: "Website (optional)" }}</label>
<input type="url" id="comment-form-url" name="fields[url]" tabindex="4"/>
</fieldset>
<fieldset class="hidden">
<input type="hidden" name="options[slug]" value="{{ page.slug }}">
<input type="hidden" name="fields[hidden]"/>
</fieldset>
<fieldset>
<button type="submit" id="comment-form-submit" tabindex="5" class="btn btn--large">{{ site.data.ui-text[site.locale].comment_btn_submit | default: "Submit Comment" }}</button>
</fieldset>
</form>
<!-- End new comment form -->
{% endif %}
</section>
{% when "custom" %}

View file

@ -300,6 +300,11 @@
text-transform: uppercase;
}
.page__comments-form {
padding: 1em;
background: $lighter-gray;
}
.comment {
margin: 2em 0;