Add initial working code for library flex-banner

Signed-off-by: isamrish <[email protected]>
isamrish · Jan 20, 2020 · 9a1d578 · 9a1d578
commit 9a1d578
Show file tree

Hide file tree

Showing 23 changed files with 19,074 additions and 0 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,4 @@
+node_modules/
+dist/
+*-error.log
+example/node_modules/
diff --git a/.travis.yml b/.travis.yml
@@ -0,0 +1,4 @@
+language: node_js
+node_js:
+  - 9
+  - 8
diff --git a/README.md b/README.md
@@ -0,0 +1,29 @@
+# flex-banner
+
+> Fully responsive react banner for websites
+
+[![NPM](https://img.shields.io/npm/v/flex-banner.svg)](https://www.npmjs.com/package/flex-banner) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## Install
+
+```bash
+npm install --save flex-banner
+```
+
+## Usage
+
+```tsx
+import * as React from "react";
+
+import BannerComponent from "flex-banner";
+
+class Example extends React.Component {
+  render() {
+    return <BannerComponent />;
+  }
+}
+```
+
+## License
+
+MIT © [isamrish](https://github.com/isamrish)
diff --git a/example/.gitignore b/example/.gitignore
@@ -0,0 +1 @@
+node_modules/
diff --git a/example/README.md b/example/README.md
@@ -0,0 +1 @@
+# Example for flex-banner
diff --git a/example/package.json b/example/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "flex-banner-example",
+  "homepage": "https://isamrish.github.io/flex-banner",
+  "version": "0.0.0",
+  "license": "MIT",
+  "private": true,
+  "dependencies": {
+    "prop-types": "^15.6.2",
+    "react": "^16.4.1",
+    "react-dom": "^16.4.1",
+    "react-scripts": "^1.1.4",
+    "flex-banner": "link:.."
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test --env=jsdom",
+    "eject": "react-scripts eject"
+  }
+}
diff --git a/example/public/index.html b/example/public/index.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="theme-color" content="#000000">
+
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+
+    <title>flex-banner</title>
+  </head>
+
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+
+    <div id="root"></div>
+  </body>
+</html>
diff --git a/example/public/manifest.json b/example/public/manifest.json
@@ -0,0 +1,8 @@
+{
+  "short_name": "flex-banner",
+  "name": "flex-banner",
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/example/src/App.js b/example/src/App.js
@@ -0,0 +1,43 @@
+import React from "react";
+
+import BannerComponent from "flex-banner";
+const App = () => {
+  const config = {
+    title: "Title of banner",
+    link: {
+      title: "Google",
+      url: `https://google.com`
+    },
+    delayTimeToShowBanner: 1,
+    slidingTime: 1,
+    center: true, // Whether Align the main block items center or not
+    timeForCookie: false, // in days { default is false or number } = number represents days to keep
+    isCross: true,
+    wrapperStyle: {
+      backgroundColor: "blue",
+      paddingLeft: "24px",
+      paddingRight: "24px",
+      textAlign: "center"
+    },
+    mainStyle: {
+      color: "white",
+      textAlign: "center",
+      margin: "10px"
+    },
+    crossStyle: {
+      fontSize: "16px"
+    }
+  };
+  return (
+    <div>
+      <BannerComponent config={config} />
+      <div
+        style={{ height: "200px", padding: "30px", backgroundColor: "green" }}
+      >
+        <h2 style={{ margin: "0px" }}>This is dummy image!!!</h2>
+      </div>
+    </div>
+  );
+};
+
+export default App;
diff --git a/example/src/index.css b/example/src/index.css
@@ -0,0 +1,5 @@
+body {
+  margin: 0;
+  padding: 0;
+  font-family: sans-serif;
+}
diff --git a/example/src/index.js b/example/src/index.js
@@ -0,0 +1,7 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import './index.css'
+import App from './App'
+
+ReactDOM.render(<App />, document.getElementById('root'))