Solution for a challenge from devChallenges.io.
- Overview
- Built With
- Features
- Contact
- Live demo can be found here: https://devchallenges-input-component-pearl.vercel.app
- The webpage was relatively easy to develop using Angular framework.
- I used Angular 11, HTML5 and CSS3 (SCSS, CSS Grid, and Flexbox) to create the webpage.
- Angular (https://www.angular.io/)
This webpage was created as a submission to a DevChallenges (https://www.devchallenges.io/challenges) challenge. The challenge (https://devchallenges.io/challenges/TSqutYM4c5WtluM7QzGp) was to build a webpage that satisfies the following user stories:
- User story: I can see error state
- User story: I can choose to disable input
- User story: I can choose to have helper text
- User story: I can choose to have an icon on the left or right (Use Google Icon and at least 5 variants)
- User story: I can have different input sizes
- User story: I can have different colors
- User story: I can choose to have input take the width of the parent
- User story: I can have multiline input like a textarea
- User story: When I hover or focus, I can see visual indicators
- User story: I can still access all input attributes
- User story (optional): Show input in a similar way like the design or use Storybook. Otherwise, showing the input in multiple states is enough
- Website [marvinrusinek.com] (http://www.marvinrusinek.com)
- GitHub [@marvinrusinek] (https://www.github.com/marvinrusinek)
- Twitter [@marvinrusinek] (https://www.twitter.com/marvinrusinek)