Redesign Homepage, by Misah - Fixed #6

[MisahSaid]

Ik heb een redesign gemaakt van de homepage in figma:

Uit de feedback van de opdrachtgevers hebben we gekregen dat we meer animaties moeten toevoegen als dat lukt. Dat heb ik dus tot nu toe uitgewerkt tot version 1, hij is niet volledig af.

Maar waar opgelet moet worden tijdens de reviews is, of ik me aan de code regels heb gehouden en of ik de animatie op de beste manier heb gebouwd met PE in mind. (Ik heb namelijk voor de animatie alleen CSS gebruikt met als doel om zo min mogelijk JS te gebruiken.)

CSS, Animatie:

pleasurable-ui/public/styleM.css

Lines 130 to 162 in 1f7642e

	/* right to left */
	@keyframes moveSideToSide {
	0% {
	transform: translateX(0);
	}
	50% {
	transform: translateX(100px);
	}
	100% {
	transform: translateX(0);
	}
	}
	/* left to right + little delay */
	@keyframes moveSideToSide2 {
	0% {
	transform: translateX(0);
	}
	40% {
	transform: translateX(-100px);
	}
	100% {
	transform: translateX(0);
	}
	}
	#moving-svg {
	animation: moveSideToSide 4s ease-in-out ;
	}
	#moving-svg2 {
	animation: moveSideToSide2 4s ease-in-out ;
	}

CSS, Code regels:
https://github.com/lisavanmansom/pleasurable-ui/wiki/Week-1#code-conventies

Voorbeelden:

• comments:
  

  pleasurable-ui/public/styleM.css

  Lines 130 to 132 in 1f7642e

  	/* right to left */
  	@keyframes moveSideToSide {
  	0% {

• inspringen:
  

  pleasurable-ui/views/index.ejs

  Lines 7 to 10 in 1f7642e

  	<header>
  	<h1>TODAY'S</h1>
  	<h1><span>LISTING</span></h1>
  	</header>

• Wel vind ik dat het de html structuur beter kan, ivm tijd heb ik dat genegeerd, we kunnen hier bijvoorbeeld een issue van maken :)

Fixed #6

[lisavanmansom]

Super leuk design! Verder heb je ook code volgens de code conventies en is je design in de stijl van Tumi mundo.

[KrijnHoetmer]

Er zijn best veel gewijzigde bestanden in dit pull request, dus dit lijkt meer dan wat je beschrijft. Probeer je pull requests kleiner te houden, zodat de code ook gereviewed kan worden.