Simple neomorphism react clock 🕘

See demo

Here you can read how to run it, and how to use all components. Lets start 👇

This project was bootstrapped with Create React App.

To do:

• Time format changing
• Temperature units changing

How to run? 🏃‍♂️

In the project directory, you can run:

npm start

Runs the app in the development mode. 🛠
Open http://localhost:3000 to view it in the browser.

npm test

Launches the test runner in the interactive watch mode. 🧪
But right now this feature isn't available. 🌚

npm build

Builds the app for production to the build folder. 🏗
It correctly bundles React in production mode and optimizes the build for the best performance.

Components guide 🧩

Analog clock ⌚

Uses useTime hook to get data about arrows rotation (hh, mm, ss). [See docs](https://github.com/daniknewgarden/amazing-react-hooks#usetime- useTime docs)

Button 🔘

Toggle button

Props

Prop	Type	Description
text	string	text inside button
icon	img	path to button icon
onClick	function	callback function

Date 📆

Uses useDate hook to get current day and mountName. [See docs](https://github.com/daniknewgarden/amazing-react-hooks#usedate- useDate docs)

Digital clock 🕦

Uses useTime hook to get current time. [See docs](https://github.com/daniknewgarden/amazing-react-hooks#usetime- useTime docs)

Settings ⚙

Switcher

Prop	Type	Description
ariaLabel	string	aria description
callback	function	callback function
defaultState	boolean	enabled or disabled

Text

Title

Heading 2

Prop	Type	Description
text	string	text

Subtitle

Heading 3

Prop	Type	Description
text	string	text

Weather ☁

Prop	Type	Description
tempUnits	string	celsius '_c' or fahrenheit '_f'