Skip to content

Commit

Permalink
Merge pull request adobe#3536 from adobe/jbalsas/spanish_loc_sprint24
Browse files Browse the repository at this point in the history 
Spanish strings for sprint 24
  • Loading branch information
@TomMalbran
TomMalbran committed Apr 25, 2013
2 parents 1446a63 + 42a4f46 commit 59f0382
Show file tree
Hide file tree
Showing 4 changed files with 179 additions and 121 deletions.
250 changes: 138 additions & 112 deletions samples/es/Primeros Pasos/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,120 +10,146 @@
</head>
<body>

<h1>PRIMEROS PASOS CON BRACKETS</h1>
<h2>¡Ésta es tu guía!</h2>

<!--
HECHO CON <3 Y JAVASCRIPT
-->

<p>
Bienvenido a una versión preliminar de Brackets, un nuevo editor de código abierto para la nueva
generación de Internet. Somos unos apasionados de los estándares y queremos construir mejores
herramientas para JavaScript, HTML, CSS y el resto de tecnologías web relacionadas. Éste es nuestro
humilde comienzo.
</p>

<!--
¿QUÉ ES BRACKETS?
-->
<p>
<em>Estás viendo una versión preliminar de Brackets.</em>
En muchos aspectos, Brackets es otro tipo de editor. La gran diferencia es que está escrito en
JavaScript. Y es que, aunque Brackets no esté listo todavía para tu uso diario, nosotros lo estamos
utilizando todos los días para construir Brackets.
</p>


<h2>Estamos intentando algunas cosas nuevas</h2>

<!--
LA RELACIÓN ENTRE HTML, CSS Y JAVASCRIPT
-->
<h3>Edición rápida de CSS y JavaScript</h3>
<p>
Mientras estás escribiendo HTML, usa el atajo de teclado <kbd>Cmd/Ctrl + E</kbd> para abrir un editor
rápido en línea con todo el CSS relacionado. Ajusta tu CSS, pulsa <kbd>ESC</kbd> y de vuelta
al HTML. O simplemente mantén las reglas CSS abiertas para que pasen a formar parte de tu editor de HTML. Si
pulsas <kbd>ESC</kbd> fuera de un editor rápido, todas se cerrarán a la vez. Ya no es necesario estar cambiando
de documentos continuamente.
</p>

<samp>
¿Quieres verlo funcionando? Coloca tu cursor sobe el tag <!-- <samp> --> superior y pulsa
<kbd>Cmd/Ctrl + E</kbd>. Deberías ver aparecer un editor rápido de CSS por encima. A la derecha
verás un listado de todas las reglas CSS relacionadas con este tag. Simplemente desplázate entre las
reglas con <kbd>Alt + Up/Down</kbd> para encontrar la que quieres modificar.
</samp>

<a href="screenshots/quick-edit.png">
<img alt="Una captura de pantalla con un Editor Rápido de CSS" src="screenshots/quick-edit.png" />
</a>

<!--
LIVE PREVIEW
-->
<h3>Visualiza cambios CSS en vivo en el navegador</h3>
<p>
¿Te suena de algo ese baile de "guardar/recargar" que llevamos años haciendo? ¿Ése en el que haces
cambios en tu editor, pulsas guardar, cambias al navegador y recargas para por fin poder ver el
resultado? Con Brackets, ya no tienes que hacerlo.
</p>
<p>
¡Brackets abrirá una <em>conexión en vivo</em> con tu navegador local y le enviará los cambios en el
CSS conforme escribas! Puede que ya estés haciendo algo parecido con herramientas basadas en navegador,
pero con Brackets ya no necesitas copiar y pegar el CSS final de vuelta a tu editor. ¡Tu código se
ejecuta en el navegador, pero vive en tu editor!
</p>
<h1>PRIMEROS PASOS CON BRACKETS</h1>
<h2>¡Ésta es tu guía!</h2>

