Skip to content

Commit 06aa556

Browse files
author
Marvin Rudolph
committed
🎉 Initial commit
1 parent 1a7c625 commit 06aa556

18 files changed

+7966
-0
lines changed

Diff for: .babelrc

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"presets": [
3+
"@babel/env",
4+
"@babel/typescript"
5+
],
6+
"plugins": [
7+
"@babel/proposal-class-properties",
8+
"@babel/proposal-object-rest-spread"
9+
]
10+
}

Diff for: .eslintrc.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
module.exports = {
2+
parser: '@typescript-eslint/parser',
3+
parserOptions: {
4+
ecmaVersion: 2020,
5+
sourceType: 'module'
6+
},
7+
plugins: ['@typescript-eslint', 'standard', 'prettier'],
8+
env: {
9+
browser: true,
10+
es6: true,
11+
node: true
12+
},
13+
extends: [
14+
'standard',
15+
'plugin:@typescript-eslint/recommended',
16+
'prettier/@typescript-eslint',
17+
'plugin:prettier/recommended',
18+
'prettier/standard'
19+
],
20+
rules: {
21+
'lines-between-class-members': ['error', 'always', {
22+
exceptAfterSingleLine: true
23+
}]
24+
}
25+
}

Diff for: .gitattributes

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
* text=auto eol=lf

Diff for: .gitignore

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
# Created by .ignore support plugin (hsz.mobi)
2+
### Node template
3+
# Logs
4+
logs
5+
*.log
6+
npm-debug.log*
7+
yarn-debug.log*
8+
yarn-error.log*
9+
10+
# Runtime data
11+
pids
12+
*.pid
13+
*.seed
14+
*.pid.lock
15+
16+
# Directory for instrumented libs generated by jscoverage/JSCover
17+
lib-cov
18+
19+
# Coverage directory used by tools like istanbul
20+
coverage
21+
22+
# nyc test coverage
23+
.nyc_output
24+
25+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
26+
.grunt
27+
28+
# Bower dependency directory (https://bower.io/)
29+
bower_components
30+
31+
# node-waf configuration
32+
.lock-wscript
33+
34+
# Compiled binary addons (https://nodejs.org/api/addons.html)
35+
build/Release
36+
37+
# Dependency directories
38+
node_modules/
39+
jspm_packages/
40+
41+
# TypeScript v1 declaration files
42+
typings/
43+
44+
# Optional npm cache directory
45+
.npm
46+
47+
# Optional eslint cache
48+
.eslintcache
49+
50+
# Optional REPL history
51+
.node_repl_history
52+
53+
# Output of 'npm pack'
54+
*.tgz
55+
56+
# Yarn Integrity file
57+
.yarn-integrity
58+
59+
# dotenv environment variables file
60+
.env
61+
62+
# parcel-bundler cache (https://parceljs.org/)
63+
.cache
64+
65+
# Serverless directories
66+
.serverless
67+
68+
# IDE / Editor
69+
.idea
70+
.editorconfig
71+
.vscode
72+
73+
# Service worker
74+
sw.*
75+
76+
# Mac OSX
77+
.DS_Store
78+
79+
# Vim swap files
80+
*.swp

Diff for: .prettierrc.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
semi: true,
3+
trailingComma: 'all',
4+
singleQuote: true,
5+
printWidth: 80,
6+
tabs: false
7+
}

Diff for: favicon.ico

14.7 KB
Binary file not shown.

