Setup v2, NextJS, React, TS (#37)

* Initial Setup

* Separate color & hex input

* Separate color & hex input

* Support RGB with Alpha

* Add toggle for switching HEX & RGB

* Color Picker & Themed toggle

* Improve responsiveness

* Clean Up

* Fix repo url

* Update NextJS & Setup GA

* Remove console.log

* Move to Gatsby

* Fix filename

* Correct page title

Author: manosim

.gitignore

@@ -1,4 +1,3 @@
-### Node ###
 # Logs
 logs
 *.log
@@ -21,7 +20,7 @@ coverage
 # nyc test coverage
 .nyc_output
 
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
 .grunt
 
 # Bower dependency directory (https://bower.io/)
@@ -30,14 +29,14 @@ bower_components
 # node-waf configuration
 .lock-wscript
 
-# Compiled binary addons (https://nodejs.org/api/addons.html)
+# Compiled binary addons (http://nodejs.org/api/addons.html)
 build/Release
 
 # Dependency directories
 node_modules/
 jspm_packages/
 
-# TypeScript v1 declaration files
+# Typescript v1 declaration files
 typings/
 
 # Optional npm cache directory
@@ -52,33 +51,19 @@ typings/
 # Output of 'npm pack'
 *.tgz
 
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variables file
-.env
-.env.test
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-
-# next.js build output
-.next
+# dotenv environment variable files
+.env*
 
-# nuxt.js build output
-.nuxt
+# gatsby files
+.cache/
+public
 
-# vuepress build output
-.vuepress/dist
+# Mac files
+.DS_Store
 
-# Serverless directories
-.serverless/
-
-# FuseBox cache
-.fusebox/
-
-# DynamoDB Local files
-.dynamodb/
-
-# Deployment
-build/
+# Yarn
+yarn-error.log
+.pnp/
+.pnp.js
+# Yarn Integrity file
+.yarn-integrity

.nvmrc

@@ -1 +1 @@
-10.15.1
+10.17.0

.prettierrc

@@ -0,0 +1,4 @@
+trailingComma: "es5"
+tabWidth: 2
+semi: true
+singleQuote: true

.travis.yml

@@ -1,7 +1,7 @@
 The MIT License
 =======================
 
-Copyright (c) 2014 Emmanouil Konstantinidis. http://www.iamemmanouil.com
+Copyright (c) 2020 Emmanouil Konstantinidis. https://www.manos.im/
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -20,4 +20,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 THE SOFTWARE.
-

Gruntfile.js

@@ -1,24 +1,21 @@
-# UIColor.xyz [![Build Status](https://travis-ci.org/manosim/ui-color.svg?branch=master)](https://travis-ci.org/manosim/ui-color)
+# UIColor.io [![Build Status](https://travis-ci.org/manosim/ui-color.svg?branch=master)](https://travis-ci.org/manosim/ui-color)
 
-Website: [http://www.uicolor.xyz/](http://www.uicolor.xyz/)
+## Getting Started
 
-UIColor is a website used to convert HEX & RGB colors to **UIColor** for both **Objective-C** and **Swift** featuring a **colorpicker** and **copy to clipboard** functionality making things easier.
+First, run the development server:
 
-### Prerequisites
+```bash
+yarn start
+```
 
-- AngularJS
-- NPM
-- Grunt
-- Http-Server
+Open [http://localhost:8000](http://localhost:8000) with your browser to see the result.
 
-### Development
+You can start editing the page by modifying `src/pages/index.js`. The page auto-updates as you edit the file.
 
-You have to install **http-server** globally and then just watch and serve the files.
+## Learning Gatsby
 
-    npm install
-    npm install http-server -g
-    npm start
+Looking for more guidance? Full documentation for Gatsby lives [on the website](https://www.gatsbyjs.org/). Here are some places to start:
 
-### License
+- **For most developers, we recommend starting with our [in-depth tutorial for creating a site with Gatsby](https://www.gatsbyjs.org/tutorial/).** It starts with zero assumptions about your level of ability and walks through every step of the process.
 
-UIColor is licensed under the MIT Open Source license. For more information, see the LICENSE file in this repository.
+- **To dive straight into code samples, head [to our documentation](https://www.gatsbyjs.org/docs/).** In particular, check out the _Guides_, _API Reference_, and _Advanced Tutorials_ sections in the sidebar.

LICENSE.md

@@ -0,0 +1,45 @@
+module.exports = {
+  siteMetadata: {
+    title: `UIColor.io`,
+    description: `UIColor.io is a website that helps you convert HEX & RGB colors to UIColor for Objective-C, Swift and Xamarin featuring a colorpicker and copy to clipboard functionality to make things easier.`,
+    author: `@manosim_`,
+    keywords: `uicolor,ui,color,colour,convert,converter,hex,rgb,rgba,swift,objective-c,objective,c,apple,ios`,
+  },
+  plugins: [
+    `gatsby-plugin-typescript`,
+    `gatsby-plugin-styled-components`,
+    `gatsby-plugin-react-helmet`,
+    {
+      resolve: `gatsby-plugin-manifest`,
+      options: {
+        name: `UIColor.io`,
+        short_name: `starter`,
+        start_url: `/`,
+        background_color: `#4A5899`,
+        theme_color: `#4A5899`,
+        display: `minimal-ui`,
+        icon: `static/images/favicon.png`,
+      },
+    },
+    // this (optional) plugin enables Progressive Web App + Offline functionality
+    // To learn more, visit: https://gatsby.dev/offline
+    // `gatsby-plugin-offline`,
+    {
+      resolve: 'gatsby-plugin-web-font-loader',
+      options: {
+        google: {
+          families: ['Sen'],
+        },
+      },
+    },
+    {
+      resolve: `gatsby-plugin-google-analytics`,
+      options: {
+        // The property ID; the tracking code won't be generated without it
+        trackingId: 'UA-6891078-41',
+        // Defines where to place the tracking script - `true` in the head and `false` in the body
+        head: false,
+      },
+    },
+  ],
+};