P
@MoepyaCode
Submitted
SpartanFranco
@SpartanFranco
All comments
- SpartanFranco• 250
@SpartanFranco
Posted
Hola,buen trabajo,solo te falta que después de que dan error los inputs, al llenarlos y hacer el submit no se resetean los errores y continúan viéndose
Marked as helpful
0 - GiaBaoDoan• 450
@GiaBaoDoan
Submitted
SpartanFranco• 250@SpartanFranco
Posted
1-)Hello, good job!!, you could also validate the sidebar so as not to pass the form step without completing it, you can even confirm it in the last step without completing it, otherwise...super
0 - Steph• 500
@xStephx
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Holaa,buen trabajo !!,me fijé que al hacer el submit con los inputs vacíos se sale del contenedor el botón de submit,porque tienes como clase md:max-h-[770px] ,entonces si sus componentes se mueven como es el caso pueden quedar fuera del main,podrías usar h-fit para que se ajuste a su contenido o aumentar el max-h para evitar ese problema ...y solo te quedaría intentar como hacer que despues de darte error los inputs al escribir en ellos el color de la fuente no sea rojo
Marked as helpful
1 - Arinze Owoh• 150
@ArinzeGit
Submitted
What are you most proud of, and what would you do differently next time?
This is my first project with Tailwind CSS. I am most proud of adding Tailwind CSS to my skills set. I am also proud of creating and using custom React hooks for the first time. I used it for step control. What I would do differently next time is to use less of absolute units (px) and more of relative units (rem, em, %)
What challenges did you encounter, and how did you overcome them?
Being my first time using Tailwind, I encountered issues with styling pseudo-classes, pseudo-elements, media queries and some compound CSS properties. I overcame these challenges by using the Tailwind documentation every step of the way.
What specific areas of your project would you like help with?
I'd like to know other ways of implementing a multi-step form other than custom react hooks for step control.
SpartanFranco• 250@SpartanFranco
Posted
Hola,excelente trabajo,el único error es que el botón de cambiar a mensual y anual no funciona y las letras del del formulario de registro al escribirlas son de un gris muy claro...te quedó igualito 💪
Marked as helpful
0 - P🔅 Yuliya 🐈• 240
@O-Julia-O
Submitted
What are you most proud of, and what would you do differently next time?
I'm proud that I was able to create working tab switching and extract data from a JSON file.
What challenges did you encounter, and how did you overcome them?
It was challenging to adjust the cards to match the specified design. I added margins, paddings to the text, and line height, which helped align the card properly.
What specific areas of your project would you like help with?
I need help with grid layout and also with the JS code. Did I place the styles correctly, and is my JS code clear? What can I improve?
SpartanFranco• 250@SpartanFranco
Posted
Hello in layout, @media screen and (min-width: 70rem) { .hero__details { margin-bottom: 8rem; ---remove this rule; } .card__item { height: 300px;---- > height: 15rem; lower the px or change it to this measurement, which is more advisable to use relative measurements,
but you have to play with the height of -.hero_container- to make it as similar as possible; if you are using grid, you could enclose - hero_container- inside cards as well and declare .cards{ grid-template-columns: repeat(4,1fr ); grid-template-rows: 1fr 1fr; }
already:
hero_container { grid-row:1/span 2 } and then you wouldn't have to play so much with the height of the cards and the hero_container
} But still...Good job!!
0 - Sudhanshu Singh• 480
@sudhanshusingh-g
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Buen trabajo,solo un poco de gap para separar los elementos y padding en los contenedores
0 - Sakthivel Ramesh• 150
@sakthivel155
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Buen trabajo!
0 - oduwa-A• 120
@oduwa-A
Submitted
What are you most proud of, and what would you do differently next time?
I'm proud of remembering the width element to control the size of it all, as well as using margin-left and margin-right to center it.
What challenges did you encounter, and how did you overcome them?
Mainly just getting the specific numbers right, not completely sure I did it since I was eyeballing the whole time.
What specific areas of your project would you like help with?
I still don't understand landmarks as much.... Would love assistance on that to make sure accessibility users can maneuver properly.
SpartanFranco• 250@SpartanFranco
Posted
Hola ,te recomiendo usar flex en el body para centrar la tarjeta como en el diseño ,si quieres que se parezca ,por lo demás ...genial💪
Marked as helpful
1 - Pepper• 240
@TeewsPepper
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Se ve bien,solo te queda de detalle que al body le asignes las propiedades display:flex; + justify-content y align-items center ambos para que la tarjeta quede centrada y un padding a esta y te queda idéntico
0 - scottyemberton• 30
@scottyemberton
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Hola buen trabajo,el único detalle es que la imagen no ocupa todo su espacio,es porque tienes : <picture class="product__content"> ....img </picture> y <div class="product__content"> ...content </div>
con las mismas clases,y en el css la clase : .product__content { display: grid; gap: var(--content-spacing); padding: var(--content-padding); }
estas aplicándole al contenedor de la imagen un padding también, por eso se ve así la imagen, una solución sería quitarle la clase a <picture> y verás el cambio,por lo demás te quedó idéntico 👌
0 - Jawad• 170
@J-Jawad
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Genial
0 - V3-Dumb_Bot• 10
@Vetrivel-bot
Submitted
SpartanFranco• 250@SpartanFranco
Posted
Buen trabajo,solo tienes que darle unos pequeños ajustes al css y quedará mas parecido, te recomiendo usar unidades relativas como rem,em o % antes de las absolutas,y en vez de usar <div> usa etiquetas semanticas como <main>
Marked as helpful
0
