From 06469166c83f58f8f4287293d927b8c62bd72387 Mon Sep 17 00:00:00 2001 From: Florin Pop Date: Tue, 12 Mar 2019 07:46:07 +0200 Subject: [PATCH] added Trello Board to Flip Image --- Projects/Flip-Image-App.md | 21 +++++++++------------ 1 file changed, 9 insertions(+), 12 deletions(-) diff --git a/Projects/Flip-Image-App.md b/Projects/Flip-Image-App.md index 93189e3b..09a1f1b5 100644 --- a/Projects/Flip-Image-App.md +++ b/Projects/Flip-Image-App.md @@ -2,34 +2,31 @@ It's important for Web Developers to understand the basics of manipulating images since rich web applications rely on images to add value to the user -interface and user experience (UI/UX). +interface and user experience (UI/UX). FlipImage explores one aspect of image manipulation - image rotation. This -app displays a square pane containing a single image presented in a 2x2 +app displays a square pane containing a single image presented in a 2x2 matrix. Using a set of up, down, left, and right arrows adjacent to each of the images the user may flip them vertically or horizontally. -You must only use native HTML, CSS, and Javascript to implement this app. +You must only use native HTML, CSS, and Javascript to implement this app. Image packages and libraries are not allowed. ## User Stories -- [ ] User can see a pane containing a single image repeated in a 2x2 matrix. -- [ ] User can flip any one of the images vertically or horizontally using -a set of up, down, left, and right arrows next to the image. +- [ ] User can see a pane containing a single image repeated in a 2x2 matrix +- [ ] User can flip any one of the images vertically or horizontally using a set of up, down, left, and right arrows next to the image. ## Bonus features -- [ ] User can change the default image by entering the URL of a different -image in an input field. -- [ ] User can display the new image by clicking a 'Display' button next to -the input field +- [ ] User can change the default image by entering the URL of a different image in an input field +- [ ] User can display the new image by clicking a 'Display' button next to the input field - [ ] User can see an error message if the new images URL is not found ## Useful links and resources -- [How to Flip an Image](https://www.w3schools.com/howto/howto_css_flip_image.asp) -- [Create a CSS Flipping Animatin](https://davidwalsh.name/css-flip) +- [How to Flip an Image](https://www.w3schools.com/howto/howto_css_flip_image.asp) +- [Create a CSS Flipping Animatin](https://davidwalsh.name/css-flip) ## Example projects