Cambios estéticos (botones indice, spoilers, citas, codeboxes)

Recuerdo del primer mensaje :

Como algunos usuarios habrán notado, Foroactivo ha "mejorado" el uso de las Menciones. Ahora al pasar el mouse sobre la mención aparecen ciertos datos y opciones, como la de mandar MP, ver perfil y los mensajes que ha hecho.

Para probar pasen el mouse sobre Wig; @Wigazo

Pero hay algo que no se ve bien...el fondo es blanco y la parte inferior es grís lo cual no combina para nada con la estética general de nuestro foro, por lo tanto sugiero estilizarlo para que esté mas acorde. Wig sugirió este aspecto:

CSS:

Si les gusta como se ve, opinen. También pueden sugerir cambios en la nueva apariencia de esta mención.

Otra cosa que debería mejorarse es el aspecto de las Citas, estas son las actuales:

Rhinestone escribió:
Como pueden ver es amarilla y simple, y lo ha sido por un largo tiempo en S2.

Paseando por el foro de asistencia he notado el buen diseño que tienen las suyas:



No sé ustedes, pero me gustan y creo que deberíamos implementar algo similar aquí.
Por supuesto, teniendo nuestro toque único y personal.

Esta mejora puede ser incluído a las cajas de códigos y a los Spoilers, tratando de mantenerse en el mismo estilo.

---

Cambios en los botones:
->
->
->
->
->
->
->
->
->

Espero opiniones. ¡Gracias por leer la sugerencia!

Me encanta el diseño que propuso Rhine, quedó re bien en serio. :megusta:

¿Y si le ponemos como una especie de borde negro/oscuro a los textos en las citas, para que se noten los textos claros? Se puede hacer, lo que no sé es si va a quedar bien, habrá que probar.

Rhine, dame la imagen para la franja así puedo hacer el CSS (el del fondo es una de las que ya se puso, no?).

Habrá que probar, si.

Aquí están las imagenes:

Me gusta el diseño de Rhine, aunque sigo pensando que el fondo donde vá el texto debiera ser más claro para facilitar la lectura.

Wigazo escribió:¿Y si le ponemos como una especie de borde negro/oscuro a los textos en las citas, para que se noten los textos claros? Se puede hacer, lo que no sé es si va a quedar bien, habrá que probar.

Te refieres a delinear los textos así?


Aparte de que queda muy feo con los textos largos (cosa que en ésta imagen no se aprecia tanto), no me imagino como se determinaría si el texto es claro o no. :/

No creo que el fondo complique la lectura a menos que tu fuente sea del mismo color (un verde tirando a gris).

Se aplicaría en todos los textos, por más que sería innecesario con los oscuros. Tipo los subtítulos en algunos lados que tienen bordes para que se vean sin importar lo que tengan atrás.

Es que jode mucho cuando no se lee. Por supuesto, si queda mal lo del borde ni en pedo (como en la imagen que pasaste), pero si se nos ocurre una solución no vendría mal, porque jode tener que seleccionar el texto. Podemos probar con varios tipos de bordes. Claro, ese no es un problema del estilo de cita sugerido acá, sino ya en el actual, pero no estaría mal deshacernos de ese problema, si es que podemos.

Quizá algo más fácil sería sobrepasar todos los tag de [color] dentro de las citas; es decir que todo el texto en el cuadro de cita sea negro, independiente del color que tengan originalmente.

Ese nuevo sistema en las menciones es bastante agradable a la vista, estoy a favor del cambio de color, siempre es bueno retocar estas pequeñas cosas para que se apeguen un poco más al foro, y con respecto a las Citas, también a favor de cambiarlas.

technoguyx escribió:Quizá algo más fácil sería sobrepasar todos los tag de [color] dentro de las citas; es decir que todo el texto en el cuadro de cita sea negro, independiente del color que tengan originalmente.

Mmm, no se me había ocurrido esto. La cagada sería si realmente querés que el texto dentro de la cita sea de cierto color. Otra opción sería que el texto se ponga negro solo si el cursor está sobre alguna parte de la cita (sino se verían los colores originales de los tags).

EDIT:

Código:

blockquote {
    background: url(http://i.imgur.com/z2qcP3R.jpg);
    border: 2px solid #3D644B;
    border-radius: 3px;
    margin: 6px;
    padding: 5px;
}
blockquote cite {
    color: #EEF0EF;
    background: url(http://i.imgur.com/cdz6TrQ.jpg);
    padding: 2px;
    margin: -5px -5px 3px -5px;
}
cite:before {
    content: url(http://i.imgur.com/Kiv4avF.png);
    margin: 3px;
}
blockquote > div {
    margin: 0;
}
blockquote:hover font {
    color: #595858 !important;
}

Ese sería el CSS que más o menos imita la imagen de Rhine (al igual que ésta, un cambio importante es que las citas tienen menor margen, lo que hace que no ocupen tanto espacio como ahora), más eso de que dije de que al pasar el cursor encima se ponga negro el texto que use el BBcode color (estuve probando y parece servir bastante ). ¿Lo probamos en este tema y vemos cómo lo vamos cambiando?

Dale, podemos comenzar la etapa de prueba para ver si se presenta algún otro problema.

EDIT: Hecho.

Muy Sporeano, mucho más bonito la verdad

Queda muy bien, aprobado~

@Wigazo lo único que cambié del CSS son las comillas porque habías puesto unas pixeladas.

OK, quedó bastante bien.

FlairDreamer escribió:Queda bastante bien, aunque temo que con letra blanca quizás no se vea. xD

Para que pruebe eso del texto negro, pasando el cursor por encima.

Cualquier color de texto....probaré

Color

El líder es bueno, es líder es bello, no hay voluntad, olvídate de ello♫

Strike

El líder es bueno, es líder es bello, no hay voluntad, olvídate de ello♫

Blur

El líder es bueno, es líder es bello, no hay voluntad, olvídate de ello♫

Fuente

El lider es bueno, es lider es bello, no hay voluntad, olvídate de ello♫

Scroll

El líder es bueno, es líder es bello, no hay voluntad, olvídate de ello♫

Updown

El líder es bueno, es líder es bello, no hay voluntad, olvídate de ello♫