initial commit

HTMLElements · Dec 10, 2018 · 37b9268 · 37b9268
1 parent cdb9796
commit 37b9268
Show file tree

Hide file tree

Showing 6 changed files with 183 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -1,2 +1,84 @@
-# smart-tooltip
-Tooltip Web Component
+[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/htmlelements/smart-tooltip)
+
+# &lt;smart-tooltip&gt;
+
+[Live Demo ↗](https://htmlelements.com/demos/tooltip/)
+|
+[Documentation ↗](https://www.htmlelements.com/docs/)
+|
+[Installation ↗](https://www.npmjs.com/package/@smarthtmlelements/smarthtmlelements-core)
+
+[&lt;smart-tooltip&gt;](https://htmlelements.com/demos/tooltip/) is a Custom HTML Element providing slide show/banner rotator](https://htmlelements.com/).
+
+<!--
+```
+<custom-element-demo>
+  <template>
+    <script src="../webcomponentsjs/webcomponents-lite.js"></script>
+    <script src="../smart-core/source/smart.core.js"></script>
+    <link rel="stylesheet" href="../smart-core/source/styles/smart.default.css" type="text/css" />
+ <script>
+   window.onload = function () {
+  
+   }
+   </script>
+     <next-code-block></next-code-block>
+  </template>
+</custom-element-demo>
+```
+-->
+```html
+    <smart-button id="button">Button</smart-button>
+    <smart-tooltip id="tooltip" selector="button" arrow>This is a tooltip for smartButton</smart-tooltip>
+```
+
+[<img src="https://raw.githubusercontent.com/htmlelements/smart-tooltip/master/tooltip-web-component.png" alt="Screenshot of smart-tooltip">](https://htmlelements.com/demos/tooltip)
+
+## Getting Started
+
+Smart HTML Elements components documentation includes getting started, customization and api documentation topics.
+
+[Getting Started Documentation](https://www.htmlelements.com/docs/)
+
+
+## The file structure for Smart HTML Elements
+
+- `source/`
+
+  Javascript files.
+
+- `source/styles/`
+
+  Component CSS Files.
+
+- `demos/`
+
+  Demo files
+
+## Running demos in browser
+
+1. Fork the `Smart-HTML-Elements-Core` repository and clone it locally.
+
+1. Make sure you have [npm](https://www.npmjs.com/) installed.
+
+1. When in the `Smart-HTML-Elements-Core` directory, run `npm install` and then `bower install` to install dependencies.
+
+1. Run a localhost or upload the demo on a web server. Then run:
+
+  - /demos/smart-tooltip/smart-tooltip-overview.htm
+
+
+## Following the coding style
+
+We are using [ESLint](http://eslint.org/) for linting JavaScript code. 
+
+## Creating a pull request
+
+  - Make sure your code is compliant with ESLint
+  - [Submit a pull request](https://www.digitalocean.com/community/tutorials/how-to-create-a-pull-request-on-github) with detailed title and description
+  - Wait for response from one of our team members
+
+
+## License
+
+Apache License 2.0
diff --git a/bower.json b/bower.json
@@ -0,0 +1,25 @@
+{
+  "name": "smart-tooltip",
+  "authors": [
+    "jQWidgets Ltd"
+  ],
+  "description": "Smart Tooltip is a free Tooltip Element, built using native Javascript and CSS.",
+  "license": "Apache-2.0",
+  "keywords": [
+    "smart Tooltip",
+    "Tooltip",
+	"Tooltip Web Component",
+	"Tooltip Custom Element"
+  ],
+  "main": "",
+  "ignore": [
+    "**/.*",
+    "**/node_modules",
+    "**/bower_components",
+    "**/tests"
+  ],
+  "dependencies": {
+    "webcomponentsjs": "^1.0.0",
+    "smart-core": "HTMLElements/smart-core"
+  }
+}
diff --git a/demos/smart-tooltip-overview.htm b/demos/smart-tooltip-overview.htm
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/1.0.22/webcomponents-lite.js"></script>
+
+    <link rel="stylesheet" href="../../smart-core/source/styles/smart.default.css" type="text/css" />
+    <!--! do not remove --> 
+   <link rel="stylesheet" href="../styles/demos.css" type="text/css" />
+   <script type="text/javascript" src="../../smart-core/source/smart.core.js"></script>
+   <script>
+   window.onload = function () {
+
+   }
+   </script>
+</head>
+<body>
+   <smart-button id="button">Button</smart-button>
+   <smart-tooltip id="tooltip" selector="button" arrow>This is a tooltip for smartButton</smart-tooltip>
+ </body>
+</html>
diff --git a/package.json b/package.json
@@ -0,0 +1,46 @@
+{
+  "name": "@smarthtmlelements/smart-tooltip",
+  "version": "2.0.0",
+  "description": "Smart Tooltip",
+   "scripts": { 
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/HTMLElements/smart-tooltip.git"
+  },
+  "author": "Smart HTML Elements",
+  "license": "SEE LICENSE IN https://www.htmlelements.com/license/",
+  "bugs": {
+    "url": "https://github.com/HTMLElements/smart-tooltip"
+  },
+  "homepage": "https://github.com/HTMLElements/smart-tooltip#readme",
+  "devDependencies": {
+
+  },
+  "dependencies": {
+    "@webcomponents/webcomponentsjs": "^1.0.22",
+     "@smarthtmlelements/smart-core": "^2.0.0"
+  },
+  "main": "index.js",
+  "directories": {},
+  "keywords": [
+	"custom",
+	"element",
+	"tooltip custom element",
+	"html tooltip",
+	"tooltip",
+	"web components tooltip",
+	"tooltip element",
+	"banner rotator",
+	"custom tooltip",
+	"tooltip widget",
+	"tooltip ui",
+	"tooltip component",
+	"tooltip control",
+ 	"banner",
+  	"banner element",
+  	"banner user interface",
+  	"material banner",
+  	"material tooltip"
+  ]
+}
diff --git a/styles/demos.css b/styles/demos.css
@@ -0,0 +1,8 @@
+smart-carousel {
+    width: 1000px;
+    height: 450px;
+    border-width: 0px;
+    margin-left: auto;
+    margin-right: auto;
+    background-color: #d3d3d369;
+}
diff --git a/tooltip-web-component.png b/tooltip-web-component.png