Cajón Desastre

Beta 1 Display Properties de Bootstrap. Equivalencias con el antiguo .hidden-*

Esta es una tabla de equivalencias de la Alpha 6 Responsive Utilities a la Beta 1 Display Properties del framework Bootstrap

De acuerdo con la documentacion, Beta 1 a mandado a paseo (ya se avisaba…) las utilidades responsive de la Alpha (Responsive Utilities) (concretamente las clases .hidden-* entraban en conflicto con el método hidden() de jQuery.

Parece que esa documentación, además de escasa, da bastante a confusión, doy fe… ya que vengo de Bootstrap 3 y he decidido usar al fin la beta de Bootstrap 4 en nuevos proyectos, por lo que incluso, el que haya usado ya las versiones Alpha se verán con el mismo problema.

EL concepto ahora, no es que sea mas o menos simple, pero si antes con un .hidden-* solucionabas, ahora requerirás mas de una clase .d-* para obtener el mismo resultado.

A falta de una mejor explicacion en la documentación y a modo de chuleta, este cuadro te ayudará a resolver esos casos en los que, viniendo de bootstrap 3 o de las versiones alpha de Bootstrap 4, te encontrarás que hidden-*, etc ya no existe:

XS (<544px) SM (≥544px – <768px) MD (≥768px – <992px) LG (≥992px – <1200px) XL (≥1200px) Equivalencia Bootstrap 4 Beta
.hidden-xs-down Hidden Visible Visible Visible Visible .d-none .d-sm-*
.hidden-sm-down Hidden Hidden Visible Visible Visible .d-none .d-md-*
.hidden-md-down Hidden Hidden Hidden Visible Visible .d-none .d-lg-*
.hidden-lg-down Hidden Hidden Hidden Hidden Visible .d-none .d-xl-*
.hidden-xl-down Hidden Hidden Hidden Hidden Hidden .d-none
.hidden-xs-up Hidden Hidden Hidden Hidden Hidden .d-none
.hidden-sm-up Visible Hidden Hidden Hidden Hidden .d-sm-none
.hidden-md-up Visible Visible Hidden Hidden Hidden .d-md-none
.hidden-lg-up Visible Visible Visible Hidden Hidden .d-lg-none
.hidden-xl-up Visible Visible Visible Visible Hidden .d-xl-none

Cuando las tablas html no se adaptan a los span de bootstrap

En el ultimo proyecto web decidí usar bootstrap como base del theme wordpress a realizar y lo cierto es que tengo que agradecer a Pelayo Maojo su descubrimiento, creo que tras g960, este framework ademas de popular tiene una curva de aprendizaje similar a 960gs.

Trabajando con tablas me encontré con un problema, estas no se adaptan segun que media queries a el ancho “pactado” por los class=”spanX” de bootstrap, a lo que encontré una solución css rapida y que funciona en todos los navegadores.

Basta con añadir a la class o id de tu tabla:

.mitabla {
table-layout: fixed;
word-wrap: break-word;
}

y las tablas se ajustan al/los “span” sin problemas.

Experiencias como formador para la iniciación de un blog

Hace una semana desde clink! , socio tecnológico de  Social Media Network , empezamos una serie de acciones formativas a modo de prueba piloto en la Escola Infantil de Eiris (La Coruña) perteneciente a la Rede de Escolas Infantís de Galicia (Consorcio Galego de Igualdade e Benestar da Xunta de Galicia) para formar a las educadoras del centro a fin de introducirlas en el mundo de los blogs en algun caso y en otros de apoyo a los conocimientos adquiridos de antemano.

La primera clase transcurrió de manera fluida y se prolongó más de la cuenta, en la que los participantes pudieron ver los conceptos básicos de qué es un blog, sistemas de publicación, incluso se llevaron “deberes” para casa!. En todo momento tratamos de hacer entender que tener y/o publicar en un blog, ya sea corporativo, personal, educativo, etc. tiene que partir del simple hecho de querer hacerlo, de querer contar las cosas de una manera simplé, clara, concisa, y por supuesto, con ganas de compartirlo con los demás.

En charlas sucesivas, y dependiendo del nivel, interés y tiempo disponible seguiremos profundizando en el mundo de las bitacoras.

Por supuesto, toda la formación se realizará sobre plataforma wordpress, que hoy por hoy es la mas extendida.

 

Las formadoras del centro convertidas en alumnas… por un rato.

Traducir PDFs usando herramientas online de manera gratuita

Últimamente todos los manuales técnicos que leo estan en inglés, y aunque no tengo mayor problema en su lectura, en castellano la lectura se hace mas relajada. Con ayuda de dos aplicaciones online podemos traducir cualquier PDF sin apenas restricciones.

Leer másTraducir PDFs usando herramientas online de manera gratuita

Producteev. Gestiona tu tiempo, tareas y proyectos de forma colaborativa

Producteev es un aplicación online que nos permite organizar nuestro día, semana o més mediante la creación de pequeñas notas o tareas  a las que le iremos asignando distintos niveles de prioridad, como así también las personas vinculadas a ellas. Todo mediante una interface muy simple y agradable.

Leer másProducteev. Gestiona tu tiempo, tareas y proyectos de forma colaborativa

Por razones personales…

From: Richard Stallman <rms <at> gnu.org>
Subject: Re: Real men don’t attack straw men
Newsgroups: gmane.os.openbsd.misc
Date: 2007-12-15 21:37:06 GMT (2 years, 22 weeks, 6 days, 4 hours and 35 minutes ago)

For personal reasons, I do not browse the web from my computer.  (I
also have not net connection much of the time.)  To look at page I
send mail to a demon which runs wget and mails the page back to me.
It is very efficient use of my time, but it is slow in real time.

Fuente: http://thread.gmane.org/gmane.os.openbsd.misc/134336/focus=134979

El que no sepa quien es Richard Stallman, aqui.

Barney Stinson, Legen… dario!

Legendary___Barney_Stinson_by_SouthernDesigner

Hace poco me he subido al vagón de esta serie de nuevo, que dejamos de ver Ale y yo por motivos que no logro recordar… (aunque uno de ellos es nuestra retoña…), el caso es que Cómo conocí a vuestra madre (how I met your mother) se vuelve a subir al hall of fame de nuestras series de televisión.

Ademas de eso, por otra parte, el personaje de Barney Stinson, tal y como el mismo dice en la serie se  esta convirtiendo en uno de mis “legendarios” que podria hacerse un hueco al lado del mismismo Chandler o Ross. Al fin y al cabo, pasa exactamente lo que en la mitica Friends, que con un grupo pequeño de personajes se abarca un número muy grande de “estereotipos” y es fácil encontrar características de tus amigos en esos personajes.

barney-running-constestants-roll

Neil Patrick Harris (Barney), que recientemente ha hecho pública su homosexualidad, interpreta el papel de una manera genial. Aun lo recuerdo como Doggie Howser,  de la serie Médico Precoz!

Por otra parte… Cobie Smulders (Robin Scherbatsky en la serie) me parece una mujer super atractiva!

robin

De wikipedia:

Es el año 2030 Ted (Josh Radnor) decide contarle a sus hijos cómo conoció a su madre, por lo que pasa a relatar su historia a partir de 2005, cuando se da cuenta de que desea casarse y sentar la cabeza al ver a sus dos amigos Marshall (Jason Segel) y Lily (Alyson Hannigan) decidir casarse tras nueve años de relación.

Al comentarlo con otro amigo suyo, llamado Barney (Neil Patrick Harris), éste le dice que la mujer de sus sueños no va a caer del cielo, cuando aparece Robin (Cobie Smulders), de la que Ted se enamora.

Tras ello empieza la historia de amores y desamores del protagonista a partir de diferentes anécdotas, sin llegar nunca a conocer a la madre de sus hijos.

Ted es el punto intermedio entre Barney y Marshall, ya que mientras Marshall es fiel y constante, Barney es promiscuo e inconstante. A pesar de que Ted anda siempre en la búsqueda del amor perfecto como el de Lily y Marshall, algunas veces se deja influir por Barney y trata de ser su colega; Sin embargo en capítulos recientes Barney ha dado muestra de creer en el amor y de tener la capacidad de llevar una relación larga, aunque muy a su estilo.

Prueba el nuevo look de Google con barra lateral

Descubro en SoulPresence la manera de probar el nuevo look de Google, que incorpora una barra lateral con opciones “iconizadas” y preview para los resultados de búsqueda en algunos casos. Los pasos a seguir para probarlo son:

screenshot_003

1) Desconectar tu cuenta google.

2) Acceder a google.com (solo funciona con .com, si estas en otro dominio, debes pinchar en Google in English)

3) Copiar en la barra del navegador el siguiente código:
javascript:void(document.cookie="PREF=ID=20b6e4c2f44943bb:U=4bf292d46faad806:TM=1249677602:LM=1257919388:S=odm0Ys-53ZueXfZG;path=/; domain=.google.com");
4) Recargar la página (nos llevará probablemente a nuestro google local)

5) Volver a la version inglesa con lo que ya deberias ver el nuevo formato.

Fuente: Blogoscope via: SoulPresence