Problemas con el foro
#1
Hola! Estuve revisando el código del foro y lo encontré un poco raro.

Voy a mostrar los problemas y posteriormente les busco una solución.
--- EN COMENTARIOS ESTÁ EL
CODIGO QUE SUGIERO---


Mostrar ContenidoVer Imagen:



1) COLUMNA DE CONTENIDO PRINCIPAL ANGOSTA

2) BARRA DE NAVEGACION SE SUPERPONE A OTROS ELEMENTOS, COMO LA CAJA DE USUARIO (ARRIBA A LA DERECHA)

3) EL SITIO NO ES RESPONSIVO



Mostrar ContenidoVer Imagenes:


Donde dice 100% (48% en el código) debe colocarse 1fr

.portal-grid {
  width: 1fr;
}

ESO SOLUCIONA EL PROBLEMA DE QUE LA COLUMNA DE TEMAS ESTÁ ANGOSTA




Mostrar ContenidoVer Imagenes:


Se ve cambiado sólo uno porque yo estaba seleccionando un elemento, pero el problema viene de la clase portal-grid


Si quieren que se pongan de a dos, el contenedor de los portal-grid debería ser grid y decirle que cada portal-grid midan de ancho 0.5fr o menos. Mejor es usar dos columnas de 1fr cada una.

Si quieren hacerlo con flexbox, debería usarse:

.izquierda-portal {
  flex-wrap: wrap;
}

y el ancho de cada portal-grid ser menor a la mitad
QUIZÁS aplicar flex-basis
[Imagen: 42SnVtH.png]
Responder
#2
Bueno mencionare algunas cosas primero:

*Se lo mostrare Luis ya que para estas cosas muy tecnicas el es el que las puede arreglar, si es que se puede.

*Tema movido a Soporte General, cuando vayas a reportar alguna cosilla puedes hacerlo en esa zona, te dejo el link del tema en especifico: https://foroanime.net/Tema-En-proceso-Ce...rores-2021

*Pls pon las imagenes en spoiler si es que son muy grandes. El tener imagenes y mas varias muy grandes expuestas hace que se pueda ralentizar la pagina. Y si no quieres puedes disminuirles el tama~o.

Saludos~
[Imagen: dvbfEKo.png]
[Imagen: 2wSHBLc.png] [Imagen: 79fpzVt.png] [Imagen: JJPdvoA.png]
La Teoria de los Archipiélagos 
-Alice Kellen

[Imagen: k9JUAgj.gif]
Marie y Belmont 4/9/2021
♡Gracias a ti por amarme♡
Responder
#3
Camara 
.portal-grid {
  width: auto;
}




[Imagen: c11.png]



Generalmente se hace al revés y la versión móvil es la base pero si es más fácil ponerlo así:


@media screen and (max-width: 992px) {
  .izquierda-portal {
     grid-template-columns: 1fr;
  }
}


@MarieChan tienes razón, sólo que estaba apurado. Ahora las spoilero
[Imagen: 42SnVtH.png]
Responder
#4
(18-11-2021, 01:25 AM)Argi escribió: .portal-grid {
  width: auto;
}




[Imagen: c11.png]



Generalmente se hace al revés y la versión móvil es la base pero si es más fácil ponerlo así:


@media screen and (max-width: 992px) {
  .izquierda-portal {
     grid-template-columns: 1fr;
  }
}

@MarieChan tienes razón, sólo que estaba apurado. Ahora las spoilero

Gracias por la recomendación Argi, nos ayudará mucho a mejorar el sitio. ¿Puedes indicarme qué diseño de foro usas? si me mandas captura del menú superior (cabecera) lo identificaré
 
Responder
#5
@Luis_VdM

[Imagen: 2021-11-22-07-38-35.jpg]
Bueno, creo que además al .portal-grid deberías cambiarle inline-grid por grid. Esto es porque los que tienen texto solamente se quedan delgados (porque grid se ensancha tofo lo que puede, inline-grid no).

Si te interesan más sugerencias, puedo hacerlas. Aunque el sitio tenga una estructura compleja porque es antiguo, se puede aplicar grid por zonas y así tener mejor control.