Diff for: package.json

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
{
2+
"name": "gravity-radio-button",
3+
"version": "1.0.0",
4+
"license": "MIT",
5+
"author": {
6+
"name": "Marvin Rudolph",
7+
"email": "[email protected]"
8+
},
9+
"main": "dist/bundle.js",
10+
"types": "dist/types/index.d.ts",
11+
"scripts": {
12+
"type-check": "tsc --noEmit",
13+
"type-check:watch": "yarn type-check --watch",
14+
"build:types": "tsc --emitDeclarationOnly",
15+
"build:js": "cross-env TS_NODE_PROJECT=\"tsconfig-webpack.json\" NODE_ENV=production webpack --color",
16+
"build": "npm run build:js && npm run build:types",
17+
"dev": "cross-env TS_NODE_PROJECT=\"tsconfig-webpack.json\" NODE_ENV=development webpack-dev-server --color",
18+
"lint": "eslint . --ext .ts",
19+
"lintfix": "eslint . --ext .ts --fix"
20+
},
21+
"devDependencies": {
22+
"@babel/core": "^7.6.0",
23+
"@babel/plugin-proposal-class-properties": "^7.5.5",
24+
"@babel/plugin-proposal-object-rest-spread": "^7.5.5",
25+
"@babel/preset-env": "^7.6.0",
26+
"@babel/preset-typescript": "^7.6.0",
27+
"@fullhuman/postcss-purgecss": "^1.2.0",
28+
"@types/gsap": "^1.20.2",
29+
"@types/html-webpack-plugin": "^3.2.1",
30+
"@types/mini-css-extract-plugin": "^0.8.0",
31+
"@types/node": "^12.7.5",
32+
"@types/optimize-css-assets-webpack-plugin": "^5.0.0",
33+
"@types/terser-webpack-plugin": "^1.2.1",
34+
"@types/webpack": "^4.39.1",
35+
"@types/webpack-dev-server": "^3.1.7",
36+
"@typescript-eslint/eslint-plugin": "^2.2.0",
37+
"@typescript-eslint/parser": "^2.2.0",
38+
"autoprefixer": "^9.6.1",
39+
"babel-eslint": "^10.0.3",
40+
"babel-loader": "^8.0.6",
41+
"clean-webpack-plugin": "^3.0.0",
42+
"cross-env": "^5.2.1",
43+
"css-loader": "^3.2.0",
44+
"eslint": "^5.16.0",
45+
"eslint-config-prettier": "^6.3.0",
46+
"eslint-config-standard": "^14.1.0",
47+
"eslint-plugin-import": "^2.18.2",
48+
"eslint-plugin-node": "^10.0.0",
49+
"eslint-plugin-prettier": "^3.1.0",
50+
"eslint-plugin-promise": "^4.2.1",
51+
"eslint-plugin-standard": "^4.0.1",
52+
"fork-ts-checker-webpack-plugin": "^1.5.0",
53+
"html-webpack-plugin": "^3.2.0",
54+
"mini-css-extract-plugin": "^0.8.0",
55+
"optimize-css-assets-webpack-plugin": "^5.0.3",
56+
"postcss": "^7.0.18",
57+
"postcss-cli": "^6.1.3",
58+
"postcss-loader": "^3.0.0",
59+
"prettier": "1.18.2",
60+
"tailwindcss": "^1.1.2",
61+
"terser-webpack-plugin": "^2.0.1",
62+
"ts-node": "^8.3.0",
63+
"tsconfig-paths": "^3.8.0",
64+
"typescript": "^3.6.2",
65+
"webpack": "^4.39.3",
66+
"webpack-cli": "^3.3.8",
67+
"webpack-dev-server": "^3.8.0"
68+
},
69+
"dependencies": {
70+
"gsap": "^2.1.3"
71+
}
72+
}

Diff for: postcss.config.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
const isProduction = process.env.NODE_ENV === 'production';
2+
const purgeCss = require('@fullhuman/postcss-purgecss');
3+
4+
module.exports = {
5+
plugins: [
6+
require('tailwindcss'),
7+
require('autoprefixer'),
8+
isProduction
9+
? purgeCss({
10+
content: ['./src/*.html', './src/assets/css/*.css'],
11+
})
12+
: '',
13+
],
14+
};

Diff for: src/assets/css/style.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;

Diff for: src/components/GravityRadioButton.ts

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
class GravityRadioButton {
2+
protected element!: HTMLElement;
3+
protected radio!: HTMLInputElement | null;
4+
protected indicator!: HTMLElement | null;
5+
6+
constructor(element: HTMLElement) {
7+
this.element = element;
8+
this.radio = element.querySelector('input[type="radio"]');
9+
this.indicator = element.querySelector('[data-indicator]');
10+
}
11+
12+
public initialize(): void {
13+
this.bindEventListener();
14+
}
15+
16+
protected bindEventListener(): void {
17+
if (this.radio) {
18+
this.radio.addEventListener('change', (e: Event) => {
19+
const target: HTMLInputElement = e.target as HTMLInputElement;
20+
});
21+
}
22+
}
23+
}
24+
25+
export default GravityRadioButton;