<h3>Localiza elementos HTML y reglas CSS en vivo</h3>
<p>
Para ayudarte a visualizar la relación entre tu CSS y HTML, cuando tu cursor se encuentre sobre
una regla de CSS, Brackets resaltará todos los elementos afectados en el navegador. Además, cuando
estés editando un archivo HTML, Brackets también destacará los elementos correspondientes en tu
navegador.
</p>

<samp>
Si tienes instalado Google Chrome, puedes probarlo tú mismo. Pulsa en el icono del rayo de la
esquina superior derecha o presiona <kbd>Cmd/Ctrl + Alt + P</kbd>. Cuando Desarrollo en Vivo está
funcionando en un documento HTML, todos los documentos CSS relacionados se pueden editar en
tiempo real. El icono pasará de gris a dorado cuando Brackets consiga establecer una conexión
con tu navegador.

Ahora, coloca el cursor sobre el tag <!-- <img> --> que se encuentra un poco más arriba. Fíjate cómo
aparece el resaltado azul alrededor de la imagen en Chrome. Luego, utiliza <kbd>Cmd/Ctrl + E</kbd>
para abrir las reglas de CSS existentes. Intenta cambiar el tamaño del borde de 1 a 10 píxeles o
cambia el color del fondo de "dimgray" a "hotpink". Si Brackets y tu navegador están funcionando en
paralelo, verás los cambios reflejados de manera instantánea en tu navegador. Genial, ¿verdad?
</samp>
<!--
HECHO CON <3 Y JAVASCRIPT
-->

<p>
Bienvenido a una versión preliminar de Brackets, un nuevo editor de código abierto para la nueva
generación de Internet. Somos unos apasionados de los estándares y queremos construir mejores
herramientas para JavaScript, HTML, CSS y el resto de tecnologías web. Éste es nuestro humilde
comienzo.
</p>

<!--
¿QUÉ ES BRACKETS?
-->
<p>
<em>Brackets es un editor diferente.</em>
La gran diferencia es que está escrito en JavaScript, HTML y CSS. Esto significa que la mayoría de quienes
usan Brackets tiene las habilidades necesarias para modificar y extender el editor. De hecho, nosotros
lo usamos todos los días para desarrollar Brackets. También tiene algunas características únicas como
Edición Rápida, Desarrollo en Vivo y más que no encontrarás en otros editores.
Sigue leyendo para saber más sobre cómo sacar provecho de estas características
</p>

<p class="note">
Actualmente, Brackets sólo soporta Desarrollo en Vivo para CSS. En estos momentos estamos trabajando en
añadir soporte para Desarrollo en Vivo de HTML y JavaScript. En la versión actual, no podrás ver tus cambios
en HTML hasta que guardes el archivo. Las actualizaciones automáticas sólo son posibles en Google Chrome en
estos momentos. Queremos trasladar esta funcionalidad a todos los grandes navegadores, y estamos deseando
poder trabajar con ellos para conseguirlo.
</p>

<!--
HAZNOS SABER LO QUE PIENSAS
-->
<h2>Involúcrate</h2>
<p>
Brackets es un proyecto de código abierto. Desarrolladores web de todo el mundo están contribuyendo
a construir un mejor editor de código. Haznos saber lo que piensas, comparte tus ideas o contribuye
directamente al proyecto.
</p>
<ul>
<li><a href="http://brackets.io">Brackets.io</a></li>
<li><a href="http://blog.brackets.io">Blog del equipo de Brackets</a></li>
<li><a href="http://github.com/adobe/brackets">Brackets en GitHub</a></li>
<li><a href="http://github.com/adobe/brackets/wiki">Wiki de Brackets</a></li>
<li><a href="http://groups.google.com/group/brackets-dev">Lista de correo de los desarrolladores de Brackets</a></li>
<li><a href="https://twitter.com/#!/brackets">@Brackets en Twitter</a></li>
<li>Habla con los desarrolladores de Brackets por IRC en #brackets en Freenode</li>
</ul>
<h2>Estamos intentando algunas cosas nuevas</h2>