te voy a mandar una sugerencia para el header, porque igual ya la hice. La intención es colaborar con una versión móvil tema diurno.

UNA APROXIMACION:

[Imagen: HEADER-FINAL.png]

ESTÁ MÁS ANCHA PORQUE OTROS ELEMENTOS LA FUERZAN A ESTIRARSE, pero sería:

[ LOGO ]  |  [LOGIN]
[ BARRA DE NAV ]



HICE ESTO:
Código:
/**** ESTILOS PARA EL HEADER ***/

/* desktop */

menu-principal {
display: grid;
grid-template-columns: 1fr 2fr 1fr;
grid-template-rows: auto;
grid-template-areas:
"logo nav login";
}


/* general */

.logo {
grid-area: logo;
justify-self: end;
}

.menu-login {
grid-area: login;
justify-self: start;
width: auto;
}

.menus {
width: auto;
grid-area: nav;
justify-self: center;
}

.menus ul {
max-width: none;
margin: auto;
}


/* mobile */

@media screen and (max-width: 992px) {
.menu-principal {
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
grid-template-areas:
"logo login"
"nav nav";
}
}


Bueno, saludos. Ya me metí demasiado, me parece, pero fue sólo por el bien del sitio, que lo veo muy cuidado en general y pienso que puede remontarse otra vez.

Como hoy todos se conectan desde el celular más que desde la PC, quizás no esté de más ponerse al día con los móviles.

(22-11-2021, 09:26 PM)Luis_VdM escribió:
(18-11-2021, 01:25 AM)Argi escribió: .portal-grid {
  width: auto;
}




[Imagen: c11.png]



Generalmente se hace al revés y la versión móvil es la base pero si es más fácil ponerlo así:


@media screen and (max-width: 992px) {
  .izquierda-portal {
     grid-template-columns: 1fr;
  }
}

@MarieChan tienes razón, sólo que estaba apurado. Ahora las spoilero

Gracias por la recomendación Argi, nos ayudará mucho a mejorar el sitio. ¿Puedes indicarme qué diseño de foro usas? si me mandas captura del menú superior (cabecera) lo identificaré
[Imagen: 42SnVtH.png]
Responder
 


Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
  [Duda] Petición de Change, podría publicarla? saradrawing 2 184 25-10-2024, 06:40 AM
Último mensaje: saradrawing
  [Sugerencia] Like, gracias y reputacion angiee 14 2,120 12-08-2024, 02:15 AM
Último mensaje: Terpsícore
  [Sugerencia] mi honesta opinión sobre el foro KN3 2 2,111 18-07-2024, 11:27 AM
Último mensaje: KN3
Corazon [Sugerencia] Introducir el foro al mundo social media para atraer más usuarios Larchel 14 2,012 04-07-2024, 08:39 AM
Último mensaje: Belmont
  [Duda] No puedo iniciar seción en mi PC/portatil LauLG 1 888 05-06-2024, 05:03 AM
Último mensaje: MarieChan
  [En Proceso] Centro de quejas y errores 2022 angiee 17 2,525 04-06-2024, 01:57 PM
Último mensaje: ashikari
  [En Proceso] No ver lo que escribes en un tema Belmont 4 999 20-05-2024, 06:43 PM
Último mensaje: Belmont
  [Duda] quiero entrar al discord mylifesuck2008 2 2,587 08-01-2024, 05:01 PM
Último mensaje: mylifesuck2008
Mensaje [Sugerencia] Videojuego Favorito Bitty 3 1,437 30-12-2023, 11:34 PM
Último mensaje: angiee
  [En Proceso] Mantenimiento y actualizaciones del foro Belmont 0 1,160 11-12-2023, 04:50 PM
Último mensaje: Belmont

Salto de foro:


Usuarios navegando en este tema: 1 invitado(s)

Foro Anime - Sitio de Anime, Manga, Comics y Videojuegos.

ForoAnime es más que un foro, es una familia desde 2008, creada por PikaBuu para servir como espacio seguro a todos aquellos que necesiten una distracción del día a día.