Skip to content

andrebdasilva/Border-Radius-Previewer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Border-radius Previewer

In portuguese

Tier: 1-Beginner

This is a solution to the Border-radius Previewer.
App Ideas challenge.

Table of contents

Overview

The challenge

Users should be able to:

  • User can see a box which has a border-radius property applied to it
  • User can change the 4 border-radius values that are applied to the box (top-left, top-right, bottom-left, bottom-right)
  • User can copy the resulting CSS to the clipboard

Bonus features

  • User can move with the arrow up or down arrow on the keyboard to change the values border-radius
  • User can hold mouse and move up or down to change values border-radius
  • User can change all 8 possible values of the border-radius in order to create a complex shape

Screenshot

Entering values into the inputs and moving the arrow up changes the values

Author

Developed by André Barbosa
Github
Linkedin

Skills

HTML5 CSS3 JAVASCRIPT