<!--
LA RELACIÓN ENTRE HTML, CSS Y JAVASCRIPT
-->
<h3>Edición rápida de CSS y JavaScript</h3>
<p>
Se acabó el estar saltando de documento en documento perdiendo de vista lo que estás haciendo. Mientras
estás escribiendo HTML, usa el atajo de teclado <kbd>Cmd/Ctrl + E</kbd> para abrir un editor rápido en
línea con todo el contenido CSS relacionado. Ajusta tu CSS y pulsa <kbd>ESC</kbd> para volver a tu HTML, o simplemente
mantén las reglas CSS abiertas para que pasen a formar parte de tu editor de HTML. Si pulsas <kbd>ESC</kbd>
fuera de un editor rápido, todos se cerrarán a la vez.
</p>

<samp>
¿Quieres verlo funcionando? Coloca tu cursor sobe la etiqueta <!-- <samp> --> y pulsa <kbd>Cmd/Ctrl + E</kbd>.
Deberías ver aparecer un editor rápido de CSS más arriba. A la derecha verás un listado de todas las reglas CSS
relacionadas con esta etiqueta. Simplemente desplázate entre las reglas con <kbd>Alt + Arriba/Abajo</kbd> para
encontrar la que quieres modificar.
</samp>

<a href="screenshots/quick-edit.png">
<img alt="Una captura de pantalla con un Editor Rápido de CSS" src="screenshots/quick-edit.png" />
</a>

<p>
Puedes usar el mismo atajo en JavaScript para ver el cuerpo de una función colocando el ratón sobre
el nombre de la llamada a la función que quieras examinar. Por ahora, no se pueden anidar editores en línea, por
lo que sólo puedes usar la característica de Edición Rápida cuando el cursor está en un editor "completo".
</p>

<!--
LIVE PREVIEW
-->
<h3>Visualiza cambios en archivos CSS en vivo en el navegador</h3>
<p>
¿Conoces ese baile de "guardar/recargar" que llevamos años haciendo? ¿Ése en el que haces cambios en tu
editor, pulsas guardar, cambias al navegador y recargas para por fin poder ver el resultado? Con Brackets,
ya no tienes que hacerlo.
</p>
<p>
¡Brackets abrirá una <em>conexión en vivo</em> con tu navegador local y le enviará los cambios en el
archivo CSS conforme escribas! Puede que ya estés haciendo algo parecido con las herramientas de desarrollo
del navegador, pero con Brackets ya no necesitas copiar y pegar las reglas CSS final de vuelta a tu editor.
¡Tu código se ejecuta en el navegador, pero vive en tu editor!
</p>

<h3>Resaltado en vivo de elementos HTML y reglas CSS</h3>
<p>
Brackets te ayuda a ver cómo los cambios en HTML y CSS afectan a tu página. Cuando tu cursor se encuentre
sobre una regla de CSS, Brackets resaltará todos los elementos afectados en el navegador. Del mismo modo,
cuando estés editando un archivo HTML, Brackets también resaltará los elementos correspondientes en tu
navegador.
</p>

<samp>
Si tienes instalado Google Chrome, puedes probarlo tú mismo. Haz click sobre el icono del rayo de la
esquina superior derecha o presiona <kbd>Cmd/Ctrl + Alt + P</kbd>. Cuando Desarrollo en Vivo está
funcionando en un documento HTML, todos los documentos CSS relacionados se pueden editar en
tiempo real. El icono pasará de gris a dorado cuando Brackets consiga establecer una conexión
con tu navegador.

Ahora, coloca el cursor sobre la etiqueta <!-- <img> --> que se encuentra un poco más arriba. Observa
cómo aparece el resaltado azul alrededor de la imagen en Chrome. Luego, utiliza <kbd>Cmd/Ctrl + E</kbd>
para abrir las reglas de CSS existentes. Intenta cambiar el tamaño del borde de 1 a 10 píxeles o el color
del fondo de "dimgray" a "hotpink". Si Brackets y tu navegador están funcionando en paralelo, verás los
cambios reflejados de manera instantánea en tu navegador. Genial, ¿verdad?
</samp>