Diff for: src/gsap-shims.d.ts

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
/**
2+
* `@types/gsap` is included but outdated for import usage with `gsap/all`
3+
* So this file fixes the type-check until it will be fixed by `@types/gsap` itself
4+
*/
5+
declare module 'gsap/all' {
6+
import gsap from 'gsap';
7+
export = gsap;
8+
}

Diff for: src/index.html

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
5+
<meta name="theme-color" content="#4F4FED" />
6+
<meta charset="utf-8">
7+
<link rel="shortcut icon" href="/favicon.ico">
8+
<title>Stack Icon - by Marvin Rudolph</title>
9+
</head>
10+
<body class="bg-blue-dark flex items-center justify-center h-screen w-full">
11+
<div>
12+
<label class="flex items-center text-white cursor-pointer mb-5" data-gravity-radio>
13+
<div class="mr-3 overflow-hidden w-6 h-6 bg-gray-dark rounded-full cursor-pointer">
14+
<input type="radio" name="gravity" class="opacity-0 w-0 h-0" />
15+
<div data-indicator></div>
16+
</div>
17+
<span></span>
18+
</label>
19+
<label class="flex items-center text-white cursor-pointer mb-5" data-gravity-radio>
20+
<div class="mr-3 overflow-hidden w-6 h-6 bg-gray-dark rounded-full cursor-pointer">
21+
<input type="radio" name="gravity" class="opacity-0 w-0 h-0" />
22+
<div data-indicator></div>
23+
</div>
24+
<span></span>
25+
</label>
26+
</div>
27+
</body>
28+
</html>

Diff for: src/index.ts

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import '~/assets/css/style.css';
2+
import GravityRadioButton from '~/components/GravityRadioButton';
3+
4+
const gravityRadioButtons: NodeListOf<HTMLElement> = document.querySelectorAll(
5+
'[data-gravity-radio]',
6+
);
7+
8+
gravityRadioButtons.forEach((element: HTMLElement) => {
9+
const gravityRadioButton = new GravityRadioButton(element);
10+
gravityRadioButton.initialize();
11+
});

Diff for: tailwind.config.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
module.exports = {
2+
theme: {
3+
colors: {
4+
white: '#fff',
5+
blue: {
6+
dark: '#101523',
7+
},
8+
gray: {
9+
dark: '#2f3545',
10+
},
11+
},
12+
},
13+
variants: {},
14+
plugins: [],
15+
};

Diff for: tsconfig-webpack.json

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"compilerOptions": {
3+
"module": "commonjs",
4+
"target": "es5",
5+
"strict": true,
6+
"sourceMap": true,
7+
"allowSyntheticDefaultImports": true,
8+
"esModuleInterop": true,
9+
"noUnusedParameters": true,
10+
"noImplicitReturns": true,
11+
"noUnusedLocals": true,
12+
"noImplicitAny": true,
13+
"newLine": "LF"
14+
}
15+
}

Diff for: tsconfig.json

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"compilerOptions": {
3+
"target": "esnext",
4+
"module": "esnext",
5+
"moduleResolution": "node",
6+
"lib": [
7+
"esnext",
8+
"esnext.asynciterable",
9+
"dom"
10+
],
11+
"declaration": true,
12+
"declarationDir": "dist/types",
13+
"strict": true,
14+
"sourceMap": true,
15+
"allowSyntheticDefaultImports": true,
16+
"esModuleInterop": true,
17+
"noUnusedParameters": true,
18+
"noImplicitReturns": true,
19+
"noUnusedLocals": true,
20+
"noImplicitAny": true,
21+
"newLine": "LF",
22+
"baseUrl": ".",
23+
"paths": {
24+
"~/*": [
25+
"./src/*"
26+
]
27+
}
28+
},
29+
"include": [
30+
"src/**/*"
31+
],
32+
"exclude": [
33+
"node_modules",
34+
"dist"
35+
]
36+
}

0 commit comments

Comments
 (0)