Newsletter sign-up form

Community feedback

• 

  P

  yoyov51234•240

  @yoyov51234Posted 6 months ago

  Hi Grego14,

  Good implementation!

  Regarding the mobile design, it seems position absolute is not a good choice, as some content is hidden behind the image. I tried, removed your absolute and just used the flex with direction: column-reverse, it works.

  	.form:not(.success) {
  		flex-direction: column-reverse;
  		min-width: 100vw;
  		min-height: 100vh;
  		border-radius: 0;
  		align-items: stretch;
  	}
  
  	.form__right-section {
  		padding: 0;
  		/* position: absolute; */
  		/* z-index: 2; */
  		min-width: 100%;
  		min-height: auto;
  		top: 0;
  	}
  
  	.form__left-section {
  		padding: 0 2rem 3rem;
  		min-height: max-content;
  		/* position: absolute; */
  		/* z-index: 1; */
  		min-width: 100%;
  		bottom: 8rem;
  	}
  

  It seems you implemented the desktop design first then the mobile, from the learning path, I learned it would be better to implement the mobile design first.

  Hope it helps , happy coding !

  Marked as helpful

  1

  ---

  

  Grego•1,310

  @Grego14Posted 6 months ago

  @yoyov51234 👋 Hello! Thank you for your feedback, I just updated it, and not only what you told me but a lot of bugs and errors that it had, and about Mobile First I recently started to implement it in the new challenges. I also added accessibility!

  0