<p class="note">
Actualmente, Brackets sólo soporta Desarrollo en Vivo para CSS. Aún así, en la versión actual, los cambios
en ficheros HTML y JavaScript son detectados y recargados automáticamente en el navegador cuando guardas. En
estos momentos estamos trabajando en añadir soporte para Desarrollo en Vivo de HTML y JavaScript. Además, las
actualizaciones automáticas sólo son posibles en Google Chrome, pero esperamos poder trasladar próximamente
esta funcionalidad a todos los grandes navegadores.
</p>

<h3>Vista Rápida</h3>
<p>
Para aquellos que todavía no han memorizado las equivalencias de color entre HEX y RGB, Brackets permite ver
exactamente qué color se está utilizando rápida y fácilmente. Tanto en CSS como en HTML, simplemente mueve el
cursor sobre cualquier valor de color o gradiente y Brackets mostrará una previsualización del mismo de manera
automática. Lo mismo sirve para imágenes. Simplemente pasa el cursor sobre la dirección de una imagen en Brackets,
y éste mostrará una vista en miniatura de la misma.
</p>

<samp>
Para probar la previsualización tú mismo, coloca el cursor en la etiqueta <!-- <body> --> al principio de este
documento y pulsa <kbd>Cmd/Ctrl + E</kbd> para abrir un editor CSS. Ahora, simplemente mueve el ratón sobre
cualquiera de los colores dentro del CSS. También puedes verlo funcionando en gradientes abriendo un editor
de CSS en la etiqueta HTML al principio de esta página, pasando el cursor por cualquiera de los valores para las
imágenes de fondo. Para probar la vista previa de imágenes, coloca el cursor sobre la imagen con la captura
de pantalla incluída antes en este documento.
</samp>

<!--
HAZNOS SABER LO QUE PIENSAS
-->
<h2>Involúcrate</h2>
<p>
Brackets es un proyecto de código abierto. Desarrolladores web de todo el mundo están contribuyendo
a construir un mejor editor de código. Haznos saber lo que piensas, comparte tus ideas o contribuye
directamente al proyecto.
</p>
<ul>
<li><a href="http://brackets.io">Brackets.io</a></li>
<li><a href="http://blog.brackets.io">Blog del equipo de Brackets</a></li>
<li><a href="http://github.com/adobe/brackets">Brackets en GitHub</a></li>
<li><a href="https://github.com/adobe/brackets/wiki/Brackets-Extensions">Extensiones para Brackets</a></li>
<li><a href="http://github.com/adobe/brackets/wiki">Wiki de Brackets</a></li>
<li><a href="http://groups.google.com/group/brackets-dev">Lista de correo de los desarrolladores de Brackets</a></li>
<li><a href="https://twitter.com/#!/brackets">@Brackets en Twitter</a></li>
<li>Habla con los desarrolladores de Brackets por IRC en #brackets en Freenode</li>
</ul>

</body>
</html>
Expand Down
5 changes: 5 additions & 0 deletions samples/es/Primeros Pasos/main.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
html {
background-color: #eeeeee;
background-image: linear-gradient(bottom, rgb(238,238,238) 18%, rgb(153,153,153) 59%, rgb(238,238,238) 80%);
background-image: -o-linear-gradient(bottom, rgb(238,238,238) 18%, rgb(153,153,153) 59%, rgb(238,238,238) 80%);
background-image: -moz-linear-gradient(bottom, rgb(238,238,238) 18%, rgb(153,153,153) 59%, rgb(238,238,238) 80%);
background-image: -webkit-linear-gradient(bottom, rgb(238,238,238) 18%, rgb(153,153,153) 59%, rgb(238,238,238) 80%);
background-image: -ms-linear-gradient(bottom, rgb(238,238,238) 18%, rgb(153,153,153) 59%, rgb(238,238,238) 80%);
}

body {
Expand Down
Loading

0 comments on commit 59f0382

Please sign in to comment.