feature(smalltalk) add

.bowerrc

@@ -0,0 +1,3 @@
+{
+  "directory" : "modules"
+}

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+npm-debug.log

LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 coderaiser
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+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.

README.md

@@ -0,0 +1,70 @@
+Smalltalk
+====
+
+Simple replacement of native Alert, Confirm and Prompt.
+
+# Benefits
+
+- `5kb` javascript
+- `4kb` css
+- [Promise](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise) based
+
+# Install
+With help of [bower](http://bower.io "Bower").
+
+```
+bower install smalltalk
+```
+
+Or npm:
+
+```
+npm i smalltalk
+```
+
+# API
+
+## smalltalk.alert(title, message)
+```js
+smalltalk.alert('Error', 'There was error!').then(function() {
+    console.log('ok');
+})
+```
+
+## smalltalk.confirm(title, message)
+```js
+smalltalk.confirm('Question', 'Are you sure?').then(function() {
+    console.log('yes');
+}, function() {
+    console.log('no');
+})
+```
+
+## smalltalk.prompt(title, message, value)
+```js
+smalltalk.prompt('Question', 'How old are you?', '10').then(function(value) {
+    console.log(value);
+}, function() {
+    console.log('cancel');
+})
+```
+
+#How use?
+Create `html` page:
+
+```html
+<link rel="stylesheet" href="smalltalk.css">
+<script src="smalltalk.min.js"></script>
+<script>
+    window.addEventListener('DOMContentLoad', function() {
+        smalltalk.prompt('hello', 'world', '2+2').then(function() {
+            console.log(value);
+        }, function() {
+            console.log('close');
+        })
+    )
+</script>
+```
+
+#License
+MIT

bower.json

@@ -0,0 +1,32 @@
+{
+  "name": "smalltalk",
+  "version": "1.0.0",
+  "homepage": "https://github.com/coderaiser/smalltalk",
+  "authors": [
+    "coderaiser <[email protected]>"
+  ],
+  "description": "Modal Alert, Confirm and Prompt",
+  "main": "dist/smalltalk.min.js",
+  "moduleType": [
+    "globals",
+    "node"
+  ],
+  "keywords": [
+    "modal",
+    "alert",
+    "prompt",
+    "confirm"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "modules",
+    "test",
+    "tests"
+  ],
+  "dependencies": {
+    "promise-polyfill": "~2.1.0"
+  }
+}

css/smalltalk.css

@@ -0,0 +1,181 @@
+.smalltalk {
+    display: -webkit-flex;
+    display: -moz-box;
+    display: -ms-flexbox;
+    display: flex;
+
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+
+    -webkit-transition: 200ms opacity;
+    -moz-transition: 200ms opacity;
+    -ms-transition: 200ms opacity;
+    -o-transition: 200ms opacity;
+    transition: 200ms opacity;
+
+    background-color: rgb(255, 255, 255);
+    background-color: rgba(255, 255, 255, 0.75);
+    bottom: 0;
+    left: 0;
+    overflow: auto;
+    padding: 20px;
+    position: fixed;
+    right: 0;
+    top: 0;
+}
+
+.smalltalk .page {
+    border-radius: 3px;
+    background: white;
+    box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0,0,0,0.15);
+    color: #333;
+    min-width: 400px;
+    padding: 0;
+    position: relative;
+    z-index: 0;
+}
+
+@media only screen and (max-width: 500px) {
+    .smalltalk .page {
+        min-width: 0;
+    }
+}
+
+.smalltalk .page > .close-button {
+    background-image: url(../img/IDR_CLOSE_DIALOG.png);
+    background-position: center;
+    background-repeat: no-repeat;
+    height: 14px;
+    position: absolute;
+    right: 7px;
+    top: 7px;
+    width: 14px;
+    z-index: 1;
+}
+
+.smalltalk .page > .close-button:hover {
+    background-image: url(../img/IDR_CLOSE_DIALOG_H.png);
+}
+
+.smalltalk .page h1 {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    color: #333;
+    font-size: 120%;
+    margin: 0;
+    padding: 14px 17px 14px;
+    text-shadow: white 0 1px 2px;
+}
+
+.smalltalk .page .content-area {
+    overflow: auto;
+    padding: 6px 17px 6px;
+    position: relative;
+}    
+
+.smalltalk .page .action-area {
+    padding: 14px 17px;
+}
+
+.smalltalk .page .button-strip {
+    display: -webkit-box;
+    display: -moz-box;
+    display: -ms-flexbox;
+    display:flex;
+
+    flex-direction: row;
+    justify-content: flex-end;
+}
+
+.smalltalk .page .button-strip > button {
+    -webkit-margin-start: 10px;
+    -moz-margin-start: 10px;
+    -ms-margin-start: 10px;
+}
+
+.smalltalk button:enabled:focus, .smalltalk input:enabled:focus {
+    -webkit-transition: border-color 200ms;
+    -moz-transition: border-color 200ms;
+    -ms-transition: border-color 200ms;
+    -o-transition: border-color 200ms;
+    transition: border-color 200ms;
+    border-color: rgb(77, 144, 254);
+    outline: none;
+}
+
+.smalltalk button:enabled:active {
+    background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
+    background-image: -moz-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
+    background-image: -ms-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
+    background-image: linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
+
+    box-shadow: none;
+    text-shadow: none;
+}
+
+.smalltalk button, .smalltalk .smalltalk {
+    min-height: 2em;
+    min-width: 4em;
+}
+
+.smalltalk button::-moz-focus-inner {
+  border: 0;
+}
+
+.smalltalk button {
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+
+    background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
+    background-image: -moz-linear-gradient(#ededed, #ededed 38%, #dedede);
+    background-image: -ms-linear-gradient(#ededed, #ededed 38%, #dedede);
+    background-image: linear-gradient(#ededed, #ededed 38%, #dedede);
+
+    border: 1px solid rgb(0, 0, 0);
+    border: 1px solid rgba(0, 0, 0, 0.25);
+    border-radius: 2px;
+    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), inset 0 1px 2px rgba(255, 255, 255, 0.75);
+    color: #444;
+    font: inherit;
+    margin: 0 1px 0 0;
+    outline: none;
+    text-shadow: 0 1px 0 rgb(240, 240, 240);
+}
+
+.smalltalk button:enabled:focus, .smalltalk input:enabled:focus {
+    -webkit-transition: border-color 200ms;
+    -moz-transition: border-color 200ms;
+    -ms-transition: border-color 200ms;
+    -o-transition: border-color 200ms;
+    transition: border-color 200ms;
+    border-color: rgb(77, 144, 254);
+    outline: none;
+}
+
+.smalltalk input {
+    width: 100%;
+    border: 1px solid #bfbfbf;
+    border-radius: 2px;
+    box-sizing: border-box;
+    color: #444;
+    font: inherit;
+    margin: 0;
+    min-height: 2em;
+    padding: 3px;
+    outline: none;
+}
+
+
+button {
+    font-family: Ubuntu, Arial, sans-serif;
+}