mostrar recuadros de ayuda
This commit is contained in:
f
parent
cac0cdaf11
commit
2b33ea7edf
|
|
@ -14,6 +14,8 @@
|
|||
//= require turbolinks
|
||||
//= require jquery/dist/jquery.js
|
||||
//= require jquery.hotkeys/jquery.hotkeys
|
||||
//= require bootstrap/util
|
||||
//= require bootstrap/alert
|
||||
//= require bootstrap-markdown/js/bootstrap-markdown
|
||||
//= require markdown-it/dist/markdown-it
|
||||
//= require select2/dist/js/select2
|
||||
|
|
|
|||
3
app/assets/javascripts/help.js
Normal file
3
app/assets/javascripts/help.js
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
$(document).on('turbolinks:load', function() {
|
||||
$('.alert').alert();
|
||||
});
|
||||
|
|
@ -8,6 +8,9 @@ class ApplicationController < ActionController::Base
|
|||
redirect_to sites_path
|
||||
end
|
||||
|
||||
def markdown
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
# Encontrar un sitio por su ID
|
||||
|
|
|
|||
61
app/views/application/markdown.haml
Normal file
61
app/views/application/markdown.haml
Normal file
|
|
@ -0,0 +1,61 @@
|
|||
- if request.referer
|
||||
= render 'layouts/breadcrumb', crumbs: [ link_to(t('help.markdown.back'), request.referer) ]
|
||||
|
||||
.row
|
||||
.col
|
||||
%table.table.table-striped.table-responsive-md
|
||||
%thead
|
||||
%tr
|
||||
%th= t('help.markdown.input')
|
||||
%th= t('help.markdown.output')
|
||||
%tbody
|
||||
%tr
|
||||
%td
|
||||
%code= "**#{t('help.markdown.bold')}**"
|
||||
%td
|
||||
%strong= t('help.markdown.bold')
|
||||
%tr
|
||||
%td
|
||||
%code= "_#{t('help.markdown.italic')}_"
|
||||
%td
|
||||
%em= t('help.markdown.italic')
|
||||
- 7.times do |i|
|
||||
- next if i == 0
|
||||
%tr
|
||||
%td
|
||||
%code= "#{'#' * i} #{t('help.markdown.heading')} #{i}"
|
||||
%td= raw "<h#{i}>#{t('help.markdown.heading')} #{i}</h#{i}>"
|
||||
%tr
|
||||
%td
|
||||
%code= "[#{t('help.markdown.link.text')}](#{t('help.markdown.link.url')})"
|
||||
%td= link_to t('help.markdown.link.text'), t('help.markdown.link.url')
|
||||
%tr
|
||||
%td
|
||||
%code= "> #{t('help.markdown.quote')}"
|
||||
%td
|
||||
%blockquote.blockquote= t('help.markdown.quote')
|
||||
%tr
|
||||
%td
|
||||
%code
|
||||
- 3.times do
|
||||
= "* #{t('help.markdown.ul')}"
|
||||
%br
|
||||
%td
|
||||
%ul
|
||||
- 3.times do
|
||||
%li= t('help.markdown.ul')
|
||||
%tr
|
||||
%td
|
||||
%code
|
||||
- 3.times do |i|
|
||||
= "#{i}. #{t('help.markdown.ol')}"
|
||||
%br
|
||||
%td
|
||||
%ol
|
||||
- 3.times do
|
||||
%li= t('help.markdown.ol')
|
||||
%tr
|
||||
%td
|
||||
%code= "})"
|
||||
%td
|
||||
%img{alt: t('help.markdown.img.text'), src: t('help.markdown.img.url')}
|
||||
11
app/views/layouts/_help.haml
Normal file
11
app/views/layouts/_help.haml
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
.alert.alert-info.alert-dismissible.fade.show{role: 'alert'}
|
||||
- if help.respond_to? :each
|
||||
%ul
|
||||
- help.each do |h|
|
||||
%li= raw h
|
||||
- else
|
||||
= raw help
|
||||
%button.close{type: 'button',
|
||||
data: { dismiss: 'alert' },
|
||||
'aria-label': t('help.close') }
|
||||
%span{'aria-hidden': true} ×
|
||||
|
|
@ -23,10 +23,14 @@
|
|||
= select_tag 'post[dir]',
|
||||
options_for_select([[t('posts.ltr'), 'ltr'], [t('posts.rtl'), 'rtl']], direction),
|
||||
{ class: 'form-control' }
|
||||
%small.text-muted.form-text= t('posts.dir_help')
|
||||
.form-group
|
||||
= text_field 'post', 'title', value: @post.title, class: field_class,
|
||||
placeholder: t('posts.title')
|
||||
= label_tag 'post_title', t('posts.title')
|
||||
= text_field 'post', 'title', value: @post.title, class: field_class
|
||||
.form-group{class: direction}
|
||||
= render 'layouts/help', help: [ t('help.markdown.intro'),
|
||||
t('help.distraction_free_html'),
|
||||
t('help.preview_html') ]
|
||||
= text_area_tag 'post[content]', @post.content, autofocus: true,
|
||||
class: 'post-content'
|
||||
.form-group
|
||||
|
|
@ -35,17 +39,16 @@
|
|||
class: 'form-control'
|
||||
%small.text-muted.form-text= t('posts.date_help')
|
||||
.form-group
|
||||
= render 'layouts/help', help: t('help.autocomplete_html')
|
||||
= label_tag 'post_categories', t('posts.categories')
|
||||
= select_tag 'post[categories][]',
|
||||
options_for_select(@site.categories, @post.categories),
|
||||
{ class: 'form-control select2', multiple: 'multiple' }
|
||||
%small.text-muted.form-text= t('posts.tags_help')
|
||||
.form-group
|
||||
= label_tag 'post_tags', t('posts.tags')
|
||||
= select_tag 'post[tags][]',
|
||||
options_for_select(@site.tags, @post.tags),
|
||||
{ class: 'form-control select2', multiple: 'multiple' }
|
||||
%small.text-muted.form-text= t('posts.tags_help')
|
||||
.form-group
|
||||
= label_tag 'post_slug', t('posts.slug')
|
||||
= text_field 'post', 'slug', value: @post.slug,
|
||||
|
|
|
|||
|
|
@ -2,6 +2,39 @@ en:
|
|||
errors:
|
||||
argument_error: 'Argument `%{argument}` must be an instance of %{class}'
|
||||
unknown_locale: 'Unknown %{locale} locale'
|
||||
help:
|
||||
close: 'Close help'
|
||||
markdown:
|
||||
intro: 'The text is formatted using a syntax called Markdwon, a
|
||||
simple format that can be easily written just by remembering some
|
||||
rules, and that can be converted to a web page, or to PDF and ePub
|
||||
files. You can use the buttons below for basic formatting. If
|
||||
you need help, here you have a <a href="/markdown">markdown
|
||||
cheatsheet</a>.'
|
||||
back: 'Go back'
|
||||
input: 'If we write...'
|
||||
output: 'We get...'
|
||||
bold: 'Bold'
|
||||
italic: 'Emphasis'
|
||||
heading: 'Title'
|
||||
link:
|
||||
text: 'A link'
|
||||
url: 'https://example.org'
|
||||
quote: 'A quote from a text we liked'
|
||||
ul: 'Our TODO list'
|
||||
ol: 'Steps for our machiavelic plans'
|
||||
img:
|
||||
text: 'Kéfir island'
|
||||
url: 'https://kefir.red/images/isla.png'
|
||||
distraction_free_html: 'You can a distraction free writing session
|
||||
by clicking the <span class="fa fa-expand"></span> button'
|
||||
preview_html: 'Click the <span class="fa fa-search"></span> preview
|
||||
button to see the results.'
|
||||
autocomplete_html: "Some of these fields can be auto-completed. If
|
||||
you know what to put on them, just start writing and the
|
||||
auto-complete will suggest available options. If the option doesn't
|
||||
exist, finish writing and press <kbd>Enter</kbd> to add a new one.
|
||||
To empty the field, click the × button on your right."
|
||||
login:
|
||||
email: 'E-mail'
|
||||
password: 'Password'
|
||||
|
|
@ -36,9 +69,11 @@ en:
|
|||
tags: 'Tags'
|
||||
tags_help: 'Comma separated!'
|
||||
categories: 'Categories'
|
||||
categories_help: 'Comma separated!'
|
||||
tags: 'Tags'
|
||||
slug: 'Slug'
|
||||
slug_help: 'This is the name of the article on the URL, ie. /title/. You can leave it empty.'
|
||||
slug_help: 'This is the name of the article on the URL, ie. /title/.
|
||||
You can leave it empty. If you changed the title and you want to
|
||||
change the file name, empty this field.'
|
||||
cover: 'Cover'
|
||||
cover_help: 'Path to the cover'
|
||||
layout: 'Layout'
|
||||
|
|
|
|||
|
|
@ -2,6 +2,38 @@ es:
|
|||
errors:
|
||||
argument_error: 'El argumento `%{argument}` debe ser una instancia de %{class}'
|
||||
unknown_locale: 'El idioma %{locale} es desconocido'
|
||||
help:
|
||||
close: 'Cerrar ayuda'
|
||||
markdown:
|
||||
intro: 'El formato del texto se llama Markdown. Es un formato
|
||||
simple que puede ser escrito recordando unas pocas reglas y que
|
||||
luego puede ser convertido a una página web, o un PDF, o un ePub.
|
||||
Puedes usar los botones para dar formato básico a tu texto. Para
|
||||
cuestiones más avanzadas, aquí tienes un <a
|
||||
href="/markdown">recordatorio de markdown</a>.'
|
||||
back: 'Volver'
|
||||
input: 'Si escribimos...'
|
||||
output: 'Obtenemos...'
|
||||
bold: 'Negrita'
|
||||
italic: 'Énfasis'
|
||||
heading: 'Título'
|
||||
link:
|
||||
text: 'Un vínculo'
|
||||
url: 'https://ejemplo.org'
|
||||
quote: 'Un recorte de texto que nos gustó'
|
||||
ul: 'Lista de cosas para hacer'
|
||||
ol: 'Pasos para un plan maquiavélico'
|
||||
img:
|
||||
text: 'La isla de Kéfir'
|
||||
url: 'https://kefir.red/images/isla.png'
|
||||
distraction_free_html: 'Puedes escribir sin distracciones presionando el botón <span class="fa fa-expand"></span>'
|
||||
preview_html: 'Utiliza el botón de <span class="fa fa-search"></span> previsualización para ver el texto generado'
|
||||
autocomplete_html: 'Algunos de estos campos se autocompletan. Si ya
|
||||
sabes qué quieres poner, solo empieza a escribir y el autocompletado
|
||||
te sugerirá las opciones disponibles. Si no existe lo que quieres
|
||||
poner, termina de escribir y presiona <kbd>Entrar</kbd> para agregar
|
||||
opciones que aun no existen. Para vaciar las opciones, usa el botón
|
||||
× a la derecha.'
|
||||
login:
|
||||
email: 'Dirección de correo'
|
||||
password: 'Contraseña'
|
||||
|
|
@ -34,9 +66,11 @@ es:
|
|||
date_help: '¡Esto cambia el orden de los artículos!'
|
||||
title: 'Título'
|
||||
categories: 'Categorías'
|
||||
categories_help: '¡Separadas por comas!'
|
||||
tags: 'Etiquetas'
|
||||
slug: 'Nombre la URL'
|
||||
slug_help: 'Esto es el nombre del artículo en la URL, por ejemplo /título/. Puedes dejarlo vacío.'
|
||||
slug_help: 'Esto es el nombre del artículo en la URL, por ejemplo
|
||||
/título/. Puedes dejarlo vacío. Si cambiaste el título y quieres
|
||||
que la URL cambie, borra el contenido de este campo.'
|
||||
cover: 'Portada'
|
||||
cover_help: 'La dirección de la portada'
|
||||
layout: 'Plantilla'
|
||||
|
|
@ -67,6 +101,7 @@ es:
|
|||
rtl: 'Derecha a izquierda'
|
||||
ltr: 'Izquierda a derecha'
|
||||
dir: 'Dirección del texto'
|
||||
dir_help: 'Cambiar la dirección del texto, por ej. el árabe se lee de derecha a izquierda'
|
||||
logger:
|
||||
rm: 'Eliminado %{path}'
|
||||
errors:
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ Rails.application.routes.draw do
|
|||
|
||||
get 'login/new', to: 'login#new'
|
||||
post 'login', to: 'login#create'
|
||||
get 'markdown', to: 'application#markdown'
|
||||
|
||||
resources :sites, only: [ :index, :show ] do
|
||||
resources :posts
|
||||
|
|
|
|||
Loading…
Reference in a new issue