Compare commits

..

40 Commits

Author SHA1 Message Date
17d996ba13 Update Drone Build Rules
All checks were successful
continuous-integration/drone/push Build is passing
2023-12-04 19:23:35 -05:00
01f6839ecb Add Binary Check for Winter Values
All checks were successful
continuous-integration/drone Build is passing
2023-12-03 16:35:42 -05:00
326791b825 Update Queries to enable editing records
Change Winter values to 1 or 0
2023-12-03 16:25:18 -05:00
be94b0e373 Add Data for existing query into form 2023-12-03 16:09:50 -05:00
71b87621f6 WIP on modifying influx entries 2023-10-18 07:56:29 -04:00
2487f0c20e Add Logic to run existing influx 2023-09-29 11:19:07 -04:00
7531c9cc7c Add Winter parameter for Repeat entries 2022-12-29 23:25:32 -05:00
ahosking
277930acde Add Fuel costs when they exist
All checks were successful
continuous-integration/drone/push Build is passing
2022-11-04 15:17:16 -04:00
ahosking
4aab99bcbc Remove the test phase for now
All checks were successful
continuous-integration/drone/push Build is passing
2022-11-03 00:19:01 -04:00
ahosking
58242e82a6 Add Drone file to start CI/CD
Some checks failed
continuous-integration/drone/push Build is failing
2022-11-03 00:14:55 -04:00
ahosking
3ec11e3051 Add missing requirements 2022-11-03 00:09:17 -04:00
ahosking
da166e5169 Check the value of winter on the last record
This will ensure that the UX is consistent after the first change to/from
Winter is made
2022-11-03 00:06:32 -04:00
ahosking
526e6d3439 Extend Data search to 90 days
Add Winter value to the data selected and passed to index
2022-11-03 00:05:56 -04:00
e8b41b402e Only show repeat if data is present 2022-09-24 12:00:02 -04:00
ahosking
d2bda44411 Make data unique and in order 2022-08-12 02:26:11 -04:00
ahosking
7d6bd7cc70 Put data into a table for viewing 2022-08-12 02:25:59 -04:00
ahosking
66a031d9a2 Add Repeat functionality 2022-08-12 02:05:13 -04:00
ahosking
85a03dc098 Combine queries and sort by date
There is lots of debugging output here to get rid of but, this change
helps to ensure that on the index page, we sort by date to ensure our
data looks correct.

This also attempts to get the last entry for easy duplication but this is
limited by the time specified and needs to be fixed.
2022-08-04 10:44:37 -04:00
ahosking
fb2aad93fd Ignore env variables 2022-07-21 00:29:34 -04:00
ahosking
65b88c2fbe Ignore Influx Data 2022-07-21 00:29:06 -04:00
ahosking
7812b2058b Add Repeat Button and Function 2022-07-15 01:08:38 -04:00
ahosking
6bb2be70f7 Fix missed field to tag 2022-07-03 01:20:43 -04:00
ahosking
b073c37db0 Rearrage Write Query 2022-07-03 01:17:37 -04:00
ahosking
8d11f61dc7 Change fields to tags 2022-07-03 01:10:29 -04:00
ahosking
39009533c1 Add a name to the container 2022-07-03 00:41:01 -04:00
ahosking
e7eb6cb50d Add sample environment file 2022-07-03 00:36:53 -04:00
ahosking
94c493fa9b Major change to Influx 2
This includes new queries for data,
New queries for creating/submitting data
and some new code that needs to be refactored
2022-07-03 00:31:01 -04:00
ahosking
06f194f8bd Clean up Templates and include new data points 2022-07-03 00:29:09 -04:00
ahosking
fd5cfd5021 Add script to run InfluxDB 2022-07-03 00:28:54 -04:00
2c461ad4f7 Upgrade to influx2 2022-06-28 07:42:26 -04:00
18ce2b5399 Update static 2022-06-20 20:16:24 -04:00
Gogs
63b6d6944d Change python to actual booleans. 2017-04-09 18:36:01 -04:00
Gogs
bc284e2514 Updating html field types 2017-04-04 02:01:06 -04:00
Gogs
e3cebcb73b Changing number fields to allow decimals 2017-02-12 01:55:22 -05:00
Gogs
7d760985b8 Add 5 latest readings to the bottom of the page 2017-02-03 00:32:23 -05:00
Gogs
030dc33d55 Allow date/time-free entries 2017-01-29 00:37:38 -05:00
Gogs
6c354e40a9 Improve the fuel and fuelcost type handling 2017-01-29 00:16:51 -05:00
Gogs
98d2c082ee Add explicit variable types 2017-01-28 02:09:09 -05:00
Alexander Hosking
23085de24e First version of insert with hardcoded db and measurement 2016-12-27 09:30:20 -05:00
Alexander Hosking
3361735d58 Update requirements and place base form 2016-12-26 22:43:38 -05:00
472 changed files with 176448 additions and 43 deletions

39
.drone.yml Normal file
View File

@ -0,0 +1,39 @@
kind: pipeline
type: docker
name: build
steps:
- name: build
image: python:3-buster
commands:
- export PYTHONPATH=.
- export FLASK_APP=period
- apt-get update -qy
- apt-get install -y python3-dev python3-pip
- pip3 install --upgrade pip
- pip3 install --upgrade setuptools
- pip3 install Flask gunicorn pytest pytest-cov
- pip3 install pendulum
trigger:
branch:
- master
- influx2
event:
- push
# ---
# kind: pipeline
# type: docker
# name: test
# steps:
# - name: test
# image: python:3-buster
# commands:
# - export PYTHONPATH=.
# - export FLASK_APP=period
# - apt-get update -qy
# - apt-get install -y python3-dev python3-pip
# - pip3 install --upgrade pip
# - pip3 install --upgrade setuptools
# - pip3 install Flask gunicorn pytest pytest-cov
# - pip3 install pendulum
# - pytest tests --cov --cov-report term --cov-report html --junitxml=report.xml

3
.env.sample Normal file
View File

@ -0,0 +1,3 @@
DB_URL="http://localhost:8086"
DB_TOKEN="AXmv7Qg2JE2yk7DW3yg8EAEDh71txGjNYMviOcoXNjIg=="
DB_ORG="users"

7
.gitignore vendored
View File

@ -4,6 +4,9 @@ __pycache__/
*.py[cod]
*$py.class
#env
.env
# C extensions
*.so
@ -58,3 +61,7 @@ docs/_build/
# PyBuilder
target/
#Influx data
engine/
influxd.bolt
influxdb

3
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"editor.acceptSuggestionOnEnter": "on"
}

8
docker_run.sh Executable file
View File

@ -0,0 +1,8 @@
if [ $( docker ps -a | grep influxdb | wc -l ) -gt 0 ]; then
docker start influxdb
else
docker run --name influxdb -p 8086:8086 \
-v $PWD:/var/lib/influxdb2 \
influxdb:2.0
fi

View File

@ -1,35 +1,192 @@
from flask import Flask, render_template
from flask_wtf import FlaskForm
from wtforms import StringField
from wtforms.validators import DataRequired
from flask import Flask, request, render_template, redirect, url_for
from time import strftime
import pendulum
from dotenv import dotenv_values
import influxdb_client
from influxdb_client.client.write_api import SYNCHRONOUS
from operator import itemgetter
from flask_wtf.csrf import CsrfProtect
csrf = CsrfProtect()
WTF_CSRF_SECRET_KEY = 'a random string'
config = dotenv_values(".env")
app = Flask(__name__)
app.secret_key = 'The key to life'
csrf.init_app(app)
from influxdb import InfluxDBClient
def db_main(host='localhost', port=8086):
user = 'root'
password = 'root'
dbname = 'gas'
class influx_form(FlaskForm):
name = StringField('name', validators=[DataRequired()])
client = influxdb_client.InfluxDBClient(
url=config['DB_URL'],
token=config['DB_TOKEN'],
org=config['DB_ORG']
)
@app.route('/success')
def success():
return "Form success!"
@app.route('/', methods=('GET', 'POST'))
def fetch_timeseries_data(timestamp=None):
query_api = client.query_api()
if timestamp is not None:
newTime = pendulum.parse(timestamp)
print(newTime.to_atom_string())
# "2023-11-14T08:21:00.000Z"
query = 'from(bucket: "gas")\
|> range(start: time(v: "' + str(newTime.subtract(seconds=1).to_atom_string()) + '"), stop: time(v: "' + str(newTime.add(seconds=1).to_atom_string()) + '"))\
|> filter(fn: (r) => r["_measurement"] == "2016_odyssey")\
|> filter(fn: (r) => r["_field"] == "odometer")\
|> sort(columns: ["_value"], desc: false)\
|> yield(name: "last")\
|> limit(n:10)'
print("searching for fixed time")
else:
query = 'from(bucket: "gas")\
|> range(start: -90d)\
|> filter(fn: (r) => r["_measurement"] == "2016_odyssey")\
|> filter(fn: (r) => r["_field"] == "odometer")\
|> sort(columns: ["_value"], desc: false)\
|> yield(name: "last")\
|> limit(n:10)'
result = query_api.query(org=config['DB_ORG'], query=query)
results = []
for table in result:
for record in table.records:
temp = {}
temp[record.get_field()] = record.get_value()
temp['time'] = record.get_time()
try:
temp['oilhealth'] = record['oilhealth']
except KeyError:
pass
try:
temp['fuel'] = record['fuel']
temp['fuelcost'] = record['fuelcost']
except KeyError:
pass
try:
temp['winter'] = record['winter']
except KeyError:
pass
results.append(temp)
# .append((record.get_time(), record.get_field(), record.get_value()))
newlist = sorted(results, key=itemgetter('time'), reverse=True)
oldlist = newlist # temporary to strip the non-unique data
newlist = []
for value in oldlist:
if value in newlist:
continue
else:
newlist.append(value)
print(newlist)
print()
return newlist
@app.route('/', methods=['GET', 'POST'])
def main_page():
form = influx_form()
if form.validate_on_submit():
return redirect('/success')
return render_template('index.html', form=form)
app.run(debug=True)
# Call fetch function
newlist = fetch_timeseries_data()
# print(newlist)
return render_template('index.html', data=newlist[:10])
@app.route('/add_time', methods=['POST', 'GET'])
def add_time():
today = strftime("%Y-%m-%d")
now = strftime("%H:%M:%S")
# database = request.form['db']
# table = request.form['table']
date = request.form['date']
if date == '':
date = today
time = request.form['time']
if time == '':
time = now
odometer = request.form['odometer']
oilhealth = request.form['oilhealth']
if oilhealth != '':
oilhealth = float(oilhealth)
fuel = request.form['fuel']
if fuel != '':
fuel = float(fuel)
fuelcost = request.form['fuelcost']
if fuelcost != '':
fuelcost = float(fuelcost)
winter = request.form['winter']
if winter == 'TRUE':
winter = 1
else:
winter = 0
json_body = [
{
"time": date + "T" + time + "Z",
"measurement": "odyssey",
"fields": {
"odometer": float(odometer),
"oilhealth": oilhealth,
"fuel": fuel,
"fuelcost": fuelcost,
"winter": winter
}
}
]
timestamp = date + "T" + time + "Z"
dt = pendulum.parse(timestamp)
print()
print(dt)
print()
write_api = client.write_api(write_options=SYNCHRONOUS)
point = influxdb_client.Point("2016_odyssey").time(timestamp).tag("oilhealth", oilhealth)\
.tag("fuel", fuel).tag("fuelcost", fuelcost).tag("winter", winter).field("odometer", float(odometer))
write_api.write(bucket="gas", org=config['DB_ORG'], record=point)
print("Submitting data to DB: {0}".format(json_body))
# client.write_points(json_body)
return redirect(url_for('main_page'))
@app.route('/edit/<timestamp>')
def edit_odometer_entry(timestamp):
'''Retrieve the time entry from influxdb'''
print('Fetching data!')
# Call fetch function
newlist = fetch_timeseries_data()
# Fill entry_data with timestamp based data
entry_data = fetch_timeseries_data(timestamp)
return render_template('index.html', page_title="Edit Entry", timestamp_data=entry_data, data=newlist[:10])
@app.route('/repeat_last_odometer/<odometer>/<winter>')
def repeat_last_odometer(odometer, winter=False):
'''Retrieve the passed in odometer value and submit as a new entry'''
date = strftime("%Y-%m-%d")
time = strftime("%H:%M:%S")
timestamp = date + "T" + time + "Z"
print("Putting %s to database for %s" % (odometer, timestamp))
write_api = client.write_api(write_options=SYNCHRONOUS)
point = influxdb_client.Point("2016_odyssey").time(
timestamp).tag("winter", winter).field("odometer", float(odometer))
write_api.write(bucket="gas", org=config['DB_ORG'], record=point)
return redirect(url_for('main_page'))
@app.route('/admin')
def admin_index():
return 'admin'
@app.route('/login')
def login():
pass
@app.route('/logout')
def logout():
pass
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0', port='9001')

View File

@ -1,14 +1,23 @@
click==6.6
Flask==0.11.1
Flask-WTF==0.13.1
influxdb==4.0.0
itsdangerous==0.24
Jinja2==2.8
MarkupSafe==0.23
pkg-resources==0.0.0
python-dateutil==2.6.0
autopep8==1.7.0
certifi==2022.6.15
click==8.1.3
Flask==2.2.2
importlib-metadata==5.0.0
influxdb-client==1.30.0
itsdangerous==2.1.2
Jinja2==3.1.2
MarkupSafe==2.1.1
pendulum==2.1.2
pycodestyle==2.9.1
python-dateutil==2.8.2
python-dotenv==0.21.0
pytz==2016.10
pytzdata==2020.1
requests==2.12.4
Rx==3.2.0
six==1.10.0
Werkzeug==0.11.11
toml==0.10.2
urllib3==1.26.9
Werkzeug==2.2.2
WTForms==2.1
zipp==3.10.0

View File

@ -0,0 +1,19 @@
{
"name": "angular-animate",
"version": "1.4.4",
"main": "./angular-animate.js",
"ignore": [],
"dependencies": {
"angular": "1.4.4"
},
"homepage": "https://github.com/angular/bower-angular-animate",
"_release": "1.4.4",
"_resolution": {
"type": "version",
"tag": "v1.4.4",
"commit": "0a261311373ca83245a2cd76a459ccd06c9a8cea"
},
"_source": "git://github.com/angular/bower-angular-animate.git",
"_target": "^1.3.0 || >1.4.0-beta.0",
"_originalSource": "angular-animate"
}

View File

@ -0,0 +1,68 @@
# packaged angular-animate
This repo is for distribution on `npm` and `bower`. The source for this module is in the
[main AngularJS repo](https://github.com/angular/angular.js/tree/master/src/ngAnimate).
Please file issues and pull requests against that repo.
## Install
You can install this package either with `npm` or with `bower`.
### npm
```shell
npm install angular-animate
```
Then add `ngAnimate` as a dependency for your app:
```javascript
angular.module('myApp', [require('angular-animate')]);
```
### bower
```shell
bower install angular-animate
```
Then add a `<script>` to your `index.html`:
```html
<script src="/bower_components/angular-animate/angular-animate.js"></script>
```
Then add `ngAnimate` as a dependency for your app:
```javascript
angular.module('myApp', ['ngAnimate']);
```
## Documentation
Documentation is available on the
[AngularJS docs site](http://docs.angularjs.org/api/ngAnimate).
## License
The MIT License
Copyright (c) 2010-2015 Google, Inc. http://angularjs.org
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.

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,54 @@
/*
AngularJS v1.4.4
(c) 2010-2015 Google, Inc. http://angularjs.org
License: MIT
*/
(function(E,s,X){'use strict';function sa(a,b,c){if(!a)throw ngMinErr("areq",b||"?",c||"required");return a}function ta(a,b){if(!a&&!b)return"";if(!a)return b;if(!b)return a;Y(a)&&(a=a.join(" "));Y(b)&&(b=b.join(" "));return a+" "+b}function Da(a){var b={};a&&(a.to||a.from)&&(b.to=a.to,b.from=a.from);return b}function U(a,b,c){var d="";a=Y(a)?a:a&&O(a)&&a.length?a.split(/\s+/):[];l(a,function(a,w){a&&0<a.length&&(d+=0<w?" ":"",d+=c?b+a:a+b)});return d}function Ea(a){if(a instanceof J)switch(a.length){case 0:return[];
case 1:if(1===a[0].nodeType)return a;break;default:return J(ia(a))}if(1===a.nodeType)return J(a)}function ia(a){if(!a[0])return a;for(var b=0;b<a.length;b++){var c=a[b];if(1==c.nodeType)return c}}function Fa(a,b,c){l(b,function(b){a.addClass(b,c)})}function Ga(a,b,c){l(b,function(b){a.removeClass(b,c)})}function R(a){return function(b,c){c.addClass&&(Fa(a,b,c.addClass),c.addClass=null);c.removeClass&&(Ga(a,b,c.removeClass),c.removeClass=null)}}function ha(a){a=a||{};if(!a.$$prepared){var b=a.domOperation||
G;a.domOperation=function(){a.$$domOperationFired=!0;b();b=G};a.$$prepared=!0}return a}function da(a,b){ua(a,b);va(a,b)}function ua(a,b){b.from&&(a.css(b.from),b.from=null)}function va(a,b){b.to&&(a.css(b.to),b.to=null)}function S(a,b,c){var d=(b.addClass||"")+" "+(c.addClass||""),e=(b.removeClass||"")+" "+(c.removeClass||"");a=Ha(a.attr("class"),d,e);c.preparationClasses&&(b.preparationClasses=V(c.preparationClasses,b.preparationClasses),delete c.preparationClasses);d=b.domOperation!==G?b.domOperation:
null;wa(b,c);d&&(b.domOperation=d);b.addClass=a.addClass?a.addClass:null;b.removeClass=a.removeClass?a.removeClass:null;return b}function Ha(a,b,c){function d(a){O(a)&&(a=a.split(" "));var b={};l(a,function(a){a.length&&(b[a]=!0)});return b}var e={};a=d(a);b=d(b);l(b,function(a,b){e[b]=1});c=d(c);l(c,function(a,b){e[b]=1===e[b]?null:-1});var w={addClass:"",removeClass:""};l(e,function(b,c){var d,e;1===b?(d="addClass",e=!a[c]):-1===b&&(d="removeClass",e=a[c]);e&&(w[d].length&&(w[d]+=" "),w[d]+=c)});
return w}function D(a){return a instanceof s.element?a[0]:a}function xa(a,b,c){var d="";b&&(d=U(b,"ng-",!0));c.addClass&&(d=V(d,U(c.addClass,"-add")));c.removeClass&&(d=V(d,U(c.removeClass,"-remove")));d.length&&(c.preparationClasses=d,a.addClass(d))}function $(a,b){var c=b?"-"+b+"s":"";ea(a,[fa,c]);return[fa,c]}function ja(a,b){var c=b?"paused":"",d=W+"PlayState";ea(a,[d,c]);return[d,c]}function ea(a,b){a.style[b[0]]=b[1]}function V(a,b){return a?b?a+" "+b:a:b}function ya(a,b,c){var d=Object.create(null),
e=a.getComputedStyle(b)||{};l(c,function(a,b){var c=e[a];if(c){var F=c.charAt(0);if("-"===F||"+"===F||0<=F)c=Ia(c);0===c&&(c=null);d[b]=c}});return d}function Ia(a){var b=0;a=a.split(/\s*,\s*/);l(a,function(a){"s"==a.charAt(a.length-1)&&(a=a.substring(0,a.length-1));a=parseFloat(a)||0;b=b?Math.max(a,b):a});return b}function ka(a){return 0===a||null!=a}function za(a,b){var c=K,d=a+"s";b?c+="Duration":d+=" linear all";return[c,d]}function Aa(){var a=Object.create(null);return{flush:function(){a=Object.create(null)},
count:function(b){return(b=a[b])?b.total:0},get:function(b){return(b=a[b])&&b.value},put:function(b,c){a[b]?a[b].total++:a[b]={total:1,value:c}}}}var G=s.noop,wa=s.extend,J=s.element,l=s.forEach,Y=s.isArray,O=s.isString,la=s.isObject,Ja=s.isUndefined,Ka=s.isDefined,Ba=s.isFunction,ma=s.isElement,K,na,W,oa;E.ontransitionend===X&&E.onwebkittransitionend!==X?(K="WebkitTransition",na="webkitTransitionEnd transitionend"):(K="transition",na="transitionend");E.onanimationend===X&&E.onwebkitanimationend!==
X?(W="WebkitAnimation",oa="webkitAnimationEnd animationend"):(W="animation",oa="animationend");var pa=W+"Delay",qa=W+"Duration",fa=K+"Delay";E=K+"Duration";var La={transitionDuration:E,transitionDelay:fa,transitionProperty:K+"Property",animationDuration:qa,animationDelay:pa,animationIterationCount:W+"IterationCount"},Ma={transitionDuration:E,transitionDelay:fa,animationDuration:qa,animationDelay:pa};s.module("ngAnimate",[]).provider("$$body",function(){this.$get=["$document",function(a){return J(a[0].body)}]}).directive("ngAnimateChildren",
[function(){return function(a,b,c){a=c.ngAnimateChildren;s.isString(a)&&0===a.length?b.data("$$ngAnimateChildren",!0):c.$observe("ngAnimateChildren",function(a){b.data("$$ngAnimateChildren","on"===a||"true"===a)})}}]).factory("$$rAFMutex",["$$rAF",function(a){return function(){var b=!1;a(function(){b=!0});return function(c){b?c():a(c)}}}]).factory("$$AnimateRunner",["$q","$$rAFMutex",function(a,b){function c(a){this.setHost(a);this._doneCallbacks=[];this._runInAnimationFrame=b();this._state=0}c.chain=
function(a,b){function c(){if(H===a.length)b(!0);else a[H](function(a){!1===a?b(!1):(H++,c())})}var H=0;c()};c.all=function(a,b){function c(w){u=u&&w;++H===a.length&&b(u)}var H=0,u=!0;l(a,function(a){a.done(c)})};c.prototype={setHost:function(a){this.host=a||{}},done:function(a){2===this._state?a():this._doneCallbacks.push(a)},progress:G,getPromise:function(){if(!this.promise){var b=this;this.promise=a(function(a,c){b.done(function(b){!1===b?c():a()})})}return this.promise},then:function(a,b){return this.getPromise().then(a,
b)},"catch":function(a){return this.getPromise()["catch"](a)},"finally":function(a){return this.getPromise()["finally"](a)},pause:function(){this.host.pause&&this.host.pause()},resume:function(){this.host.resume&&this.host.resume()},end:function(){this.host.end&&this.host.end();this._resolve(!0)},cancel:function(){this.host.cancel&&this.host.cancel();this._resolve(!1)},complete:function(a){var b=this;0===b._state&&(b._state=1,b._runInAnimationFrame(function(){b._resolve(a)}))},_resolve:function(a){2!==
this._state&&(l(this._doneCallbacks,function(b){b(a)}),this._doneCallbacks.length=0,this._state=2)}};return c}]).provider("$$animateQueue",["$animateProvider",function(a){function b(a,b,c,l){return d[a].some(function(a){return a(b,c,l)})}function c(a,b){a=a||{};var c=0<(a.addClass||"").length,d=0<(a.removeClass||"").length;return b?c&&d:c||d}var d=this.rules={skip:[],cancel:[],join:[]};d.join.push(function(a,b,d){return!b.structural&&c(b.options)});d.skip.push(function(a,b,d){return!b.structural&&
!c(b.options)});d.skip.push(function(a,b,c){return"leave"==c.event&&b.structural});d.skip.push(function(a,b,c){return c.structural&&2===c.state&&!b.structural});d.cancel.push(function(a,b,c){return c.structural&&b.structural});d.cancel.push(function(a,b,c){return 2===c.state&&b.structural});d.cancel.push(function(a,b,c){a=b.options;c=c.options;return a.addClass&&a.addClass===c.removeClass||a.removeClass&&a.removeClass===c.addClass});this.$get=["$$rAF","$rootScope","$rootElement","$document","$$body",
"$$HashMap","$$animation","$$AnimateRunner","$templateRequest","$$jqLite","$$forceReflow",function(d,w,H,u,F,B,N,z,Na,t,Oa){function s(a,b){var c=D(a),f=[],h=r[b];h&&l(h,function(a){a.node.contains(c)&&f.push(a.callback)});return f}function I(a,b,c,f){d(function(){l(s(b,a),function(a){a(b,c,f)})})}function n(a,h,m){function d(b,c,f,h){I(c,a,f,h);b.progress(c,f,h)}function r(b){var c=a,f=m;f.preparationClasses&&(c.removeClass(f.preparationClasses),f.preparationClasses=null);f.activeClasses&&(c.removeClass(f.activeClasses),
f.activeClasses=null);Ca(a,m);da(a,m);m.domOperation();q.complete(!b)}var g,n;if(a=Ea(a))g=D(a),n=a.parent();m=ha(m);var q=new z;Y(m.addClass)&&(m.addClass=m.addClass.join(" "));m.addClass&&!O(m.addClass)&&(m.addClass=null);Y(m.removeClass)&&(m.removeClass=m.removeClass.join(" "));m.removeClass&&!O(m.removeClass)&&(m.removeClass=null);m.from&&!la(m.from)&&(m.from=null);m.to&&!la(m.to)&&(m.to=null);if(!g)return r(),q;var e=[g.className,m.addClass,m.removeClass].join(" ");if(!A(e))return r(),q;var l=
0<=["enter","move","leave"].indexOf(h),F=!M||x.get(g),e=!F&&v.get(g)||{},t=!!e.state;F||t&&1==e.state||(F=!ca(a,n,h));if(F)return r(),q;l&&y(a);n={structural:l,element:a,event:h,close:r,options:m,runner:q};if(t){if(b("skip",a,n,e)){if(2===e.state)return r(),q;S(a,e.options,m);return e.runner}if(b("cancel",a,n,e))if(2===e.state)e.runner.end();else if(e.structural)e.close();else return S(a,e.options,n.options),e.runner;else if(b("join",a,n,e))if(2===e.state)S(a,m,{});else return xa(a,l?h:null,m),h=
n.event=e.event,m=S(a,e.options,n.options),e.runner}else S(a,m,{});(t=n.structural)||(t="animate"===n.event&&0<Object.keys(n.options.to||{}).length||c(n.options));if(!t)return r(),f(a),q;xa(a,l?h:null,m);$(g,9999);var B=(e.counter||0)+1;n.counter=B;k(a,1,n);w.$$postDigest(function(){var b=v.get(g),y=!b,b=b||{},A=0<(a.parent()||[]).length&&("animate"===b.event||b.structural||c(b.options));if(y||b.counter!==B||!A){y&&(Ca(a,m),da(a,m));if(y||l&&b.event!==h)m.domOperation(),q.end();A||f(a)}else h=!b.structural&&
c(b.options,!0)?"setClass":b.event,k(a,2),b=N(a,h,b.options,function(a){Oa();$(D(a),!1)}),b.done(function(b){r(!b);(b=v.get(g))&&b.counter===B&&f(D(a));d(q,h,"close",{})}),q.setHost(b),d(q,h,"start",{})});return q}function y(a){a=D(a).querySelectorAll("[data-ng-animate]");l(a,function(a){var b=parseInt(a.getAttribute("data-ng-animate")),c=v.get(a);switch(b){case 2:c.runner.end();case 1:c&&v.remove(a)}})}function f(a){a=D(a);a.removeAttribute("data-ng-animate");v.remove(a)}function g(a,b){return D(a)===
D(b)}function ca(a,b,c){c=g(a,F)||"HTML"===a[0].nodeName;var f=g(a,H),h=!1,r;for((a=a.data("$ngAnimatePin"))&&(b=a);b&&b.length;){f||(f=g(b,H));a=b[0];if(1!==a.nodeType)break;var d=v.get(a)||{};h||(h=d.structural||x.get(a));if(Ja(r)||!0===r)a=b.data("$$ngAnimateChildren"),Ka(a)&&(r=a);if(h&&!1===r)break;f||(f=g(b,H),f||(a=b.data("$ngAnimatePin"))&&(b=a));c||(c=g(b,F));b=b.parent()}return(!h||r)&&f&&c}function k(a,b,c){c=c||{};c.state=b;a=D(a);a.setAttribute("data-ng-animate",b);c=(b=v.get(a))?wa(b,
c):c;v.put(a,c)}var v=new B,x=new B,M=null,h=w.$watch(function(){return 0===Na.totalPendingRequests},function(a){a&&(h(),w.$$postDigest(function(){w.$$postDigest(function(){null===M&&(M=!0)})}))}),r={},q=a.classNameFilter(),A=q?function(a){return q.test(a)}:function(){return!0},Ca=R(t);return{on:function(a,b,c){b=ia(b);r[a]=r[a]||[];r[a].push({node:b,callback:c})},off:function(a,b,c){function f(a,b,c){var h=ia(b);return a.filter(function(a){return!(a.node===h&&(!c||a.callback===c))})}var h=r[a];h&&
(r[a]=1===arguments.length?null:f(h,b,c))},pin:function(a,b){sa(ma(a),"element","not an element");sa(ma(b),"parentElement","not an element");a.data("$ngAnimatePin",b)},push:function(a,b,c,f){c=c||{};c.domOperation=f;return n(a,b,c)},enabled:function(a,b){var c=arguments.length;if(0===c)b=!!M;else if(ma(a)){var f=D(a),h=x.get(f);1===c?b=!h:(b=!!b)?h&&x.remove(f):x.put(f,!0)}else b=M=!!a;return b}}}]}]).provider("$$animation",["$animateProvider",function(a){function b(a){return a.data("$$animationRunner")}
var c=this.drivers=[];this.$get=["$$jqLite","$rootScope","$injector","$$AnimateRunner","$$HashMap",function(a,e,w,H,u){function F(a){function b(a){if(a.processed)return a;a.processed=!0;var d=a.domNode,f=d.parentNode;e.put(d,a);for(var g;f;){if(g=e.get(f)){g.processed||(g=b(g));break}f=f.parentNode}(g||c).children.push(a);return a}var c={children:[]},d,e=new u;for(d=0;d<a.length;d++){var I=a[d];e.put(I.domNode,a[d]={domNode:I.domNode,fn:I.fn,children:[]})}for(d=0;d<a.length;d++)b(a[d]);return function(a){var b=
[],c=[],d;for(d=0;d<a.children.length;d++)c.push(a.children[d]);a=c.length;var e=0,k=[];for(d=0;d<c.length;d++){var v=c[d];0>=a&&(a=e,e=0,b=b.concat(k),k=[]);k.push(v.fn);l(v.children,function(a){e++;c.push(a)});a--}k.length&&(b=b.concat(k));return b}(c)}var B=[],N=R(a);return function(z,u,t,s){function G(a){a=a.hasAttribute("ng-animate-ref")?[a]:a.querySelectorAll("[ng-animate-ref]");var b=[];l(a,function(a){var c=a.getAttribute("ng-animate-ref");c&&c.length&&b.push(a)});return b}function I(a){var b=
[],c={};l(a,function(a,f){var h=D(a.element),d=0<=["enter","move"].indexOf(a.event),h=a.structural?G(h):[];if(h.length){var e=d?"to":"from";l(h,function(a){var b=a.getAttribute("ng-animate-ref");c[b]=c[b]||{};c[b][e]={animationID:f,element:J(a)}})}else b.push(a)});var f={},d={};l(c,function(c,e){var k=c.from,y=c.to;if(k&&y){var g=a[k.animationID],v=a[y.animationID],q=k.animationID.toString();if(!d[q]){var x=d[q]={beforeStart:function(){g.beforeStart();v.beforeStart()},close:function(){g.close();v.close()},
classes:n(g.classes,v.classes),from:g,to:v,anchors:[]};x.classes.length?b.push(x):(b.push(g),b.push(v))}d[q].anchors.push({out:k.element,"in":y.element})}else k=k?k.animationID:y.animationID,y=k.toString(),f[y]||(f[y]=!0,b.push(a[k]))});return b}function n(a,b){a=a.split(" ");b=b.split(" ");for(var c=[],f=0;f<a.length;f++){var d=a[f];if("ng-"!==d.substring(0,3))for(var k=0;k<b.length;k++)if(d===b[k]){c.push(d);break}}return c.join(" ")}function y(a,b){for(var f=c.length-1;0<=f;f--){var d=c[f];if(w.has(d)&&
(d=w.get(d)(a,b)))return d}}function f(a,c){a.from&&a.to?(b(a.from.element).setHost(c),b(a.to.element).setHost(c)):b(a.element).setHost(c)}function g(){var a=b(z);!a||"leave"===u&&t.$$domOperationFired||a.end()}function ca(b){z.off("$destroy",g);z.removeData("$$animationRunner");N(z,t);da(z,t);t.domOperation();M&&a.removeClass(z,M);z.removeClass("ng-animate");v.complete(!b)}t=ha(t);var k=0<=["enter","move","leave"].indexOf(u),v=new H({end:function(){ca()},cancel:function(){ca(!0)}});if(!c.length)return ca(),
v;z.data("$$animationRunner",v);var x=ta(z.attr("class"),ta(t.addClass,t.removeClass)),M=t.tempClasses;M&&(x+=" "+M,t.tempClasses=null);B.push({element:z,classes:x,event:u,structural:k,options:t,beforeStart:function(){z.addClass("ng-animate");M&&a.addClass(z,M)},close:ca});z.on("$destroy",g);if(1<B.length)return v;e.$$postDigest(function(){var a=[];l(B,function(c){var f=c.element;b(f)&&D(f).parentNode?a.push(c):c.close()});B.length=0;var c=I(a),d=[];l(c,function(a){d.push({domNode:D(a.from?a.from.element:
a.element),fn:function(){a.beforeStart();var c,d=a.close;if(b(a.anchors?a.from.element||a.to.element:a.element)){var h=y(a,s);h&&(c=h.start)}c?(c=c(),c.done(function(a){d(!a)}),f(a,c)):d()}})});l(F(d),function(a){a()})});return v}}]}]).provider("$animateCss",["$animateProvider",function(a){var b=Aa(),c=Aa();this.$get=["$window","$$jqLite","$$AnimateRunner","$timeout","$$forceReflow","$sniffer","$$rAF",function(a,e,w,H,u,F,B){function N(a,b){var c=a.parentNode;return(c.$$ngAnimateParentKey||(c.$$ngAnimateParentKey=
++E))+"-"+a.getAttribute("class")+"-"+b}function z(y,f,g,n){var k;0<b.count(g)&&(k=c.get(g),k||(f=U(f,"-stagger"),e.addClass(y,f),k=ya(a,y,n),k.animationDuration=Math.max(k.animationDuration,0),k.transitionDuration=Math.max(k.transitionDuration,0),e.removeClass(y,f),c.put(g,k)));return k||{}}function s(a){I&&I();n.push(a);I=B(function(){I=null;b.flush();c.flush();for(var a=u(),d=0;d<n.length;d++)n[d](a);n.length=0})}function t(c,f,e){f=b.get(e);f||(f=ya(a,c,La),"infinite"===f.animationIterationCount&&
(f.animationIterationCount=1));b.put(e,f);c=f;e=c.animationDelay;f=c.transitionDelay;c.maxDelay=e&&f?Math.max(e,f):e||f;c.maxDuration=Math.max(c.animationDuration*c.animationIterationCount,c.transitionDuration);return c}var G=R(e),E=0,I,n=[];return function(a,c){function d(){k()}function n(){k(!0)}function k(b){if(!(B||ra&&u)){B=!0;u=!1;c.$$skipPreparationClasses||e.removeClass(a,Z);e.removeClass(a,X);ja(h,!1);$(h,!1);l(r,function(a){h.style[a[0]]=""});G(a,c);da(a,c);if(c.onDone)c.onDone();m&&m.complete(!b)}}
function v(a){p.blockTransition&&$(h,a);p.blockKeyframeAnimation&&ja(h,!!a)}function x(){m=new w({end:d,cancel:n});k();return{$$willAnimate:!1,start:function(){return m},end:d}}function I(){function b(){if(!B){v(!1);l(r,function(a){h.style[a[0]]=a[1]});G(a,c);e.addClass(a,X);if(p.recalculateTimingStyles){ga=h.className+" "+Z;aa=N(h,ga);C=t(h,ga,aa);Q=C.maxDelay;J=Math.max(Q,0);L=C.maxDuration;if(0===L){k();return}p.hasTransitions=0<C.transitionDuration;p.hasAnimations=0<C.animationDuration}if(p.applyTransitionDelay||
p.applyAnimationDelay){Q="boolean"!==typeof c.delay&&ka(c.delay)?parseFloat(c.delay):Q;J=Math.max(Q,0);var g;p.applyTransitionDelay&&(C.transitionDelay=Q,g=[fa,Q+"s"],r.push(g),h.style[g[0]]=g[1]);p.applyAnimationDelay&&(C.animationDelay=Q,g=[pa,Q+"s"],r.push(g),h.style[g[0]]=g[1])}O=1E3*J;R=1E3*L;if(c.easing){var q=c.easing;p.hasTransitions&&(g=K+"TimingFunction",r.push([g,q]),h.style[g]=q);p.hasAnimations&&(g=W+"TimingFunction",r.push([g,q]),h.style[g]=q)}C.transitionDuration&&x.push(na);C.animationDuration&&
x.push(oa);n=Date.now();a.on(x.join(" "),m);H(d,O+1.5*R,!1);va(a,c)}}function d(){k()}function m(a){a.stopPropagation();var b=a.originalEvent||a;a=b.$manualTimeStamp||b.timeStamp||Date.now();b=parseFloat(b.elapsedTime.toFixed(3));Math.max(a-n,0)>=O&&b>=L&&(ra=!0,k())}if(!B)if(h.parentNode){var n,x=[],g=function(a){if(ra)u&&a&&(u=!1,k());else if(u=!a,C.animationDuration)if(a=ja(h,u),u)r.push(a);else{var b=r,c=b.indexOf(a);0<=a&&b.splice(c,1)}},q=0<V&&(C.transitionDuration&&0===T.transitionDuration||
C.animationDuration&&0===T.animationDuration)&&Math.max(T.animationDelay,T.transitionDelay);q?H(b,Math.floor(q*V*1E3),!1):b();E.resume=function(){g(!0)};E.pause=function(){g(!1)}}else k()}var h=D(a);if(!h||!h.parentNode)return x();c=ha(c);var r=[],q=a.attr("class"),A=Da(c),B,u,ra,m,E,J,O,L,R;if(0===c.duration||!F.animations&&!F.transitions)return x();var ba=c.event&&Y(c.event)?c.event.join(" "):c.event,S="",P="";ba&&c.structural?S=U(ba,"ng-",!0):ba&&(S=ba);c.addClass&&(P+=U(c.addClass,"-add"));c.removeClass&&
(P.length&&(P+=" "),P+=U(c.removeClass,"-remove"));c.applyClassesEarly&&P.length&&(G(a,c),P="");var Z=[S,P].join(" ").trim(),ga=q+" "+Z,X=U(Z,"-active"),q=A.to&&0<Object.keys(A.to).length;if(!(0<(c.keyframeStyle||"").length||q||Z))return x();var aa,T;0<c.stagger?(A=parseFloat(c.stagger),T={transitionDelay:A,animationDelay:A,transitionDuration:0,animationDuration:0}):(aa=N(h,ga),T=z(h,Z,aa,Ma));c.$$skipPreparationClasses||e.addClass(a,Z);c.transitionStyle&&(A=[K,c.transitionStyle],ea(h,A),r.push(A));
0<=c.duration&&(A=0<h.style[K].length,A=za(c.duration,A),ea(h,A),r.push(A));c.keyframeStyle&&(A=[W,c.keyframeStyle],ea(h,A),r.push(A));var V=T?0<=c.staggerIndex?c.staggerIndex:b.count(aa):0;(ba=0===V)&&!c.skipBlocking&&$(h,9999);var C=t(h,ga,aa),Q=C.maxDelay;J=Math.max(Q,0);L=C.maxDuration;var p={};p.hasTransitions=0<C.transitionDuration;p.hasAnimations=0<C.animationDuration;p.hasTransitionAll=p.hasTransitions&&"all"==C.transitionProperty;p.applyTransitionDuration=q&&(p.hasTransitions&&!p.hasTransitionAll||
p.hasAnimations&&!p.hasTransitions);p.applyAnimationDuration=c.duration&&p.hasAnimations;p.applyTransitionDelay=ka(c.delay)&&(p.applyTransitionDuration||p.hasTransitions);p.applyAnimationDelay=ka(c.delay)&&p.hasAnimations;p.recalculateTimingStyles=0<P.length;if(p.applyTransitionDuration||p.applyAnimationDuration)L=c.duration?parseFloat(c.duration):L,p.applyTransitionDuration&&(p.hasTransitions=!0,C.transitionDuration=L,A=0<h.style[K+"Property"].length,r.push(za(L,A))),p.applyAnimationDuration&&(p.hasAnimations=
!0,C.animationDuration=L,r.push([qa,L+"s"]));if(0===L&&!p.recalculateTimingStyles)return x();null==c.duration&&0<C.transitionDuration&&(p.recalculateTimingStyles=p.recalculateTimingStyles||ba);O=1E3*J;R=1E3*L;c.skipBlocking||(p.blockTransition=0<C.transitionDuration,p.blockKeyframeAnimation=0<C.animationDuration&&0<T.animationDelay&&0===T.animationDuration);ua(a,c);p.blockTransition||p.blockKeyframeAnimation?v(L):c.skipBlocking||$(h,!1);return{$$willAnimate:!0,end:d,start:function(){if(!B)return E=
{end:d,cancel:n,resume:null,pause:null},m=new w(E),s(I),m}}}}]}]).provider("$$animateCssDriver",["$$animationProvider",function(a){a.drivers.push("$$animateCssDriver");this.$get=["$animateCss","$rootScope","$$AnimateRunner","$rootElement","$$body","$sniffer","$$jqLite",function(a,c,d,e,w,H,u){function F(a){return a.replace(/\bng-\S+\b/g,"")}function B(a,b){O(a)&&(a=a.split(" "));O(b)&&(b=b.split(" "));return a.filter(function(a){return-1===b.indexOf(a)}).join(" ")}function N(c,e,u){function f(a){var b=
{},c=D(a).getBoundingClientRect();l(["width","height","top","left"],function(a){var d=c[a];switch(a){case "top":d+=t.scrollTop;break;case "left":d+=t.scrollLeft}b[a]=Math.floor(d)+"px"});return b}function g(){var c=F(u.attr("class")||""),d=B(c,v),c=B(v,c),d=a(k,{to:f(u),addClass:"ng-anchor-in "+d,removeClass:"ng-anchor-out "+c,delay:!0});return d.$$willAnimate?d:null}function N(){k.remove();e.removeClass("ng-animate-shim");u.removeClass("ng-animate-shim")}var k=J(D(e).cloneNode(!0)),v=F(k.attr("class")||
"");e.addClass("ng-animate-shim");u.addClass("ng-animate-shim");k.addClass("ng-anchor");E.append(k);var x;c=function(){var c=a(k,{addClass:"ng-anchor-out",delay:!0,from:f(e)});return c.$$willAnimate?c:null}();if(!c&&(x=g(),!x))return N();var M=c||x;return{start:function(){function a(){c&&c.end()}var b,c=M.start();c.done(function(){c=null;if(!x&&(x=g()))return c=x.start(),c.done(function(){c=null;N();b.complete()}),c;N();b.complete()});return b=new d({end:a,cancel:a})}}}function z(a,b,c,f){var e=s(a,
G),u=s(b,G),k=[];l(f,function(a){(a=N(c,a.out,a["in"]))&&k.push(a)});if(e||u||0!==k.length)return{start:function(){function a(){l(b,function(a){a.end()})}var b=[];e&&b.push(e.start());u&&b.push(u.start());l(k,function(a){b.push(a.start())});var c=new d({end:a,cancel:a});d.all(b,function(a){c.complete(a)});return c}}}function s(c,d){var e=c.element,f=c.options||{};f.$$skipPreparationClasses=!0;f.skipBlocking=!0;c.structural&&(f.event=c.event,"leave"===c.event&&(f.onDone=f.domOperation));d(e);K(e,f);
f.preparationClasses&&(f.event=V(f.event,f.preparationClasses));e=a(e,f);return e.$$willAnimate?e:null}if(!H.animations&&!H.transitions)return G;var t=D(w);c=D(e);var E=J(t.parentNode===c?t:c),K=R(u);return function(a,b){return a.from&&a.to?z(a.from,a.to,a.classes,a.anchors):s(a,b)}}]}]).provider("$$animateJs",["$animateProvider",function(a){this.$get=["$injector","$$AnimateRunner","$$rAFMutex","$$jqLite",function(b,c,d,e){function w(c){c=Y(c)?c:c.split(" ");for(var d=[],e={},l=0;l<c.length;l++){var w=
c[l],s=a.$$registeredAnimations[w];s&&!e[w]&&(d.push(b.get(s)),e[w]=!0)}return d}var s=R(e);return function(a,b,d,e){function z(){e.domOperation();s(a,e)}function D(a,b,d,e,f){switch(d){case "animate":b=[b,e.from,e.to,f];break;case "setClass":b=[b,J,I,f];break;case "addClass":b=[b,J,f];break;case "removeClass":b=[b,I,f];break;default:b=[b,f]}b.push(e);if(a=a.apply(a,b))if(Ba(a.start)&&(a=a.start()),a instanceof c)a.done(f);else if(Ba(a))return a;return G}function t(a,b,d,e,f){var g=[];l(e,function(e){var l=
e[f];l&&g.push(function(){var e,f,h=!1,g=function(a){h||(h=!0,(f||G)(a),e.complete(!a))};e=new c({end:function(){g()},cancel:function(){g(!0)}});f=D(l,a,b,d,function(a){g(!1===a)});return e})});return g}function E(a,b,d,e,f){var g=t(a,b,d,e,f);if(0===g.length){var q,n;"beforeSetClass"===f?(q=t(a,"removeClass",d,e,"beforeRemoveClass"),n=t(a,"addClass",d,e,"beforeAddClass")):"setClass"===f&&(q=t(a,"removeClass",d,e,"removeClass"),n=t(a,"addClass",d,e,"addClass"));q&&(g=g.concat(q));n&&(g=g.concat(n))}if(0!==
g.length)return function(a){var b=[];g.length&&l(g,function(a){b.push(a())});b.length?c.all(b,a):a();return function(a){l(b,function(b){a?b.cancel():b.end()})}}}3===arguments.length&&la(d)&&(e=d,d=null);e=ha(e);d||(d=a.attr("class")||"",e.addClass&&(d+=" "+e.addClass),e.removeClass&&(d+=" "+e.removeClass));var J=e.addClass,I=e.removeClass,n=w(d),y,f;if(n.length){var g,K;"leave"==b?(K="leave",g="afterLeave"):(K="before"+b.charAt(0).toUpperCase()+b.substr(1),g=b);"enter"!==b&&"move"!==b&&(y=E(a,b,e,
n,K));f=E(a,b,e,n,g)}if(y||f)return{start:function(){function b(c){l=!0;z();da(a,e);h.complete(c)}var d,g=[];y&&g.push(function(a){d=y(a)});g.length?g.push(function(a){z();a(!0)}):z();f&&g.push(function(a){d=f(a)});var l=!1,h=new c({end:function(){l||((d||G)(void 0),b(void 0))},cancel:function(){l||((d||G)(!0),b(!0))}});c.chain(g,b);return h}}}}]}]).provider("$$animateJsDriver",["$$animationProvider",function(a){a.drivers.push("$$animateJsDriver");this.$get=["$$animateJs","$$AnimateRunner",function(a,
c){function d(c){return a(c.element,c.event,c.classes,c.options)}return function(a){if(a.from&&a.to){var b=d(a.from),s=d(a.to);if(b||s)return{start:function(){function a(){return function(){l(d,function(a){a.end()})}}var d=[];b&&d.push(b.start());s&&d.push(s.start());c.all(d,function(a){e.complete(a)});var e=new c({end:a(),cancel:a()});return e}}}else return d(a)}}]}])})(window,window.angular);
//# sourceMappingURL=angular-animate.min.js.map

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,9 @@
{
"name": "angular-animate",
"version": "1.4.4",
"main": "./angular-animate.js",
"ignore": [],
"dependencies": {
"angular": "1.4.4"
}
}

View File

@ -0,0 +1,2 @@
require('./angular-animate');
module.exports = 'ngAnimate';

View File

@ -0,0 +1,26 @@
{
"name": "angular-animate",
"version": "1.4.4",
"description": "AngularJS module for animations",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://github.com/angular/angular.js.git"
},
"keywords": [
"angular",
"framework",
"browser",
"animation",
"client-side"
],
"author": "Angular Core Team <angular-core+npm@google.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/angular/angular.js/issues"
},
"homepage": "http://angularjs.org"
}

View File

@ -0,0 +1,19 @@
{
"name": "angular-aria",
"version": "1.4.4",
"main": "./angular-aria.js",
"ignore": [],
"dependencies": {
"angular": "1.4.4"
},
"homepage": "https://github.com/angular/bower-angular-aria",
"_release": "1.4.4",
"_resolution": {
"type": "version",
"tag": "v1.4.4",
"commit": "79fd6f318da17de59a11211ff96ee85363439848"
},
"_source": "git://github.com/angular/bower-angular-aria.git",
"_target": "^1.3.15 || >1.4.0-beta.0",
"_originalSource": "angular-aria"
}

View File

@ -0,0 +1,67 @@
# packaged angular-aria
This repo is for distribution on `npm` and `bower`. The source for this module is in the
[main AngularJS repo](https://github.com/angular/angular.js/tree/master/src/ngAria).
Please file issues and pull requests against that repo.
## Install
You can install this package either with `npm` or with `bower`.
### npm
```shell
npm install angular-aria
```
Then add `ngAria` as a dependency for your app:
```javascript
angular.module('myApp', [require('angular-aria')]);
```
### bower
```shell
bower install angular-aria
```
Add a `<script>` to your `index.html`:
```html
<script src="/bower_components/angular-aria/angular-aria.js"></script>
```
Then add `ngAria` as a dependency for your app:
```javascript
angular.module('myApp', ['ngAria']);
```
## Documentation
Documentation is available on the
[AngularJS docs site](http://docs.angularjs.org/api/ngAria).
## License
The MIT License
Copyright (c) 2010-2015 Google, Inc. http://angularjs.org
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.

View File

@ -0,0 +1,393 @@
/**
* @license AngularJS v1.4.4
* (c) 2010-2015 Google, Inc. http://angularjs.org
* License: MIT
*/
(function(window, angular, undefined) {'use strict';
/**
* @ngdoc module
* @name ngAria
* @description
*
* The `ngAria` module provides support for common
* [<abbr title="Accessible Rich Internet Applications">ARIA</abbr>](http://www.w3.org/TR/wai-aria/)
* attributes that convey state or semantic information about the application for users
* of assistive technologies, such as screen readers.
*
* <div doc-module-components="ngAria"></div>
*
* ## Usage
*
* For ngAria to do its magic, simply include the module `ngAria` as a dependency. The following
* directives are supported:
* `ngModel`, `ngDisabled`, `ngShow`, `ngHide`, `ngClick`, `ngDblClick`, and `ngMessages`.
*
* Below is a more detailed breakdown of the attributes handled by ngAria:
*
* | Directive | Supported Attributes |
* |---------------------------------------------|----------------------------------------------------------------------------------------|
* | {@link ng.directive:ngDisabled ngDisabled} | aria-disabled |
* | {@link ng.directive:ngShow ngShow} | aria-hidden |
* | {@link ng.directive:ngHide ngHide} | aria-hidden |
* | {@link ng.directive:ngDblclick ngDblclick} | tabindex |
* | {@link module:ngMessages ngMessages} | aria-live |
* | {@link ng.directive:ngModel ngModel} | aria-checked, aria-valuemin, aria-valuemax, aria-valuenow, aria-invalid, aria-required, input roles |
* | {@link ng.directive:ngClick ngClick} | tabindex, keypress event, button role |
*
* Find out more information about each directive by reading the
* {@link guide/accessibility ngAria Developer Guide}.
*
* ##Example
* Using ngDisabled with ngAria:
* ```html
* <md-checkbox ng-disabled="disabled">
* ```
* Becomes:
* ```html
* <md-checkbox ng-disabled="disabled" aria-disabled="true">
* ```
*
* ##Disabling Attributes
* It's possible to disable individual attributes added by ngAria with the
* {@link ngAria.$ariaProvider#config config} method. For more details, see the
* {@link guide/accessibility Developer Guide}.
*/
/* global -ngAriaModule */
var ngAriaModule = angular.module('ngAria', ['ng']).
provider('$aria', $AriaProvider);
/**
* @ngdoc provider
* @name $ariaProvider
*
* @description
*
* Used for configuring the ARIA attributes injected and managed by ngAria.
*
* ```js
* angular.module('myApp', ['ngAria'], function config($ariaProvider) {
* $ariaProvider.config({
* ariaValue: true,
* tabindex: false
* });
* });
*```
*
* ## Dependencies
* Requires the {@link ngAria} module to be installed.
*
*/
function $AriaProvider() {
var config = {
ariaHidden: true,
ariaChecked: true,
ariaDisabled: true,
ariaRequired: true,
ariaInvalid: true,
ariaMultiline: true,
ariaValue: true,
tabindex: true,
bindKeypress: true,
bindRoleForClick: true
};
/**
* @ngdoc method
* @name $ariaProvider#config
*
* @param {object} config object to enable/disable specific ARIA attributes
*
* - **ariaHidden** `{boolean}` Enables/disables aria-hidden tags
* - **ariaChecked** `{boolean}` Enables/disables aria-checked tags
* - **ariaDisabled** `{boolean}` Enables/disables aria-disabled tags
* - **ariaRequired** `{boolean}` Enables/disables aria-required tags
* - **ariaInvalid** `{boolean}` Enables/disables aria-invalid tags
* - **ariaMultiline** `{boolean}` Enables/disables aria-multiline tags
* - **ariaValue** `{boolean}` Enables/disables aria-valuemin, aria-valuemax and aria-valuenow tags
* - **tabindex** `{boolean}` Enables/disables tabindex tags
* - **bindKeypress** `{boolean}` Enables/disables keypress event binding on `&lt;div&gt;` and
* `&lt;li&gt;` elements with ng-click
* - **bindRoleForClick** `{boolean}` Adds role=button to non-interactive elements like `div`
* using ng-click, making them more accessible to users of assistive technologies
*
* @description
* Enables/disables various ARIA attributes
*/
this.config = function(newConfig) {
config = angular.extend(config, newConfig);
};
function watchExpr(attrName, ariaAttr, negate) {
return function(scope, elem, attr) {
var ariaCamelName = attr.$normalize(ariaAttr);
if (config[ariaCamelName] && !attr[ariaCamelName]) {
scope.$watch(attr[attrName], function(boolVal) {
// ensure boolean value
boolVal = negate ? !boolVal : !!boolVal;
elem.attr(ariaAttr, boolVal);
});
}
};
}
/**
* @ngdoc service
* @name $aria
*
* @description
* @priority 200
*
* The $aria service contains helper methods for applying common
* [ARIA](http://www.w3.org/TR/wai-aria/) attributes to HTML directives.
*
* ngAria injects common accessibility attributes that tell assistive technologies when HTML
* elements are enabled, selected, hidden, and more. To see how this is performed with ngAria,
* let's review a code snippet from ngAria itself:
*
*```js
* ngAriaModule.directive('ngDisabled', ['$aria', function($aria) {
* return $aria.$$watchExpr('ngDisabled', 'aria-disabled');
* }])
*```
* Shown above, the ngAria module creates a directive with the same signature as the
* traditional `ng-disabled` directive. But this ngAria version is dedicated to
* solely managing accessibility attributes. The internal `$aria` service is used to watch the
* boolean attribute `ngDisabled`. If it has not been explicitly set by the developer,
* `aria-disabled` is injected as an attribute with its value synchronized to the value in
* `ngDisabled`.
*
* Because ngAria hooks into the `ng-disabled` directive, developers do not have to do
* anything to enable this feature. The `aria-disabled` attribute is automatically managed
* simply as a silent side-effect of using `ng-disabled` with the ngAria module.
*
* The full list of directives that interface with ngAria:
* * **ngModel**
* * **ngShow**
* * **ngHide**
* * **ngClick**
* * **ngDblclick**
* * **ngMessages**
* * **ngDisabled**
*
* Read the {@link guide/accessibility ngAria Developer Guide} for a thorough explanation of each
* directive.
*
*
* ## Dependencies
* Requires the {@link ngAria} module to be installed.
*/
this.$get = function() {
return {
config: function(key) {
return config[key];
},
$$watchExpr: watchExpr
};
};
}
ngAriaModule.directive('ngShow', ['$aria', function($aria) {
return $aria.$$watchExpr('ngShow', 'aria-hidden', true);
}])
.directive('ngHide', ['$aria', function($aria) {
return $aria.$$watchExpr('ngHide', 'aria-hidden', false);
}])
.directive('ngModel', ['$aria', function($aria) {
function shouldAttachAttr(attr, normalizedAttr, elem) {
return $aria.config(normalizedAttr) && !elem.attr(attr);
}
function shouldAttachRole(role, elem) {
return !elem.attr('role') && (elem.attr('type') === role) && (elem[0].nodeName !== 'INPUT');
}
function getShape(attr, elem) {
var type = attr.type,
role = attr.role;
return ((type || role) === 'checkbox' || role === 'menuitemcheckbox') ? 'checkbox' :
((type || role) === 'radio' || role === 'menuitemradio') ? 'radio' :
(type === 'range' || role === 'progressbar' || role === 'slider') ? 'range' :
(type || role) === 'textbox' || elem[0].nodeName === 'TEXTAREA' ? 'multiline' : '';
}
return {
restrict: 'A',
require: '?ngModel',
priority: 200, //Make sure watches are fired after any other directives that affect the ngModel value
compile: function(elem, attr) {
var shape = getShape(attr, elem);
return {
pre: function(scope, elem, attr, ngModel) {
if (shape === 'checkbox' && attr.type !== 'checkbox') {
//Use the input[checkbox] $isEmpty implementation for elements with checkbox roles
ngModel.$isEmpty = function(value) {
return value === false;
};
}
},
post: function(scope, elem, attr, ngModel) {
var needsTabIndex = shouldAttachAttr('tabindex', 'tabindex', elem);
function ngAriaWatchModelValue() {
return ngModel.$modelValue;
}
function getRadioReaction() {
if (needsTabIndex) {
needsTabIndex = false;
return function ngAriaRadioReaction(newVal) {
var boolVal = (attr.value == ngModel.$viewValue);
elem.attr('aria-checked', boolVal);
elem.attr('tabindex', 0 - !boolVal);
};
} else {
return function ngAriaRadioReaction(newVal) {
elem.attr('aria-checked', (attr.value == ngModel.$viewValue));
};
}
}
function ngAriaCheckboxReaction() {
elem.attr('aria-checked', !ngModel.$isEmpty(ngModel.$viewValue));
}
switch (shape) {
case 'radio':
case 'checkbox':
if (shouldAttachRole(shape, elem)) {
elem.attr('role', shape);
}
if (shouldAttachAttr('aria-checked', 'ariaChecked', elem)) {
scope.$watch(ngAriaWatchModelValue, shape === 'radio' ?
getRadioReaction() : ngAriaCheckboxReaction);
}
break;
case 'range':
if (shouldAttachRole(shape, elem)) {
elem.attr('role', 'slider');
}
if ($aria.config('ariaValue')) {
var needsAriaValuemin = !elem.attr('aria-valuemin') &&
(attr.hasOwnProperty('min') || attr.hasOwnProperty('ngMin'));
var needsAriaValuemax = !elem.attr('aria-valuemax') &&
(attr.hasOwnProperty('max') || attr.hasOwnProperty('ngMax'));
var needsAriaValuenow = !elem.attr('aria-valuenow');
if (needsAriaValuemin) {
attr.$observe('min', function ngAriaValueMinReaction(newVal) {
elem.attr('aria-valuemin', newVal);
});
}
if (needsAriaValuemax) {
attr.$observe('max', function ngAriaValueMinReaction(newVal) {
elem.attr('aria-valuemax', newVal);
});
}
if (needsAriaValuenow) {
scope.$watch(ngAriaWatchModelValue, function ngAriaValueNowReaction(newVal) {
elem.attr('aria-valuenow', newVal);
});
}
}
break;
case 'multiline':
if (shouldAttachAttr('aria-multiline', 'ariaMultiline', elem)) {
elem.attr('aria-multiline', true);
}
break;
}
if (needsTabIndex) {
elem.attr('tabindex', 0);
}
if (ngModel.$validators.required && shouldAttachAttr('aria-required', 'ariaRequired', elem)) {
scope.$watch(function ngAriaRequiredWatch() {
return ngModel.$error.required;
}, function ngAriaRequiredReaction(newVal) {
elem.attr('aria-required', !!newVal);
});
}
if (shouldAttachAttr('aria-invalid', 'ariaInvalid', elem)) {
scope.$watch(function ngAriaInvalidWatch() {
return ngModel.$invalid;
}, function ngAriaInvalidReaction(newVal) {
elem.attr('aria-invalid', !!newVal);
});
}
}
};
}
};
}])
.directive('ngDisabled', ['$aria', function($aria) {
return $aria.$$watchExpr('ngDisabled', 'aria-disabled');
}])
.directive('ngMessages', function() {
return {
restrict: 'A',
require: '?ngMessages',
link: function(scope, elem, attr, ngMessages) {
if (!elem.attr('aria-live')) {
elem.attr('aria-live', 'assertive');
}
}
};
})
.directive('ngClick',['$aria', '$parse', function($aria, $parse) {
return {
restrict: 'A',
compile: function(elem, attr) {
var fn = $parse(attr.ngClick, /* interceptorFn */ null, /* expensiveChecks */ true);
return function(scope, elem, attr) {
var nodeBlackList = ['BUTTON', 'A', 'INPUT', 'TEXTAREA'];
function isNodeOneOf(elem, nodeTypeArray) {
if (nodeTypeArray.indexOf(elem[0].nodeName) !== -1) {
return true;
}
}
if ($aria.config('bindRoleForClick')
&& !elem.attr('role')
&& !isNodeOneOf(elem, nodeBlackList)) {
elem.attr('role', 'button');
}
if ($aria.config('tabindex') && !elem.attr('tabindex')) {
elem.attr('tabindex', 0);
}
if ($aria.config('bindKeypress') && !attr.ngKeypress && !isNodeOneOf(elem, nodeBlackList)) {
elem.on('keypress', function(event) {
var keyCode = event.which || event.keyCode;
if (keyCode === 32 || keyCode === 13) {
scope.$apply(callback);
}
function callback() {
fn(scope, { $event: event });
}
});
}
};
}
};
}])
.directive('ngDblclick', ['$aria', function($aria) {
return function(scope, elem, attr) {
if ($aria.config('tabindex') && !elem.attr('tabindex')) {
elem.attr('tabindex', 0);
}
};
}]);
})(window, window.angular);

View File

@ -0,0 +1,13 @@
/*
AngularJS v1.4.4
(c) 2010-2015 Google, Inc. http://angularjs.org
License: MIT
*/
(function(s,n,t){'use strict';n.module("ngAria",["ng"]).provider("$aria",function(){function a(a,f,l){return function(m,d,e){var b=e.$normalize(f);c[b]&&!e[b]&&m.$watch(e[a],function(b){b=l?!b:!!b;d.attr(f,b)})}}var c={ariaHidden:!0,ariaChecked:!0,ariaDisabled:!0,ariaRequired:!0,ariaInvalid:!0,ariaMultiline:!0,ariaValue:!0,tabindex:!0,bindKeypress:!0,bindRoleForClick:!0};this.config=function(a){c=n.extend(c,a)};this.$get=function(){return{config:function(a){return c[a]},$$watchExpr:a}}}).directive("ngShow",
["$aria",function(a){return a.$$watchExpr("ngShow","aria-hidden",!0)}]).directive("ngHide",["$aria",function(a){return a.$$watchExpr("ngHide","aria-hidden",!1)}]).directive("ngModel",["$aria",function(a){function c(c,m,d){return a.config(m)&&!d.attr(c)}function k(a,c){return!c.attr("role")&&c.attr("type")===a&&"INPUT"!==c[0].nodeName}function f(a,c){var d=a.type,e=a.role;return"checkbox"===(d||e)||"menuitemcheckbox"===e?"checkbox":"radio"===(d||e)||"menuitemradio"===e?"radio":"range"===d||"progressbar"===
e||"slider"===e?"range":"textbox"===(d||e)||"TEXTAREA"===c[0].nodeName?"multiline":""}return{restrict:"A",require:"?ngModel",priority:200,compile:function(l,m){var d=f(m,l);return{pre:function(a,b,c,g){"checkbox"===d&&"checkbox"!==c.type&&(g.$isEmpty=function(b){return!1===b})},post:function(e,b,h,g){function f(){return g.$modelValue}function m(){return p?(p=!1,function(a){a=h.value==g.$viewValue;b.attr("aria-checked",a);b.attr("tabindex",0-!a)}):function(a){b.attr("aria-checked",h.value==g.$viewValue)}}
function l(){b.attr("aria-checked",!g.$isEmpty(g.$viewValue))}var p=c("tabindex","tabindex",b);switch(d){case "radio":case "checkbox":k(d,b)&&b.attr("role",d);c("aria-checked","ariaChecked",b)&&e.$watch(f,"radio"===d?m():l);break;case "range":k(d,b)&&b.attr("role","slider");if(a.config("ariaValue")){var n=!b.attr("aria-valuemin")&&(h.hasOwnProperty("min")||h.hasOwnProperty("ngMin")),q=!b.attr("aria-valuemax")&&(h.hasOwnProperty("max")||h.hasOwnProperty("ngMax")),r=!b.attr("aria-valuenow");n&&h.$observe("min",
function(a){b.attr("aria-valuemin",a)});q&&h.$observe("max",function(a){b.attr("aria-valuemax",a)});r&&e.$watch(f,function(a){b.attr("aria-valuenow",a)})}break;case "multiline":c("aria-multiline","ariaMultiline",b)&&b.attr("aria-multiline",!0)}p&&b.attr("tabindex",0);g.$validators.required&&c("aria-required","ariaRequired",b)&&e.$watch(function(){return g.$error.required},function(a){b.attr("aria-required",!!a)});c("aria-invalid","ariaInvalid",b)&&e.$watch(function(){return g.$invalid},function(a){b.attr("aria-invalid",
!!a)})}}}}}]).directive("ngDisabled",["$aria",function(a){return a.$$watchExpr("ngDisabled","aria-disabled")}]).directive("ngMessages",function(){return{restrict:"A",require:"?ngMessages",link:function(a,c,k,f){c.attr("aria-live")||c.attr("aria-live","assertive")}}}).directive("ngClick",["$aria","$parse",function(a,c){return{restrict:"A",compile:function(k,f){var l=c(f.ngClick,null,!0);return function(c,d,e){function b(a,b){if(-1!==b.indexOf(a[0].nodeName))return!0}var f=["BUTTON","A","INPUT","TEXTAREA"];
!a.config("bindRoleForClick")||d.attr("role")||b(d,f)||d.attr("role","button");a.config("tabindex")&&!d.attr("tabindex")&&d.attr("tabindex",0);if(a.config("bindKeypress")&&!e.ngKeypress&&!b(d,f))d.on("keypress",function(a){function b(){l(c,{$event:a})}var d=a.which||a.keyCode;32!==d&&13!==d||c.$apply(b)})}}}}]).directive("ngDblclick",["$aria",function(a){return function(c,k,f){a.config("tabindex")&&!k.attr("tabindex")&&k.attr("tabindex",0)}}])})(window,window.angular);
//# sourceMappingURL=angular-aria.min.js.map

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,9 @@
{
"name": "angular-aria",
"version": "1.4.4",
"main": "./angular-aria.js",
"ignore": [],
"dependencies": {
"angular": "1.4.4"
}
}

View File

@ -0,0 +1,2 @@
require('./angular-aria');
module.exports = 'ngAria';

View File

@ -0,0 +1,27 @@
{
"name": "angular-aria",
"version": "1.4.4",
"description": "AngularJS module for making accessibility easy",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://github.com/angular/angular.js.git"
},
"keywords": [
"angular",
"framework",
"browser",
"accessibility",
"a11y",
"client-side"
],
"author": "Angular Core Team <angular-core+npm@google.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/angular/angular.js/issues"
},
"homepage": "http://angularjs.org"
}

View File

@ -0,0 +1,25 @@
{
"name": "angular-material",
"version": "0.10.1",
"ignore": [],
"dependencies": {
"angular": "^1.3.0 || >1.4.0-beta.0",
"angular-animate": "^1.3.0 || >1.4.0-beta.0",
"angular-aria": "^1.3.15 || >1.4.0-beta.0"
},
"main": [
"angular-material.js",
"angular-material.css"
],
"homepage": "https://github.com/angular/bower-material",
"_release": "0.10.1",
"_resolution": {
"type": "version",
"tag": "v0.10.1",
"commit": "44f067ad06830daf69a173706e7dee92edb4b1fa"
},
"_source": "git://github.com/angular/bower-material.git",
"_target": "~0.10.1",
"_originalSource": "angular-material",
"_direct": true
}

View File

@ -0,0 +1,5 @@
*.log
*.sw*
.DS_STORE
/.idea/
default-theme.css

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,21 @@
The MIT License
Copyright (c) 2014 Google, Inc. http://angularjs.org
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.

View File

@ -0,0 +1,211 @@
This repo is for distribution on `npm` and `bower`. The source for this module is in the
[main Angular Material repo](https://github.com/angular/material).
Please file issues and pull requests against that repo.
## Installing Angular Material
You can install this package locally either with `npm`, `jspm`, or `bower`.
### npm
```shell
# To install latest formal release
npm install angular-material
# To install latest release and update package.json
npm install angular-material --save
# To install from HEAD of master
npm install http://github.com/angular/bower-material/tarball/master
# To view all installed package
npm list;
```
### jspm
```shell
# To install latest formal release
jspm install angular-material;
# To install from HEAD of master
jspm install angular-material=github:angular/bower-material@master;
# To view all installed package versions
jspm inspect;
```
Now you can use `require('angular-material')` when installing with npm or jsmp and using Browserify or Webpack.
### bower
```shell
# To get the latest stable version, use bower from the command line.
bower install angular-material
# To get the most recent, last committed-to-master version use:
bower install angular-material#master
# To save the bower settings for future use:
bower install angular-material --save
# Later, you can use easily update with:
bower update
```
> Please note that Angular Material requires **Angular 1.3.x** or higher.
## Using the Angular Material Library
Now that you have installed the Angular libraries, simply include the scripts and
stylesheet in your main HTML file, in the order shown in the example below. Note that npm
will install the files under `/node_modules/angular-material/` and bower will install them
under `/bower_components/angular-material/`.
### npm
```html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="stylesheet" href="/node_modules/angular-material/angular-material.css">
</head>
<body ng-app="YourApp">
<div ng-controller="YourController">
</div>
<script src="/node_modules/angular/angular.js"></script>
<script src="/node_modules/angular-aria/angular-aria.js"></script>
<script src="/node_modules/angular-animate/angular-animate.js"></script>
<script src="/node_modules/angular-material/angular-material.js"></script>
<script>
// Include app dependency on ngMaterial
angular.module( 'YourApp', [ 'ngMaterial' ] )
.controller("YourController", YourController );
</script>
</body>
</html>
```
### bower
```html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="stylesheet" href="/bower_components/angular-material/angular-material.css">
</head>
<body ng-app="YourApp">
<div ng-controller="YourController">
</div>
<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/angular-aria/angular-aria.js"></script>
<script src="/bower_components/angular-animate/angular-animate.js"></script>
<script src="/bower_components/angular-material/angular-material.js"></script>
<script>
// Include app dependency on ngMaterial
angular.module( 'YourApp', [ 'ngMaterial' ] )
.controller("YourController", YourController );
</script>
</body>
</html>
```
## Using the CDN
CDN versions of Angular Material are now available at
[Google Hosted Libraries](https://developers.google.com/speed/libraries/devguide#angularmaterial).
With the Google CDN, you will not need to download local copies of the distribution files.
Instead simply reference the CDN urls to easily use those remote library files.
This is especially useful when using online tools such as CodePen, Plunkr, or jsFiddle.
```html
<head>
<!-- Angular Material CSS now available via Google CDN; version 0.9.4 used here -->
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css">
</head>
<body>
<!-- Angular Material Dependencies -->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-animate.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-aria.min.js"></script>
<!-- Angular Material Javascript now available via Google CDN; version 0.9.4 used here -->
<script src="//ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.js"></script>
</body>
```
> Note that the above sample references the 0.9.4 CDN release. Your version will change
based on the latest stable release version.
## Jasmine Testing with Angular Material
<br/>
If you are using Angular Material and will be using Jasmine to test your own custom application code, you will need to also load two (2) Angular mock files:
* Angular Mocks - **angular-mocks.js** from `/node_modules/angular-mocks/angular-mocks.js`
* Angular Material Mocks - **angular-material-mocks.js** from `/node_modules/angular-material/angular-material-mocks.js`
<br/>
Shown below is a karma-configuration file (`karma.conf.js`) sample that may be a useful template for your own testing purposes:<br/><br/>
```js
module.exports = function(config) {
var SRC = [
'src/myApp/**/*.js',
'test/myApp/**/*.spec.js'
];
var LIBS = [
'node_modules/angular/angular.js',
'node_modules/angular-animate/angular-animate.js',
'node_modules/angular-aria/angular-aria.js',
'node_modules/angular-material/angular-material.js',
'node_modules/angular-mocks/angular-mocks.js',
'node_modules/angular-material/angular-material-mocks.js'
];
config.set({
basePath: __dirname + '/..',
frameworks: ['jasmine'],
files: LIBS.concat(SRC),
port: 9876,
reporters: ['progress'],
colors: true,
autoWatch: false,
singleRun: true,
browsers: ['PhantomJS,Chrome']
});
};
```

View File

@ -0,0 +1,93 @@
/**
*
* Angular-Material-Mocks
*
* Developers interested in running their own custom unit tests WITH angular-material.js loaded...
* must also include this *mocks* file. Similar to `angular-mocks.js`, `angular-material-mocks.js`
* will override and disable specific Angular Material performance settings:
*
* - Disabled Theme CSS rule generations
* - Forces $mdAria.expectWithText() to be synchronous
* - Mocks $$rAF.throttle()
* - Captures flush exceptions from $$rAF
*
*/
(function(window, angular, undefined) {
'use strict';
/**
* @ngdoc module
* @name ngMaterial-mock
* @packageName angular-material-mocks
*
* @description
*
* The `ngMaterial-mock` module provides support
*
*/
angular.module('ngMaterial-mock', ['ngMock', 'material.core'])
.config(['$provide', function($provide) {
/**
* Angular Material dynamically generates Style tags
* based on themes and palletes; for each ng-app.
*
* For testing, we want to disable generation and
* <style> DOM injections. So we clear the huge THEME
* styles while testing...
*/
$provide.constant('$MD_THEME_CSS', '/**/');
/**
* Intercept to make .expectWithText() to be synchronous
*/
$provide.decorator('$mdAria', function($delegate){
$delegate.expectWithText = function(element, attrName){
$delegate.expect(element, attrName, element.text().trim());
};
return $delegate;
});
/**
* Add throttle() and wrap .flush() to catch `no callbacks present`
* errors
*/
$provide.decorator('$$rAF', function throttleInjector($delegate){
$delegate.throttle = function(cb) {
return function() {
cb.apply(this, arguments);
};
};
var ngFlush = $delegate.flush;
$delegate.flush = function() {
try { ngFlush(); }
catch(e) { ; }
};
return $delegate;
});
/**
* Capture $timeout.flush() errors: "No deferred tasks to be flushed"
* errors
*/
$provide.decorator('$timeout', function throttleInjector($delegate){
var ngFlush = $delegate.flush;
$delegate.flush = function() {
var args = Array.prototype.slice.call(arguments);
try { ngFlush.apply($delegate, args); }
catch(e) { ; }
};
return $delegate;
});
}]);
})(window, window.angular);

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,14 @@
{
"name": "angular-material",
"version": "0.10.1",
"ignore": [],
"dependencies": {
"angular": "^1.3.0 || >1.4.0-beta.0",
"angular-animate": "^1.3.0 || >1.4.0-beta.0",
"angular-aria": "^1.3.15 || >1.4.0-beta.0"
},
"main": [
"angular-material.js",
"angular-material.css"
]
}

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"><g><g><rect fill="none" width="24" height="24"/><path fill="#7d7d7d" d="M16,1H4C2.9,1,2,1.9,2,3v14h2V3h12V1z M19,5H8C6.9,5,6,5.9,6,7v14c0,1.1,0.9,2,2,2h11c1.1,0,2-0.9,2-2V7C21,5.9,20.1,5,19,5z M19,21H8V7h11V21z"/></g></g></svg>

After

Width:  |  Height:  |  Size: 365 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve"><g><g><rect fill="none" width="48" height="48"/><path fill="#7d7d7d" d="M32,2H8C5.8,2,4,3.8,4,6v28h4V6h24V2z M38,10H16c-2.2,0-4,1.8-4,4v28c0,2.2,1.8,4,4,4h22c2.2,0,4-1.8,4-4V14C42,11.8,40.2,10,38,10z M38,42H16V14h22V42z"/></g></g></svg>

After

Width:  |  Height:  |  Size: 374 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve"><g><g><g><path fill="#7d7d7d" d="M40,4H8C5.8,4,4,5.8,4,8l0,32c0,2.2,1.8,4,4,4h32c2.2,0,4-1.8,4-4V8C44,5.8,42.2,4,40,4z M38,8v6h-4c-1.1,0-2,0.9-2,2v4h6v6h-6v14h-6V26h-4v-6h4v-5c0-3.9,3.1-7,7-7H38z"/></g><g><rect fill="none" width="48" height="48"/></g></g></g></svg>

After

Width:  |  Height:  |  Size: 403 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve"><g><g><path fill="#159F5C" d="M23,4C13.6,4,6,11.6,6,21s7.6,17,17,17h1v7c9.7-4.7,16-15,16-24C40,11.6,32.4,4,23,4z M22,22l-2,4h-3l2-4h-3v-6h6V22zM30,22l-2,4h-3l2-4h-3v-6h6V22z"/><rect x="0" fill="none" width="48" height="48"/></g></g></svg>

After

Width:  |  Height:  |  Size: 376 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve"><g><g><path fill="#7d7d7d" d="M40,8H8c-2.2,0-4,1.8-4,4l0,24c0,2.2,1.8,4,4,4h32c2.2,0,4-1.8,4-4V12C44,9.8,42.2,8,40,8z M40,16L24,26L8,16v-4l16,10l16-10V16z"/><rect fill="none" width="48" height="48"/></g></g></svg>

After

Width:  |  Height:  |  Size: 351 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve"><g><g><path fill="#7d7d7d" d="M40,4H8C5.8,4,4,5.8,4,8l0,36l8-8h28c2.2,0,4-1.8,4-4V8C44,5.8,42.2,4,40,4z M36,28H12v-4h24V28z M36,22H12v-4h24V22zM36,16H12v-4h24V16z"/><rect x="0" fill="none" width="48" height="48"/></g></g></svg>

After

Width:  |  Height:  |  Size: 365 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="24px"height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"><g><g><g><path d="M19,8H5c-1.7,0-3,1.3-3,3v6h4v4h12v-4h4v-6C22,9.3,20.7,8,19,8z M16,19H8v-5h8V19z M19,12c-0.6,0-1-0.4-1-1s0.4-1,1-1c0.6,0,1,0.4,1,1S19.6,12,19,12z M18,3H6v4h12V3z" fill="#7d7d7d"/></g><rect fill="none" width="24" height="24"/></g></g></svg>

After

Width:  |  Height:  |  Size: 393 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"><g><g><path fill="#7d7d7d" d="M21,11l-7-7v4C7,9,4,14,3,19c2.5-3.5,6-5.1,11-5.1V18L21,11z"/><rect fill="none" width="24" height="24"/></g></g></svg>

After

Width:  |  Height:  |  Size: 285 B

View File

@ -0,0 +1,2 @@
<svg version="1.1" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve"><g><g><g><path fill="#7d7d7d" d="M40,4H8C5.8,4,4,5.8,4,8l0,32c0,2.2,1.8,4,4,4h32c2.2,0,4-1.8,4-4V8C44,5.8,42.2,4,40,4z M35.4,18.7c-0.1,9.2-6,15.6-14.8,16c-3.6,0.2-6.3-1-8.6-2.5c2.7,0.4,6-0.6,7.8-2.2c-2.6-0.3-4.2-1.6-4.9-3.8c0.8,0.1,1.6,0.1,2.3-0.1
c-2.4-0.8-4.1-2.3-4.2-5.3c0.7,0.3,1.4,0.6,2.3,0.6c-1.8-1-3.1-4.7-1.6-7.2c2.6,2.9,5.8,5.3,11,5.6c-1.3-5.6,6.1-8.6,9.2-4.9c1.3-0.3,2.4-0.8,3.4-1.3c-0.4,1.3-1.2,2.2-2.2,2.9c1.1-0.1,2.1-0.4,2.9-0.8C37.5,16.9,36.4,17.9,35.4,18.7z"/></g><g><rect fill="none" width="48" height="48"/></g></g></g></svg>

After

Width:  |  Height:  |  Size: 680 B

View File

@ -0,0 +1 @@
<svg version="1.1" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"><g><g><rect x="-618" y="-2232" fill="none" width="1400" height="3600"/></g></g><g><g><rect fill="none" width="24" height="24"/><path fill="#7d7d7d" d="M19.4,10c-0.7-3.4-3.7-6-7.4-6C9.1,4,6.6,5.6,5.4,8C2.3,8.4,0,10.9,0,14c0,3.3,2.7,6,6,6h13c2.8,0,5-2.2,5-5C24,12.4,21.9,10.2,19.4,10z M14,13v4h-4v-4H7l5-5l5,5H14z"/></g></g></svg>

After

Width:  |  Height:  |  Size: 466 B

View File

@ -0,0 +1,39 @@
.custom-chips {
.md-chip {
position: relative;
padding-right: 35px;
.md-chip-remove-container {
position: absolute;
right: 4px;
top: 4px;
margin-right: 0;
height: 24px;
button.vegetablechip {
position: relative;
height: 24px;
width: 24px;
line-height: 30px;
text-align: center;
background: rgba(black, 0.3);
border-radius: 50%;
border: none;
box-shadow: none;
padding: 0;
margin: 0;
transition: background 0.15s linear;
display: block;
md-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0) scale(0.7);
color: white;
fill: white;
}
&:hover, &:focus {
background: rgba(red, 0.8);
}
}
}
}
}

View File

@ -0,0 +1,47 @@
md-content.autocomplete {
min-height: 250px;
}
.md-item-text.compact {
padding-top: 8px;
padding-bottom: 8px;
}
.contact-item {
box-sizing: border-box;
&.selected {
opacity: 0.5;
h3 {
opacity: 0.5;
}
}
.md-list-item-text {
padding: 14px 0;
h3 {
margin: 0 !important;
padding: 0;
line-height: 1.2em !important;
}
h3, p {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
@media (min-width: 900px) {
float: left;
width: 33%;
}
}
md-contact-chips {
margin-bottom : 10px;
}
.md-chips {
padding: 5px 0 8px;
}
.fixedRows {
height: 250px;
overflow:hidden;
}

View File

@ -0,0 +1,75 @@
md-icon {
width:50%;height:50%
}
md-icon svg {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
.s64 {
font-size:64px;
}
.s32 {
font-size:48px;
}
md-icon.fa {
display:block;
padding-left:0px;
}
md-icon.s32 span {
padding-left:8px;
}
md-grid-list {
margin: 8px; }
.gray {
background: #f5f5f5; }
.green {
background: #b9f6ca; }
.yellow {
background: #ffff8d; }
.blue {
background: #84ffff; }
.darkBlue {
background: #80d8ff; }
.deepBlue {
background: #448aff; }
.purple {
background: #b388ff; }
.lightPurple {
background: #8c9eff; }
.red {
background: #ff8a80; }
.pink {
background: #ff80ab; }
md-grid-tile {
-webkit-transition: all 500ms ease-out 100ms;
-moz-transition: all 500ms ease-out 100ms;
-o-transition: all 500ms ease-out 100ms;
transition: all 500ms ease-out 100ms;
}
md-grid-tile md-grid-tile-footer {
background: rgba(0,0,0,.68);
height: 36px;
}
md-grid-tile-footer figcaption {
width:100%;
}
md-grid-tile-footer figcaption h3 {
margin:0px;
font-weight:700;
width:100%;
text-align:center;
}

View File

@ -0,0 +1,78 @@
md-icon {
width:50%;height:50%
}
md-icon svg {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
.s64 {
font-size:64px;
}
.s32 {
font-size:48px;
}
md-icon.fa {
display:block;
padding-left: 0;
}
md-icon.s32 span {
padding-left:8px;
}
md-grid-list {
margin: 8px; }
.gray {
background: #f5f5f5; }
.green {
background: #b9f6ca; }
.yellow {
background: #ffff8d; }
.blue {
background: #84ffff; }
.darkBlue {
background: #80d8ff; }
.deepBlue {
background: #448aff; }
.purple {
background: #b388ff; }
.lightPurple {
background: #8c9eff; }
.red {
background: #ff8a80; }
.pink {
background: #ff80ab; }
md-grid-tile {
transition: all 300ms ease-out 50ms;
}
md-grid-tile md-icon {
padding-bottom: 32px;
}
md-grid-tile md-grid-tile-footer {
background: rgba(0,0,0,.68);
height: 36px;
}
md-grid-tile-footer figcaption {
width:100%;
}
md-grid-tile-footer figcaption h3 {
margin: 0;
font-weight:700;
width:100%;
text-align:center;
}

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="add-shopping-cart"><path d="M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z"/></g></svg>

After

Width:  |  Height:  |  Size: 479 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="android"><path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/></g></svg>

After

Width:  |  Height:  |  Size: 665 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="cake"><path d="M12 6c1.11 0 2-.9 2-2 0-.38-.1-.73-.29-1.03L12 0l-1.71 2.97c-.19.3-.29.65-.29 1.03 0 1.1.9 2 2 2zm4.6 9.99l-1.07-1.07-1.08 1.07c-1.3 1.3-3.58 1.31-4.89 0l-1.07-1.07-1.09 1.07C6.75 16.64 5.88 17 4.96 17c-.73 0-1.4-.23-1.96-.61V21c0 .55.45 1 1 1h16c.55 0 1-.45 1-1v-4.61c-.56.38-1.23.61-1.96.61-.92 0-1.79-.36-2.44-1.01zM18 9h-5V7h-2v2H6c-1.66 0-3 1.34-3 3v1.54c0 1.08.88 1.96 1.96 1.96.52 0 1.02-.2 1.38-.57l2.14-2.13 2.13 2.13c.74.74 2.03.74 2.77 0l2.14-2.13 2.13 2.13c.37.37.86.57 1.38.57 1.08 0 1.96-.88 1.96-1.96V12C21 10.34 19.66 9 18 9z"/></g></svg>

After

Width:  |  Height:  |  Size: 636 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="cake"><path d="M12 6c1.11 0 2-.9 2-2 0-.38-.1-.73-.29-1.03L12 0l-1.71 2.97c-.19.3-.29.65-.29 1.03 0 1.1.9 2 2 2zm4.6 9.99l-1.07-1.07-1.08 1.07c-1.3 1.3-3.58 1.31-4.89 0l-1.07-1.07-1.09 1.07C6.75 16.64 5.88 17 4.96 17c-.73 0-1.4-.23-1.96-.61V21c0 .55.45 1 1 1h16c.55 0 1-.45 1-1v-4.61c-.56.38-1.23.61-1.96.61-.92 0-1.79-.36-2.44-1.01zM18 9h-5V7h-2v2H6c-1.66 0-3 1.34-3 3v1.54c0 1.08.88 1.96 1.96 1.96.52 0 1.02-.2 1.38-.57l2.14-2.13 2.13 2.13c.74.74 2.03.74 2.77 0l2.14-2.13 2.13 2.13c.37.37.86.57 1.38.57 1.08 0 1.96-.88 1.96-1.96V12C21 10.34 19.66 9 18 9z"/></g></svg>

After

Width:  |  Height:  |  Size: 636 B

View File

@ -0,0 +1,26 @@
<svg><defs>
<g id="3d-rotation"><path d="M7.52 21.48C4.25 19.94 1.91 16.76 1.55 13H.05C.56 19.16 5.71 24 12 24l.66-.03-3.81-3.81-1.33 1.32zm.89-6.52c-.19 0-.37-.03-.52-.08-.16-.06-.29-.13-.4-.24-.11-.1-.2-.22-.26-.37-.06-.14-.09-.3-.09-.47h-1.3c0 .36.07.68.21.95.14.27.33.5.56.69.24.18.51.32.82.41.3.1.62.15.96.15.37 0 .72-.05 1.03-.15.32-.1.6-.25.83-.44s.42-.43.55-.72c.13-.29.2-.61.2-.97 0-.19-.02-.38-.07-.56-.05-.18-.12-.35-.23-.51-.1-.16-.24-.3-.4-.43-.17-.13-.37-.23-.61-.31.2-.09.37-.2.52-.33.15-.13.27-.27.37-.42.1-.15.17-.3.22-.46.05-.16.07-.32.07-.48 0-.36-.06-.68-.18-.96-.12-.28-.29-.51-.51-.69-.2-.19-.47-.33-.77-.43C9.1 8.05 8.76 8 8.39 8c-.36 0-.69.05-1 .16-.3.11-.57.26-.79.45-.21.19-.38.41-.51.67-.12.26-.18.54-.18.85h1.3c0-.17.03-.32.09-.45s.14-.25.25-.34c.11-.09.23-.17.38-.22.15-.05.3-.08.48-.08.4 0 .7.1.89.31.19.2.29.49.29.86 0 .18-.03.34-.08.49-.05.15-.14.27-.25.37-.11.1-.25.18-.41.24-.16.06-.36.09-.58.09H7.5v1.03h.77c.22 0 .42.02.6.07s.33.13.45.23c.12.11.22.24.29.4.07.16.1.35.1.57 0 .41-.12.72-.35.93-.23.23-.55.33-.95.33zm8.55-5.92c-.32-.33-.7-.59-1.14-.77-.43-.18-.92-.27-1.46-.27H12v8h2.3c.55 0 1.06-.09 1.51-.27.45-.18.84-.43 1.16-.76.32-.33.57-.73.74-1.19.17-.47.26-.99.26-1.57v-.4c0-.58-.09-1.1-.26-1.57-.18-.47-.43-.87-.75-1.2zm-.39 3.16c0 .42-.05.79-.14 1.13-.1.33-.24.62-.43.85-.19.23-.43.41-.71.53-.29.12-.62.18-.99.18h-.91V9.12h.97c.72 0 1.27.23 1.64.69.38.46.57 1.12.57 1.99v.4zM12 0l-.66.03 3.81 3.81 1.33-1.33c3.27 1.55 5.61 4.72 5.96 8.48h1.5C23.44 4.84 18.29 0 12 0z"/></g>
<g id="accessibility"><path d="M12 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm9 7h-6v13h-2v-6h-2v6H9V9H3V7h18v2z"/></g>
<g id="account-balance"><path d="M4 10v7h3v-7H4zm6 0v7h3v-7h-3zM2 22h19v-3H2v3zm14-12v7h3v-7h-3zm-4.5-9L2 6v2h19V6l-9.5-5z"/></g>
<g id="account-balance-wallet"><path d="M21 18v1c0 1.1-.9 2-2 2H5c-1.11 0-2-.9-2-2V5c0-1.1.89-2 2-2h14c1.1 0 2 .9 2 2v1h-9c-1.11 0-2 .9-2 2v8c0 1.1.89 2 2 2h9zm-9-2h10V8H12v8zm4-2.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z"/></g>
<g id="account-box"><path d="M3 5v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2H5c-1.11 0-2 .9-2 2zm12 4c0 1.66-1.34 3-3 3s-3-1.34-3-3 1.34-3 3-3 3 1.34 3 3zm-9 8c0-2 4-3.1 6-3.1s6 1.1 6 3.1v1H6v-1z"/></g>
<g id="account-child"><circle cx="12" cy="13.49" r="1.5"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 2.5c1.24 0 2.25 1.01 2.25 2.25S13.24 9 12 9 9.75 7.99 9.75 6.75 10.76 4.5 12 4.5zm5 10.56v2.5c-.45.41-.96.77-1.5 1.05v-.68c0-.34-.17-.65-.46-.92-.65-.62-1.89-1.02-3.04-1.02-.96 0-1.96.28-2.65.73l-.17.12-.21.17c.78.47 1.63.72 2.54.82l1.33.15c.37.04.66.36.66.75 0 .29-.16.53-.4.66-.28.15-.64.09-.95.09-.35 0-.69-.01-1.03-.05-.5-.06-.99-.17-1.46-.33-.49-.16-.97-.38-1.42-.64-.22-.13-.44-.27-.65-.43l-.31-.24c-.04-.02-.28-.18-.28-.23v-4.28c0-1.58 2.63-2.78 5-2.78s5 1.2 5 2.78v1.78z"/></g>
<g id="account-circle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z"/></g>
<g id="add"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></g>
<g id="add-box"><path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></g>
<g id="add-circle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></g>
<g id="add-circle-outline"><path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></g>
<g id="add-shopping-cart"><path d="M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z"/></g>
<g id="alarm"><path d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12.5 8H11v6l4.75 2.85.75-1.23-4-2.37V8zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"/></g>
<g id="alarm-add"><path d="M7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7zm1-11h-2v3H8v2h3v3h2v-3h3v-2h-3V9z"/></g>
<g id="alarm-off"><path d="M12 6c3.87 0 7 3.13 7 7 0 .84-.16 1.65-.43 2.4l1.52 1.52c.58-1.19.91-2.51.91-3.92 0-4.97-4.03-9-9-9-1.41 0-2.73.33-3.92.91L9.6 6.43C10.35 6.16 11.16 6 12 6zm10-.28l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM2.92 2.29L1.65 3.57 2.98 4.9l-1.11.93 1.42 1.42 1.11-.94.8.8C3.83 8.69 3 10.75 3 13c0 4.97 4.02 9 9 9 2.25 0 4.31-.83 5.89-2.2l2.2 2.2 1.27-1.27L3.89 3.27l-.97-.98zm13.55 16.1C15.26 19.39 13.7 20 12 20c-3.87 0-7-3.13-7-7 0-1.7.61-3.26 1.61-4.47l9.86 9.86zM8.02 3.28L6.6 1.86l-.86.71 1.42 1.42.86-.71z"/></g>
<g id="alarm-on"><path d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7zm-1.46-5.47L8.41 12.4l-1.06 1.06 3.18 3.18 6-6-1.06-1.06-4.93 4.95z"/></g>
<g id="android"><path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/></g>
<g id="announcement"><path d="M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-7 9h-2V5h2v6zm0 4h-2v-2h2v2z"/></g>
<g id="apps"><path d="M4 8h4V4H4v4zm6 12h4v-4h-4v4zm-6 0h4v-4H4v4zm0-6h4v-4H4v4zm6 0h4v-4h-4v4zm6-10v4h4V4h-4zm-6 4h4V4h-4v4zm6 6h4v-4h-4v4zm0 6h4v-4h-4v4z"/></g>
<g id="archive"><path d="M20.54 5.23l-1.39-1.68C18.88 3.21 18.47 3 18 3H6c-.47 0-.88.21-1.16.55L3.46 5.23C3.17 5.57 3 6.02 3 6.5V19c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6.5c0-.48-.17-.93-.46-1.27zM12 17.5L6.5 12H10v-2h4v2h3.5L12 17.5zM5.12 5l.81-1h12l.94 1H5.12z"/></g>
<g id="arrow-back"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></g>
<g id="arrow-drop-down"><path d="M7 10l5 5 5-5z"/></g>
<g id="arrow-drop-down-circle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 12l-4-4h8l-4 4z"/></g>
<g id="arrow-drop-up"><path d="M7 14l5-5 5 5z"/></g>
</defs></svg>

After

Width:  |  Height:  |  Size: 6.9 KiB

View File

@ -0,0 +1,26 @@
<svg><defs>
<g id="cake"><path d="M12 6c1.11 0 2-.9 2-2 0-.38-.1-.73-.29-1.03L12 0l-1.71 2.97c-.19.3-.29.65-.29 1.03 0 1.1.9 2 2 2zm4.6 9.99l-1.07-1.07-1.08 1.07c-1.3 1.3-3.58 1.31-4.89 0l-1.07-1.07-1.09 1.07C6.75 16.64 5.88 17 4.96 17c-.73 0-1.4-.23-1.96-.61V21c0 .55.45 1 1 1h16c.55 0 1-.45 1-1v-4.61c-.56.38-1.23.61-1.96.61-.92 0-1.79-.36-2.44-1.01zM18 9h-5V7h-2v2H6c-1.66 0-3 1.34-3 3v1.54c0 1.08.88 1.96 1.96 1.96.52 0 1.02-.2 1.38-.57l2.14-2.13 2.13 2.13c.74.74 2.03.74 2.77 0l2.14-2.13 2.13 2.13c.37.37.86.57 1.38.57 1.08 0 1.96-.88 1.96-1.96V12C21 10.34 19.66 9 18 9z"/></g>
<g id="domain"><path d="M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z"/></g>
<g id="group"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></g>
<g id="group-add"><path d="M8 10H5V7H3v3H0v2h3v3h2v-3h3v-2zm10 1c1.66 0 2.99-1.34 2.99-3S19.66 5 18 5c-.32 0-.63.05-.91.14.57.81.9 1.79.9 2.86s-.34 2.04-.9 2.86c.28.09.59.14.91.14zm-5 0c1.66 0 2.99-1.34 2.99-3S14.66 5 13 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm6.62 2.16c.83.73 1.38 1.66 1.38 2.84v2h3v-2c0-1.54-2.37-2.49-4.38-2.84zM13 13c-2 0-6 1-6 3v2h12v-2c0-2-4-3-6-3z"/></g>
<g id="location-city"><path d="M15 11V5l-3-3-3 3v2H3v14h18V11h-6zm-8 8H5v-2h2v2zm0-4H5v-2h2v2zm0-4H5V9h2v2zm6 8h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2V9h2v2zm0-4h-2V5h2v2zm6 12h-2v-2h2v2zm0-4h-2v-2h2v2z"/></g>
<g id="mood"><path d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm3.5-9c.83 0 1.5-.67 1.5-1.5S16.33 8 15.5 8 14 8.67 14 9.5s.67 1.5 1.5 1.5zm-7 0c.83 0 1.5-.67 1.5-1.5S9.33 8 8.5 8 7 8.67 7 9.5 7.67 11 8.5 11zm3.5 6.5c2.33 0 4.31-1.46 5.11-3.5H6.89c.8 2.04 2.78 3.5 5.11 3.5z"/></g>
<g id="notifications"><path d="M11.5 22c1.1 0 2-.9 2-2h-4c0 1.1.9 2 2 2zm6.5-6v-5.5c0-3.07-2.13-5.64-5-6.32V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5v.68c-2.87.68-5 3.25-5 6.32V16l-2 2v1h17v-1l-2-2z"/></g>
<g id="notifications-none"><path d="M11.5 22c1.1 0 2-.9 2-2h-4c0 1.1.9 2 2 2zm6.5-6v-5.5c0-3.07-2.13-5.64-5-6.32V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5v.68c-2.87.68-5 3.25-5 6.32V16l-2 2v1h17v-1l-2-2zm-2 1H7v-6.5C7 8.01 9.01 6 11.5 6S16 8.01 16 10.5V17z"/></g>
<g id="notifications-off"><path d="M11.5 22c1.1 0 2-.9 2-2h-4c0 1.1.9 2 2 2zM18 10.5c0-3.07-2.13-5.64-5-6.32V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5v.68c-.51.12-.99.32-1.45.56L18 14.18V10.5zm-.27 8.5l2 2L21 19.73 4.27 3 3 4.27l2.92 2.92C5.34 8.16 5 9.29 5 10.5V16l-2 2v1h14.73z"/></g>
<g id="notifications-on"><path d="M6.58 3.58L5.15 2.15C2.76 3.97 1.18 6.8 1.03 10h2c.15-2.65 1.51-4.97 3.55-6.42zM19.97 10h2c-.15-3.2-1.73-6.03-4.13-7.85l-1.43 1.43c2.05 1.45 3.41 3.77 3.56 6.42zm-1.97.5c0-3.07-2.13-5.64-5-6.32V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5v.68c-2.87.68-5 3.25-5 6.32V16l-2 2v1h17v-1l-2-2v-5.5zM11.5 22c.14 0 .27-.01.4-.04.65-.13 1.19-.58 1.44-1.18.1-.24.16-.5.16-.78h-4c0 1.1.9 2 2 2z"/></g>
<g id="notifications-paused"><path d="M11.5 22c1.1 0 2-.9 2-2h-4c0 1.1.9 2 2 2zm6.5-6v-5.5c0-3.07-2.13-5.64-5-6.32V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5v.68c-2.87.68-5 3.25-5 6.32V16l-2 2v1h17v-1l-2-2zm-4-6.2l-2.8 3.4H14V15H9v-1.8l2.8-3.4H9V8h5v1.8z"/></g>
<g id="pages"><path d="M3 5v6h5L7 7l4 1V3H5c-1.1 0-2 .9-2 2zm5 8H3v6c0 1.1.9 2 2 2h6v-5l-4 1 1-4zm9 4l-4-1v5h6c1.1 0 2-.9 2-2v-6h-5l1 4zm2-14h-6v5l4-1-1 4h5V5c0-1.1-.9-2-2-2z"/></g>
<g id="party-mode"><path d="M20 4h-3.17L15 2H9L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-8 3c1.63 0 3.06.79 3.98 2H12c-1.66 0-3 1.34-3 3 0 .35.07.69.18 1H7.1c-.06-.32-.1-.66-.1-1 0-2.76 2.24-5 5-5zm0 10c-1.63 0-3.06-.79-3.98-2H12c1.66 0 3-1.34 3-3 0-.35-.07-.69-.18-1h2.08c.07.32.1.66.1 1 0 2.76-2.24 5-5 5z"/></g>
<g id="people"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></g>
<g id="people-outline"><path d="M16.5 13c-1.2 0-3.07.34-4.5 1-1.43-.67-3.3-1-4.5-1C5.33 13 1 14.08 1 16.25V19h22v-2.75c0-2.17-4.33-3.25-6.5-3.25zm-4 4.5h-10v-1.25c0-.54 2.56-1.75 5-1.75s5 1.21 5 1.75v1.25zm9 0H14v-1.25c0-.46-.2-.86-.52-1.22.88-.3 1.96-.53 3.02-.53 2.44 0 5 1.21 5 1.75v1.25zM7.5 12c1.93 0 3.5-1.57 3.5-3.5S9.43 5 7.5 5 4 6.57 4 8.5 5.57 12 7.5 12zm0-5.5c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm9 5.5c1.93 0 3.5-1.57 3.5-3.5S18.43 5 16.5 5 13 6.57 13 8.5s1.57 3.5 3.5 3.5zm0-5.5c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"/></g>
<g id="person"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></g>
<g id="person-add"><path d="M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm-9-2V7H4v3H1v2h3v3h2v-3h3v-2H6zm9 4c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></g>
<g id="person-outline"><path d="M12 5.9c1.16 0 2.1.94 2.1 2.1s-.94 2.1-2.1 2.1S9.9 9.16 9.9 8s.94-2.1 2.1-2.1m0 9c2.97 0 6.1 1.46 6.1 2.1v1.1H5.9V17c0-.64 3.13-2.1 6.1-2.1M12 4C9.79 4 8 5.79 8 8s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 9c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4z"/></g>
<g id="plus-one"><path d="M10 8H8v4H4v2h4v4h2v-4h4v-2h-4zm4.5-1.92V7.9l2.5-.5V18h2V5z"/></g>
<g id="poll"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z"/></g>
<g id="public"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z"/></g>
<g id="school"><path d="M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z"/></g>
<g id="share"><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92s-1.31-2.92-2.92-2.92z"/></g>
<g id="whatshot"><path d="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14c0 4.42 3.58 8 8 8s8-3.58 8-8C20 8.61 17.41 3.8 13.5.67zM11.71 19c-1.78 0-3.22-1.4-3.22-3.14 0-1.62 1.05-2.76 2.81-3.12 1.77-.36 3.6-1.21 4.62-2.58.39 1.29.59 2.65.59 4.04 0 2.65-2.15 4.8-4.8 4.8z"/></g>
</defs></svg>

After

Width:  |  Height:  |  Size: 6.8 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="addShoppingCart"><g id="add-shopping-cart"><path d="M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z"/></g></svg>

After

Width:  |  Height:  |  Size: 503 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="android"><path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/></g></svg>

After

Width:  |  Height:  |  Size: 665 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="cake"><path d="M12 6c1.11 0 2-.9 2-2 0-.38-.1-.73-.29-1.03L12 0l-1.71 2.97c-.19.3-.29.65-.29 1.03 0 1.1.9 2 2 2zm4.6 9.99l-1.07-1.07-1.08 1.07c-1.3 1.3-3.58 1.31-4.89 0l-1.07-1.07-1.09 1.07C6.75 16.64 5.88 17 4.96 17c-.73 0-1.4-.23-1.96-.61V21c0 .55.45 1 1 1h16c.55 0 1-.45 1-1v-4.61c-.56.38-1.23.61-1.96.61-.92 0-1.79-.36-2.44-1.01zM18 9h-5V7h-2v2H6c-1.66 0-3 1.34-3 3v1.54c0 1.08.88 1.96 1.96 1.96.52 0 1.02-.2 1.38-.57l2.14-2.13 2.13 2.13c.74.74 2.03.74 2.77 0l2.14-2.13 2.13 2.13c.37.37.86.57 1.38.57 1.08 0 1.96-.88 1.96-1.96V12C21 10.34 19.66 9 18 9z"/></g></svg>

After

Width:  |  Height:  |  Size: 636 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="android"><path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/></g></svg>

After

Width:  |  Height:  |  Size: 665 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g id="cake"><path d="M12 6c1.11 0 2-.9 2-2 0-.38-.1-.73-.29-1.03L12 0l-1.71 2.97c-.19.3-.29.65-.29 1.03 0 1.1.9 2 2 2zm4.6 9.99l-1.07-1.07-1.08 1.07c-1.3 1.3-3.58 1.31-4.89 0l-1.07-1.07-1.09 1.07C6.75 16.64 5.88 17 4.96 17c-.73 0-1.4-.23-1.96-.61V21c0 .55.45 1 1 1h16c.55 0 1-.45 1-1v-4.61c-.56.38-1.23.61-1.96.61-.92 0-1.79-.36-2.44-1.01zM18 9h-5V7h-2v2H6c-1.66 0-3 1.34-3 3v1.54c0 1.08.88 1.96 1.96 1.96.52 0 1.02-.2 1.38-.57l2.14-2.13 2.13 2.13c.74.74 2.03.74 2.77 0l2.14-2.13 2.13 2.13c.37.37.86.57 1.38.57 1.08 0 1.96-.88 1.96-1.96V12C21 10.34 19.66 9 18 9z"/></g></svg>

After

Width:  |  Height:  |  Size: 636 B

View File

@ -0,0 +1,26 @@
<svg><defs>
<g id="3d-rotation"><path d="M7.52 21.48C4.25 19.94 1.91 16.76 1.55 13H.05C.56 19.16 5.71 24 12 24l.66-.03-3.81-3.81-1.33 1.32zm.89-6.52c-.19 0-.37-.03-.52-.08-.16-.06-.29-.13-.4-.24-.11-.1-.2-.22-.26-.37-.06-.14-.09-.3-.09-.47h-1.3c0 .36.07.68.21.95.14.27.33.5.56.69.24.18.51.32.82.41.3.1.62.15.96.15.37 0 .72-.05 1.03-.15.32-.1.6-.25.83-.44s.42-.43.55-.72c.13-.29.2-.61.2-.97 0-.19-.02-.38-.07-.56-.05-.18-.12-.35-.23-.51-.1-.16-.24-.3-.4-.43-.17-.13-.37-.23-.61-.31.2-.09.37-.2.52-.33.15-.13.27-.27.37-.42.1-.15.17-.3.22-.46.05-.16.07-.32.07-.48 0-.36-.06-.68-.18-.96-.12-.28-.29-.51-.51-.69-.2-.19-.47-.33-.77-.43C9.1 8.05 8.76 8 8.39 8c-.36 0-.69.05-1 .16-.3.11-.57.26-.79.45-.21.19-.38.41-.51.67-.12.26-.18.54-.18.85h1.3c0-.17.03-.32.09-.45s.14-.25.25-.34c.11-.09.23-.17.38-.22.15-.05.3-.08.48-.08.4 0 .7.1.89.31.19.2.29.49.29.86 0 .18-.03.34-.08.49-.05.15-.14.27-.25.37-.11.1-.25.18-.41.24-.16.06-.36.09-.58.09H7.5v1.03h.77c.22 0 .42.02.6.07s.33.13.45.23c.12.11.22.24.29.4.07.16.1.35.1.57 0 .41-.12.72-.35.93-.23.23-.55.33-.95.33zm8.55-5.92c-.32-.33-.7-.59-1.14-.77-.43-.18-.92-.27-1.46-.27H12v8h2.3c.55 0 1.06-.09 1.51-.27.45-.18.84-.43 1.16-.76.32-.33.57-.73.74-1.19.17-.47.26-.99.26-1.57v-.4c0-.58-.09-1.1-.26-1.57-.18-.47-.43-.87-.75-1.2zm-.39 3.16c0 .42-.05.79-.14 1.13-.1.33-.24.62-.43.85-.19.23-.43.41-.71.53-.29.12-.62.18-.99.18h-.91V9.12h.97c.72 0 1.27.23 1.64.69.38.46.57 1.12.57 1.99v.4zM12 0l-.66.03 3.81 3.81 1.33-1.33c3.27 1.55 5.61 4.72 5.96 8.48h1.5C23.44 4.84 18.29 0 12 0z"/></g>
<g id="accessibility"><path d="M12 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm9 7h-6v13h-2v-6h-2v6H9V9H3V7h18v2z"/></g>
<g id="account-balance"><path d="M4 10v7h3v-7H4zm6 0v7h3v-7h-3zM2 22h19v-3H2v3zm14-12v7h3v-7h-3zm-4.5-9L2 6v2h19V6l-9.5-5z"/></g>
<g id="account-balance-wallet"><path d="M21 18v1c0 1.1-.9 2-2 2H5c-1.11 0-2-.9-2-2V5c0-1.1.89-2 2-2h14c1.1 0 2 .9 2 2v1h-9c-1.11 0-2 .9-2 2v8c0 1.1.89 2 2 2h9zm-9-2h10V8H12v8zm4-2.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z"/></g>
<g id="account-box"><path d="M3 5v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2H5c-1.11 0-2 .9-2 2zm12 4c0 1.66-1.34 3-3 3s-3-1.34-3-3 1.34-3 3-3 3 1.34 3 3zm-9 8c0-2 4-3.1 6-3.1s6 1.1 6 3.1v1H6v-1z"/></g>
<g id="account-child"><circle cx="12" cy="13.49" r="1.5"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 2.5c1.24 0 2.25 1.01 2.25 2.25S13.24 9 12 9 9.75 7.99 9.75 6.75 10.76 4.5 12 4.5zm5 10.56v2.5c-.45.41-.96.77-1.5 1.05v-.68c0-.34-.17-.65-.46-.92-.65-.62-1.89-1.02-3.04-1.02-.96 0-1.96.28-2.65.73l-.17.12-.21.17c.78.47 1.63.72 2.54.82l1.33.15c.37.04.66.36.66.75 0 .29-.16.53-.4.66-.28.15-.64.09-.95.09-.35 0-.69-.01-1.03-.05-.5-.06-.99-.17-1.46-.33-.49-.16-.97-.38-1.42-.64-.22-.13-.44-.27-.65-.43l-.31-.24c-.04-.02-.28-.18-.28-.23v-4.28c0-1.58 2.63-2.78 5-2.78s5 1.2 5 2.78v1.78z"/></g>
<g id="account-circle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z"/></g>
<g id="add"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></g>
<g id="add-box"><path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></g>
<g id="add-circle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></g>
<g id="add-circle-outline"><path d="M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></g>
<g id="add-shopping-cart"><path d="M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z"/></g>
<g id="alarm"><path d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12.5 8H11v6l4.75 2.85.75-1.23-4-2.37V8zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"/></g>
<g id="alarm-add"><path d="M7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7zm1-11h-2v3H8v2h3v3h2v-3h3v-2h-3V9z"/></g>
<g id="alarm-off"><path d="M12 6c3.87 0 7 3.13 7 7 0 .84-.16 1.65-.43 2.4l1.52 1.52c.58-1.19.91-2.51.91-3.92 0-4.97-4.03-9-9-9-1.41 0-2.73.33-3.92.91L9.6 6.43C10.35 6.16 11.16 6 12 6zm10-.28l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM2.92 2.29L1.65 3.57 2.98 4.9l-1.11.93 1.42 1.42 1.11-.94.8.8C3.83 8.69 3 10.75 3 13c0 4.97 4.02 9 9 9 2.25 0 4.31-.83 5.89-2.2l2.2 2.2 1.27-1.27L3.89 3.27l-.97-.98zm13.55 16.1C15.26 19.39 13.7 20 12 20c-3.87 0-7-3.13-7-7 0-1.7.61-3.26 1.61-4.47l9.86 9.86zM8.02 3.28L6.6 1.86l-.86.71 1.42 1.42.86-.71z"/></g>
<g id="alarm-on"><path d="M22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7zm-1.46-5.47L8.41 12.4l-1.06 1.06 3.18 3.18 6-6-1.06-1.06-4.93 4.95z"/></g>
<g id="android"><path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/></g>
<g id="announcement"><path d="M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-7 9h-2V5h2v6zm0 4h-2v-2h2v2z"/></g>
<g id="apps"><path d="M4 8h4V4H4v4zm6 12h4v-4h-4v4zm-6 0h4v-4H4v4zm0-6h4v-4H4v4zm6 0h4v-4h-4v4zm6-10v4h4V4h-4zm-6 4h4V4h-4v4zm6 6h4v-4h-4v4zm0 6h4v-4h-4v4z"/></g>
<g id="archive"><path d="M20.54 5.23l-1.39-1.68C18.88 3.21 18.47 3 18 3H6c-.47 0-.88.21-1.16.55L3.46 5.23C3.17 5.57 3 6.02 3 6.5V19c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6.5c0-.48-.17-.93-.46-1.27zM12 17.5L6.5 12H10v-2h4v2h3.5L12 17.5zM5.12 5l.81-1h12l.94 1H5.12z"/></g>
<g id="arrow-back"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></g>
<g id="arrow-drop-down"><path d="M7 10l5 5 5-5z"/></g>
<g id="arrow-drop-down-circle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 12l-4-4h8l-4 4z"/></g>
<g id="arrow-drop-up"><path d="M7 14l5-5 5 5z"/></g>
</defs></svg>

After

Width:  |  Height:  |  Size: 6.9 KiB

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M20 4h-16c-1.1 0-1.99.9-1.99 2l-.01 12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2v-12c0-1.1-.9-2-2-2zm0 4l-8 5-8-5v-2l8 5 8-5v2z"/>
<path d="M0 0h24v24h-24z" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 269 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/>
<path d="M0 0h24v24h-24z" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 261 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M0 0h24v24h-24z" fill="none"/>
<path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1v3.49c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/>
</svg>

After

Width:  |  Height:  |  Size: 394 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M12 2c-3.87 0-7 3.13-7 7 0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/>
<path d="M0 0h24v24h-24z" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 307 B

View File

@ -0,0 +1,18 @@
.inputIconDemo {
min-height:48px;
}
md-input-container:not(.md-input-invalid) > md-icon.email {
color : green;
}
md-input-container:not(.md-input-invalid) > md-icon.name {
color : dodgerblue;
}
md-input-container.md-input-invalid > md-icon.email,
md-input-container.md-input-invalid > md-icon.name,
{
color : red;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -0,0 +1,13 @@
md-content {
background-color: transparent !important;
md-tabs {
background: #f6f6f6;
border: 1px solid #e1e1e1;
md-tabs-canvas {
background: white;
}
}
h1:first-child {
margin-top: 0;
}
}

View File

@ -0,0 +1,44 @@
md-content {
background-color: transparent !important;
md-tabs {
border: 1px solid #e1e1e1;
md-tab-content {
background: #f6f6f6;
}
md-tabs-canvas {
background: white;
}
}
h1:first-child {
margin-top: 0;
}
}
md-input-container {
padding-bottom: 0;
}
.remove-tab {
margin-bottom: 40px;
}
.demo-tab > div > div {
padding: 25px;
box-sizing: border-box;
}
.edit-form input {
width: 100%;
}
md-tabs {
border-bottom: 1px solid rgba(0,0,0,0.12);
}
md-tab[disabled] {
opacity: 0.5;
}
label {
text-align: left;
}
.long > input {
width: 264px;
}
.md-button.add-tab {
transform: translateY(5px);
}

View File

@ -0,0 +1,25 @@
md-tab-content {
padding: 25px;
&:nth-child(1) {
background-color: #42A5F5;
}
&:nth-child(2) {
background-color: #689F38;
}
&:nth-child(3) {
background-color: #26C6DA;
}
}
.after-tabs-area {
> span {
margin-top:25px;
padding-right: 15px;
vertical-align: middle;
line-height: 30px;
height: 35px;
}
> md-checkbox {
margin-top:26px;
margin-left: 0;
}
}

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M0 0h24v24h-24z" fill="none"/>
<path d="M12 21.35l-1.45-1.32c-5.15-4.67-8.55-7.75-8.55-11.53 0-3.08 2.42-5.5 5.5-5.5 1.74 0 3.41.81 4.5 2.09 1.09-1.28 2.76-2.09 4.5-2.09 3.08 0 5.5 2.42 5.5 5.5 0 3.78-3.4 6.86-8.55 11.54l-1.45 1.31z"/>
</svg>

After

Width:  |  Height:  |  Size: 344 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<path d="M0 0h18v18h-18z" fill="none"/>
<path d="M2 13.5h14v-1.5h-14v1.5zm0-4h14v-1.5h-14v1.5zm0-5.5v1.5h14v-1.5h-14z"/>
</svg>

After

Width:  |  Height:  |  Size: 220 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<path d="M0 0h18v18h-18z" fill="none"/>
<path d="M9 5.5c.83 0 1.5-.67 1.5-1.5s-.67-1.5-1.5-1.5-1.5.67-1.5 1.5.67 1.5 1.5 1.5zm0 2c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0 5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5z"/>
</svg>

After

Width:  |  Height:  |  Size: 378 B

View File

@ -0,0 +1,12 @@
// Should already be required, here for clarity
require('angular');
// Load Angular and dependent libs
require('angular-animate');
require('angular-aria');
// Now load Angular Material
require('./angular-material');
// Export namespace
module.exports = 'ngMaterial';

View File

@ -0,0 +1,24 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-autocomplete.md-THEME_NAME-theme {
background: '{{background-50}}'; }
md-autocomplete.md-THEME_NAME-theme[disabled] {
background: '{{background-100}}'; }
md-autocomplete.md-THEME_NAME-theme button md-icon path {
fill: '{{background-600}}'; }
md-autocomplete.md-THEME_NAME-theme button:after {
background: '{{background-600-0.3}}'; }
.md-autocomplete-suggestions.md-THEME_NAME-theme {
background: '{{background-50}}'; }
.md-autocomplete-suggestions.md-THEME_NAME-theme li {
color: '{{background-900}}'; }
.md-autocomplete-suggestions.md-THEME_NAME-theme li .highlight {
color: '{{background-600}}'; }
.md-autocomplete-suggestions.md-THEME_NAME-theme li:hover, .md-autocomplete-suggestions.md-THEME_NAME-theme li.selected {
background: '{{background-200}}'; }

View File

@ -0,0 +1,222 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
@-webkit-keyframes md-autocomplete-list-out {
0% {
-webkit-animation-timing-function: linear;
animation-timing-function: linear; }
50% {
opacity: 0;
height: 40px;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in; }
100% {
height: 0;
opacity: 0; } }
@keyframes md-autocomplete-list-out {
0% {
-webkit-animation-timing-function: linear;
animation-timing-function: linear; }
50% {
opacity: 0;
height: 40px;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in; }
100% {
height: 0;
opacity: 0; } }
@-webkit-keyframes md-autocomplete-list-in {
0% {
opacity: 0;
height: 0;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out; }
50% {
opacity: 0;
height: 40px; }
100% {
opacity: 1;
height: 40px; } }
@keyframes md-autocomplete-list-in {
0% {
opacity: 0;
height: 0;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out; }
50% {
opacity: 0;
height: 40px; }
100% {
opacity: 1;
height: 40px; } }
md-autocomplete {
border-radius: 2px;
display: block;
height: 40px;
position: relative;
overflow: visible;
min-width: 190px; }
md-autocomplete[disabled] input {
cursor: not-allowed; }
md-autocomplete[md-floating-label] {
padding-bottom: 26px;
border-radius: 0;
background: transparent;
height: auto; }
md-autocomplete[md-floating-label] md-input-container {
padding-bottom: 0; }
md-autocomplete[md-floating-label] md-autocomplete-wrap {
height: auto; }
md-autocomplete[md-floating-label] button {
position: absolute;
top: auto;
bottom: 0;
right: 0;
width: 30px;
height: 30px; }
md-autocomplete md-autocomplete-wrap {
display: block;
position: relative;
overflow: visible;
height: 40px; }
md-autocomplete md-autocomplete-wrap.md-menu-showing {
z-index: 51; }
md-autocomplete md-autocomplete-wrap md-progress-linear[md-mode=indeterminate] {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
transition: none; }
md-autocomplete md-autocomplete-wrap md-progress-linear[md-mode=indeterminate] .md-container {
transition: none;
top: auto;
height: 3px; }
md-autocomplete md-autocomplete-wrap md-progress-linear[md-mode=indeterminate].ng-enter {
transition: opacity 0.15s linear; }
md-autocomplete md-autocomplete-wrap md-progress-linear[md-mode=indeterminate].ng-enter.ng-enter-active {
opacity: 1; }
md-autocomplete md-autocomplete-wrap md-progress-linear[md-mode=indeterminate].ng-leave {
transition: opacity 0.15s linear; }
md-autocomplete md-autocomplete-wrap md-progress-linear[md-mode=indeterminate].ng-leave.ng-leave-active {
opacity: 0; }
md-autocomplete input:not(.md-input) {
width: 100%;
box-sizing: border-box;
border: none;
box-shadow: none;
padding: 0 15px;
font-size: 14px;
line-height: 40px;
height: 40px;
outline: none;
background: transparent; }
md-autocomplete input:not(.md-input)::-ms-clear {
display: none; }
md-autocomplete button {
position: relative;
line-height: 20px;
text-align: center;
width: 30px;
height: 30px;
cursor: pointer;
border: none;
border-radius: 50%;
padding: 0;
font-size: 12px;
background: transparent;
margin: auto 5px; }
md-autocomplete button:after {
content: '';
position: absolute;
top: -6px;
right: -6px;
bottom: -6px;
left: -6px;
border-radius: 50%;
-webkit-transform: scale(0);
transform: scale(0);
opacity: 0;
transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
md-autocomplete button:focus {
outline: none; }
md-autocomplete button:focus:after {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
md-autocomplete button md-icon {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate3d(-50%, -50%, 0) scale(0.9);
transform: translate3d(-50%, -50%, 0) scale(0.9); }
md-autocomplete button md-icon path {
stroke-width: 0; }
md-autocomplete button.ng-enter {
-webkit-transform: scale(0);
transform: scale(0);
transition: -webkit-transform 0.15s ease-out;
transition: transform 0.15s ease-out; }
md-autocomplete button.ng-enter.ng-enter-active {
-webkit-transform: scale(1);
transform: scale(1); }
md-autocomplete button.ng-leave {
transition: -webkit-transform 0.15s ease-out;
transition: transform 0.15s ease-out; }
md-autocomplete button.ng-leave.ng-leave-active {
-webkit-transform: scale(0);
transform: scale(0); }
@media screen and (-ms-high-contrast: active) {
md-autocomplete input {
border: 1px solid #fff; }
md-autocomplete li:focus {
color: #fff; } }
.md-autocomplete-suggestions {
position: absolute;
margin: 0;
list-style: none;
padding: 0;
overflow: auto;
max-height: 225.5px;
z-index: 100; }
.md-autocomplete-suggestions li {
cursor: pointer;
font-size: 14px;
overflow: hidden;
padding: 0 15px;
line-height: 48px;
height: 48px;
transition: background 0.15s linear;
margin: 0;
white-space: nowrap;
text-overflow: ellipsis; }
.md-autocomplete-suggestions li.ng-enter, .md-autocomplete-suggestions li.ng-hide-remove {
transition: none;
-webkit-animation: md-autocomplete-list-in 0.2s;
animation: md-autocomplete-list-in 0.2s; }
.md-autocomplete-suggestions li.ng-leave, .md-autocomplete-suggestions li.ng-hide-add {
transition: none;
-webkit-animation: md-autocomplete-list-out 0.2s;
animation: md-autocomplete-list-out 0.2s; }
.md-autocomplete-suggestions li:focus {
outline: none; }
@media screen and (-ms-high-contrast: active) {
md-autocomplete, .md-autocomplete-suggestions {
border: 1px solid #fff; } }

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,17 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-backdrop {
background-color: '{{background-900-0.0}}'; }
md-backdrop.md-opaque.md-THEME_NAME-theme {
background-color: '{{background-900-0.48}}'; }
md-backdrop.md-opaque.md-THEME_NAME-theme.ng-enter {
background-color: '{{background-900-0.0}}'; }
md-backdrop.md-opaque.md-THEME_NAME-theme.ng-enter.md-opaque.md-THEME_NAME-theme.ng-enter-active {
background-color: '{{background-900-0.48}}'; }
md-backdrop.md-opaque.md-THEME_NAME-theme.ng-leave.md-opaque.md-THEME_NAME-theme.ng-leave-active {
background-color: '{{background-900-0.0}}'; }

View File

@ -0,0 +1,30 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-backdrop {
z-index: 50;
opacity: 1;
transition: background-color 450ms cubic-bezier(0.55, 0, 0.55, 0.2);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0; }
md-backdrop.md-menu-backdrop {
z-index: 98; }
md-backdrop.md-select-backdrop {
z-index: 81; }
md-backdrop.md-dialog-backdrop {
z-index: 79; }
md-backdrop.md-bottom-sheet-backdrop {
z-index: 69; }
md-backdrop.md-sidenav-backdrop {
z-index: 59; }
md-backdrop.md-click-catcher {
position: absolute; }
md-backdrop.md-opaque.ng-leave {
transition: background-color 400ms linear; }

View File

@ -0,0 +1,73 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
goog.provide('ng.material.components.backdrop');
goog.require('ng.material.core');
/*
* @ngdoc module
* @name material.components.backdrop
* @description Backdrop
*/
/**
* @ngdoc directive
* @name mdBackdrop
* @module material.components.backdrop
*
* @restrict E
*
* @description
* `<md-backdrop>` is a backdrop element used by other components, such as dialog and bottom sheet.
* Apply class `opaque` to make the backdrop use the theme backdrop color.
*
*/
angular
.module('material.components.backdrop', ['material.core'])
.directive('mdBackdrop', ["$mdTheming", "$animate", "$rootElement", "$window", "$log", "$$rAF", "$document", function BackdropDirective($mdTheming, $animate, $rootElement, $window, $log, $$rAF, $document) {
var ERROR_CSS_POSITION = "<md-backdrop> may not work properly in a scrolled, static-positioned parent container.";
return {
restrict: 'E',
link: postLink
};
function postLink(scope, element, attrs) {
// If body scrolling has been disabled using mdUtil.disableBodyScroll(),
// adjust the 'backdrop' height to account for the fixed 'body' top offset
var body = $window.getComputedStyle($document[0].body);
if (body.position == 'fixed') {
var hViewport = parseInt(body.height, 10) + Math.abs(parseInt(body.top, 10));
element.css({
height: hViewport + 'px'
});
}
// backdrop may be outside the $rootElement, tell ngAnimate to animate regardless
if ($animate.pin) $animate.pin(element, $rootElement);
$$rAF(function () {
// Often $animate.enter() is used to append the backDrop element
// so let's wait until $animate is done...
var parent = element.parent()[0];
if (parent) {
var styles = $window.getComputedStyle(parent);
if (styles.position == 'static') {
// backdrop uses position:absolute and will not work properly with parent position:static (default)
$log.warn(ERROR_CSS_POSITION);
}
}
$mdTheming.inherit(element, element.parent());
});
}
}]);
ng.material.components.backdrop = angular.module("material.components.backdrop");

View File

@ -0,0 +1,16 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-bottom-sheet.md-THEME_NAME-theme {
background-color: '{{background-50}}';
border-top-color: '{{background-300}}'; }
md-bottom-sheet.md-THEME_NAME-theme.md-list md-list-item {
color: '{{foreground-1}}'; }
md-bottom-sheet.md-THEME_NAME-theme .md-subheader {
background-color: '{{background-50}}'; }
md-bottom-sheet.md-THEME_NAME-theme .md-subheader {
color: '{{foreground-1}}'; }

View File

@ -0,0 +1,170 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-bottom-sheet {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 8px 16px 88px 16px;
z-index: 70;
border-top-width: 1px;
border-top-style: solid;
-webkit-transform: translate3d(0, 80px, 0);
transform: translate3d(0, 80px, 0);
transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition-property: -webkit-transform;
transition-property: transform; }
md-bottom-sheet.md-has-header {
padding-top: 0; }
md-bottom-sheet.ng-enter {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0); }
md-bottom-sheet.ng-enter-active {
opacity: 1;
display: block;
-webkit-transform: translate3d(0, 80px, 0) !important;
transform: translate3d(0, 80px, 0) !important; }
md-bottom-sheet.ng-leave-active {
-webkit-transform: translate3d(0, 100%, 0) !important;
transform: translate3d(0, 100%, 0) !important;
transition: all 0.3s cubic-bezier(0.55, 0, 0.55, 0.2); }
md-bottom-sheet .md-subheader {
background-color: transparent;
font-family: RobotoDraft, Roboto, 'Helvetica Neue', sans-serif;
line-height: 56px;
padding: 0;
white-space: nowrap; }
md-bottom-sheet md-inline-icon {
display: inline-block;
height: 24px;
width: 24px;
fill: #444; }
md-bottom-sheet md-list-item {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
outline: none; }
md-bottom-sheet md-list-item:hover {
cursor: pointer; }
md-bottom-sheet.md-list md-list-item {
padding: 0;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
height: 48px; }
md-bottom-sheet.md-list md-list-item div.md-icon-container {
display: inline-block;
height: 24px;
margin-right: 32px; }
md-bottom-sheet.md-grid {
padding-left: 24px;
padding-right: 24px;
padding-top: 0; }
md-bottom-sheet.md-grid md-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
transition: all 0.5s;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center; }
md-bottom-sheet.md-grid md-list-item {
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
transition: all 0.5s;
height: 96px;
margin-top: 8px;
margin-bottom: 8px;
/* Mixin for how many grid items to show per row */ }
@media screen and (max-width: 600px) {
md-bottom-sheet.md-grid md-list-item {
-webkit-flex: 1 1 33.33333%;
-ms-flex: 1 1 33.33333%;
flex: 1 1 33.33333%;
max-width: 33.33333%; }
md-bottom-sheet.md-grid md-list-item:nth-of-type(3n+1) {
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start; }
md-bottom-sheet.md-grid md-list-item:nth-of-type(3n) {
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end; } }
@media screen and (min-width: 600px) and (max-width: 960px) {
md-bottom-sheet.md-grid md-list-item {
-webkit-flex: 1 1 25%;
-ms-flex: 1 1 25%;
flex: 1 1 25%;
max-width: 25%; } }
@media screen and (min-width: 960px) and (max-width: 1200px) {
md-bottom-sheet.md-grid md-list-item {
-webkit-flex: 1 1 16.66667%;
-ms-flex: 1 1 16.66667%;
flex: 1 1 16.66667%;
max-width: 16.66667%; } }
@media screen and (min-width: 1200px) {
md-bottom-sheet.md-grid md-list-item {
-webkit-flex: 1 1 14.28571%;
-ms-flex: 1 1 14.28571%;
flex: 1 1 14.28571%;
max-width: 14.28571%; } }
md-bottom-sheet.md-grid md-list-item .md-list-item-content {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
width: 48px;
padding-bottom: 16px; }
md-bottom-sheet.md-grid md-list-item .md-grid-item-content {
border: 1px solid transparent;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
width: 80px; }
md-bottom-sheet.md-grid md-list-item .md-icon-container {
display: inline-block;
box-sizing: border-box;
height: 48px;
width: 48px;
margin: 0 0; }
md-bottom-sheet.md-grid md-list-item .md-grid-text {
font-weight: 400;
line-height: 16px;
font-size: 13px;
margin: 0;
white-space: nowrap;
width: 64px;
text-align: center;
text-transform: none;
padding-top: 8px; }
@media screen and (-ms-high-contrast: active) {
md-bottom-sheet {
border: 1px solid #fff; } }

View File

@ -0,0 +1,267 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
goog.provide('ng.material.components.bottomSheet');
goog.require('ng.material.components.backdrop');
goog.require('ng.material.core');
/**
* @ngdoc module
* @name material.components.bottomSheet
* @description
* BottomSheet
*/
angular.module('material.components.bottomSheet', [
'material.core',
'material.components.backdrop'
])
.directive('mdBottomSheet', MdBottomSheetDirective)
.provider('$mdBottomSheet', MdBottomSheetProvider);
function MdBottomSheetDirective() {
return {
restrict: 'E'
};
}
/**
* @ngdoc service
* @name $mdBottomSheet
* @module material.components.bottomSheet
*
* @description
* `$mdBottomSheet` opens a bottom sheet over the app and provides a simple promise API.
*
* ## Restrictions
*
* - The bottom sheet's template must have an outer `<md-bottom-sheet>` element.
* - Add the `md-grid` class to the bottom sheet for a grid layout.
* - Add the `md-list` class to the bottom sheet for a list layout.
*
* @usage
* <hljs lang="html">
* <div ng-controller="MyController">
* <md-button ng-click="openBottomSheet()">
* Open a Bottom Sheet!
* </md-button>
* </div>
* </hljs>
* <hljs lang="js">
* var app = angular.module('app', ['ngMaterial']);
* app.controller('MyController', function($scope, $mdBottomSheet) {
* $scope.openBottomSheet = function() {
* $mdBottomSheet.show({
* template: '<md-bottom-sheet>Hello!</md-bottom-sheet>'
* });
* };
* });
* </hljs>
*/
/**
* @ngdoc method
* @name $mdBottomSheet#show
*
* @description
* Show a bottom sheet with the specified options.
*
* @param {object} options An options object, with the following properties:
*
* - `templateUrl` - `{string=}`: The url of an html template file that will
* be used as the content of the bottom sheet. Restrictions: the template must
* have an outer `md-bottom-sheet` element.
* - `template` - `{string=}`: Same as templateUrl, except this is an actual
* template string.
* - `scope` - `{object=}`: the scope to link the template / controller to. If none is specified, it will create a new child scope.
* This scope will be destroyed when the bottom sheet is removed unless `preserveScope` is set to true.
* - `preserveScope` - `{boolean=}`: whether to preserve the scope when the element is removed. Default is false
* - `controller` - `{string=}`: The controller to associate with this bottom sheet.
* - `locals` - `{string=}`: An object containing key/value pairs. The keys will
* be used as names of values to inject into the controller. For example,
* `locals: {three: 3}` would inject `three` into the controller with the value
* of 3.
* - `targetEvent` - `{DOMClickEvent=}`: A click's event object. When passed in as an option,
* the location of the click will be used as the starting point for the opening animation
* of the the dialog.
* - `resolve` - `{object=}`: Similar to locals, except it takes promises as values
* and the bottom sheet will not open until the promises resolve.
* - `controllerAs` - `{string=}`: An alias to assign the controller to on the scope.
* - `parent` - `{element=}`: The element to append the bottom sheet to. The `parent` may be a `function`, `string`,
* `object`, or null. Defaults to appending to the body of the root element (or the root element) of the application.
* e.g. angular.element(document.getElementById('content')) or "#content"
* - `disableParentScroll` - `{boolean=}`: Whether to disable scrolling while the bottom sheet is open.
* Default true.
*
* @returns {promise} A promise that can be resolved with `$mdBottomSheet.hide()` or
* rejected with `$mdBottomSheet.cancel()`.
*/
/**
* @ngdoc method
* @name $mdBottomSheet#hide
*
* @description
* Hide the existing bottom sheet and resolve the promise returned from
* `$mdBottomSheet.show()`. This call will close the most recently opened/current bottomsheet (if any).
*
* @param {*=} response An argument for the resolved promise.
*
*/
/**
* @ngdoc method
* @name $mdBottomSheet#cancel
*
* @description
* Hide the existing bottom sheet and reject the promise returned from
* `$mdBottomSheet.show()`.
*
* @param {*=} response An argument for the rejected promise.
*
*/
function MdBottomSheetProvider($$interimElementProvider) {
// how fast we need to flick down to close the sheet, pixels/ms
var CLOSING_VELOCITY = 0.5;
var PADDING = 80; // same as css
bottomSheetDefaults.$inject = ["$animate", "$mdConstant", "$mdUtil", "$mdTheming", "$mdBottomSheet", "$rootElement", "$mdGesture"];
return $$interimElementProvider('$mdBottomSheet')
.setDefaults({
methods: ['disableParentScroll', 'escapeToClose', 'targetEvent'],
options: bottomSheetDefaults
});
/* ngInject */
function bottomSheetDefaults($animate, $mdConstant, $mdUtil, $mdTheming, $mdBottomSheet, $rootElement, $mdGesture) {
var backdrop;
return {
themable: true,
targetEvent: null,
onShow: onShow,
onRemove: onRemove,
escapeToClose: true,
disableParentScroll: true
};
function onShow(scope, element, options) {
element = $mdUtil.extractElementByName(element, 'md-bottom-sheet');
// Add a backdrop that will close on click
backdrop = $mdUtil.createBackdrop(scope, "md-bottom-sheet-backdrop md-opaque");
backdrop.on('click', function() {
$mdUtil.nextTick($mdBottomSheet.cancel,true);
});
$mdTheming.inherit(backdrop, options.parent);
$animate.enter(backdrop, options.parent, null);
var bottomSheet = new BottomSheet(element, options.parent);
options.bottomSheet = bottomSheet;
// Give up focus on calling item
options.targetEvent && angular.element(options.targetEvent.target).blur();
$mdTheming.inherit(bottomSheet.element, options.parent);
if (options.disableParentScroll) {
options.lastOverflow = options.parent.css('overflow');
options.parent.css('overflow', 'hidden');
}
return $animate.enter(bottomSheet.element, options.parent)
.then(function() {
var focusable = angular.element(
element[0].querySelector('button') ||
element[0].querySelector('a') ||
element[0].querySelector('[ng-click]')
);
focusable.focus();
if (options.escapeToClose) {
options.rootElementKeyupCallback = function(e) {
if (e.keyCode === $mdConstant.KEY_CODE.ESCAPE) {
$mdUtil.nextTick($mdBottomSheet.cancel,true);
}
};
$rootElement.on('keyup', options.rootElementKeyupCallback);
}
});
}
function onRemove(scope, element, options) {
var bottomSheet = options.bottomSheet;
$animate.leave(backdrop);
return $animate.leave(bottomSheet.element).then(function() {
if (options.disableParentScroll) {
options.parent.css('overflow', options.lastOverflow);
delete options.lastOverflow;
}
bottomSheet.cleanup();
// Restore focus
options.targetEvent && angular.element(options.targetEvent.target).focus();
});
}
/**
* BottomSheet class to apply bottom-sheet behavior to an element
*/
function BottomSheet(element, parent) {
var deregister = $mdGesture.register(parent, 'drag', { horizontal: false });
parent.on('$md.dragstart', onDragStart)
.on('$md.drag', onDrag)
.on('$md.dragend', onDragEnd);
return {
element: element,
cleanup: function cleanup() {
deregister();
parent.off('$md.dragstart', onDragStart)
.off('$md.drag', onDrag)
.off('$md.dragend', onDragEnd);
}
};
function onDragStart(ev) {
// Disable transitions on transform so that it feels fast
element.css($mdConstant.CSS.TRANSITION_DURATION, '0ms');
}
function onDrag(ev) {
var transform = ev.pointer.distanceY;
if (transform < 5) {
// Slow down drag when trying to drag up, and stop after PADDING
transform = Math.max(-PADDING, transform / 2);
}
element.css($mdConstant.CSS.TRANSFORM, 'translate3d(0,' + (PADDING + transform) + 'px,0)');
}
function onDragEnd(ev) {
if (ev.pointer.distanceY > 0 &&
(ev.pointer.distanceY > 20 || Math.abs(ev.pointer.velocityY) > CLOSING_VELOCITY)) {
var distanceRemaining = element.prop('offsetHeight') - ev.pointer.distanceY;
var transitionDuration = Math.min(distanceRemaining / ev.pointer.velocityY * 0.75, 500);
element.css($mdConstant.CSS.TRANSITION_DURATION, transitionDuration + 'ms');
$mdUtil.nextTick($mdBottomSheet.cancel,true);
} else {
element.css($mdConstant.CSS.TRANSITION_DURATION, '');
element.css($mdConstant.CSS.TRANSFORM, '');
}
}
}
}
}
MdBottomSheetProvider.$inject = ["$$interimElementProvider"];
ng.material.components.bottomSheet = angular.module("material.components.bottomSheet");

View File

@ -0,0 +1,94 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
a.md-button.md-THEME_NAME-theme, .md-button.md-THEME_NAME-theme {
border-radius: 3px; }
a.md-button.md-THEME_NAME-theme:not([disabled]):hover, .md-button.md-THEME_NAME-theme:not([disabled]):hover {
background-color: '{{background-500-0.2}}'; }
a.md-button.md-THEME_NAME-theme:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme:not([disabled]).md-focused {
background-color: '{{background-500-0.2}}'; }
a.md-button.md-THEME_NAME-theme:not([disabled]).md-icon-button:hover, .md-button.md-THEME_NAME-theme:not([disabled]).md-icon-button:hover {
background-color: transparent; }
a.md-button.md-THEME_NAME-theme.md-fab, .md-button.md-THEME_NAME-theme.md-fab {
border-radius: 50%;
background-color: '{{accent-color}}';
color: '{{accent-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-fab md-icon, .md-button.md-THEME_NAME-theme.md-fab md-icon {
color: '{{accent-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-fab:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-fab:not([disabled]):hover {
background-color: '{{accent-color}}'; }
a.md-button.md-THEME_NAME-theme.md-fab:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-fab:not([disabled]).md-focused {
background-color: '{{accent-A700}}'; }
a.md-button.md-THEME_NAME-theme.md-icon-button, .md-button.md-THEME_NAME-theme.md-icon-button {
border-radius: 50%; }
a.md-button.md-THEME_NAME-theme.md-primary, .md-button.md-THEME_NAME-theme.md-primary {
color: '{{primary-color}}'; }
a.md-button.md-THEME_NAME-theme.md-primary.md-raised, a.md-button.md-THEME_NAME-theme.md-primary.md-fab, .md-button.md-THEME_NAME-theme.md-primary.md-raised, .md-button.md-THEME_NAME-theme.md-primary.md-fab {
color: '{{primary-contrast}}';
background-color: '{{primary-color}}'; }
a.md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]) md-icon, a.md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]) md-icon {
color: '{{primary-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]):hover, a.md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]):hover {
background-color: '{{primary-color}}'; }
a.md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]).md-focused, a.md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]).md-focused {
background-color: '{{primary-600}}'; }
a.md-button.md-THEME_NAME-theme.md-primary:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-primary:not([disabled]) md-icon {
color: '{{primary-color}}'; }
a.md-button.md-THEME_NAME-theme.md-fab, .md-button.md-THEME_NAME-theme.md-fab {
border-radius: 50%;
background-color: '{{accent-color}}';
color: '{{accent-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-fab:not([disabled]) .md-icon, .md-button.md-THEME_NAME-theme.md-fab:not([disabled]) .md-icon {
color: '{{accent-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-fab:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-fab:not([disabled]):hover {
background-color: '{{accent-color}}'; }
a.md-button.md-THEME_NAME-theme.md-fab:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-fab:not([disabled]).md-focused {
background-color: '{{accent-A700}}'; }
a.md-button.md-THEME_NAME-theme.md-raised, .md-button.md-THEME_NAME-theme.md-raised {
color: '{{background-contrast}}';
background-color: '{{background-50}}'; }
a.md-button.md-THEME_NAME-theme.md-raised:not([disabled]) .md-icon, .md-button.md-THEME_NAME-theme.md-raised:not([disabled]) .md-icon {
color: '{{background-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-raised:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-raised:not([disabled]):hover {
background-color: '{{background-50}}'; }
a.md-button.md-THEME_NAME-theme.md-raised:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-raised:not([disabled]).md-focused {
background-color: '{{background-200}}'; }
a.md-button.md-THEME_NAME-theme.md-warn, .md-button.md-THEME_NAME-theme.md-warn {
color: '{{warn-color}}'; }
a.md-button.md-THEME_NAME-theme.md-warn.md-raised, a.md-button.md-THEME_NAME-theme.md-warn.md-fab, .md-button.md-THEME_NAME-theme.md-warn.md-raised, .md-button.md-THEME_NAME-theme.md-warn.md-fab {
color: '{{warn-contrast}}';
background-color: '{{warn-color}}'; }
a.md-button.md-THEME_NAME-theme.md-warn.md-raised:not([disabled]) md-icon, a.md-button.md-THEME_NAME-theme.md-warn.md-fab:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-warn.md-raised:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-warn.md-fab:not([disabled]) md-icon {
color: '{{warn-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-warn.md-raised:not([disabled]):hover, a.md-button.md-THEME_NAME-theme.md-warn.md-fab:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-warn.md-raised:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-warn.md-fab:not([disabled]):hover {
background-color: '{{warn-color}}'; }
a.md-button.md-THEME_NAME-theme.md-warn.md-raised:not([disabled]).md-focused, a.md-button.md-THEME_NAME-theme.md-warn.md-fab:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-warn.md-raised:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-warn.md-fab:not([disabled]).md-focused {
background-color: '{{warn-700}}'; }
a.md-button.md-THEME_NAME-theme.md-warn:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-warn:not([disabled]) md-icon {
color: '{{warn-color}}'; }
a.md-button.md-THEME_NAME-theme.md-accent, .md-button.md-THEME_NAME-theme.md-accent {
color: '{{accent-color}}'; }
a.md-button.md-THEME_NAME-theme.md-accent.md-raised, a.md-button.md-THEME_NAME-theme.md-accent.md-fab, .md-button.md-THEME_NAME-theme.md-accent.md-raised, .md-button.md-THEME_NAME-theme.md-accent.md-fab {
color: '{{accent-contrast}}';
background-color: '{{accent-color}}'; }
a.md-button.md-THEME_NAME-theme.md-accent.md-raised:not([disabled]) md-icon, a.md-button.md-THEME_NAME-theme.md-accent.md-fab:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-accent.md-raised:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-accent.md-fab:not([disabled]) md-icon {
color: '{{accent-contrast}}'; }
a.md-button.md-THEME_NAME-theme.md-accent.md-raised:not([disabled]):hover, a.md-button.md-THEME_NAME-theme.md-accent.md-fab:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-accent.md-raised:not([disabled]):hover, .md-button.md-THEME_NAME-theme.md-accent.md-fab:not([disabled]):hover {
background-color: '{{accent-color}}'; }
a.md-button.md-THEME_NAME-theme.md-accent.md-raised:not([disabled]).md-focused, a.md-button.md-THEME_NAME-theme.md-accent.md-fab:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-accent.md-raised:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-accent.md-fab:not([disabled]).md-focused {
background-color: '{{accent-700}}'; }
a.md-button.md-THEME_NAME-theme.md-accent:not([disabled]) md-icon, .md-button.md-THEME_NAME-theme.md-accent:not([disabled]) md-icon {
color: '{{accent-color}}'; }
a.md-button.md-THEME_NAME-theme[disabled], a.md-button.md-THEME_NAME-theme.md-raised[disabled], a.md-button.md-THEME_NAME-theme.md-fab[disabled], a.md-button.md-THEME_NAME-theme.md-accent[disabled], a.md-button.md-THEME_NAME-theme.md-warn[disabled], .md-button.md-THEME_NAME-theme[disabled], .md-button.md-THEME_NAME-theme.md-raised[disabled], .md-button.md-THEME_NAME-theme.md-fab[disabled], .md-button.md-THEME_NAME-theme.md-accent[disabled], .md-button.md-THEME_NAME-theme.md-warn[disabled] {
color: '{{foreground-3}}';
cursor: not-allowed; }
a.md-button.md-THEME_NAME-theme[disabled] md-icon, a.md-button.md-THEME_NAME-theme.md-raised[disabled] md-icon, a.md-button.md-THEME_NAME-theme.md-fab[disabled] md-icon, a.md-button.md-THEME_NAME-theme.md-accent[disabled] md-icon, a.md-button.md-THEME_NAME-theme.md-warn[disabled] md-icon, .md-button.md-THEME_NAME-theme[disabled] md-icon, .md-button.md-THEME_NAME-theme.md-raised[disabled] md-icon, .md-button.md-THEME_NAME-theme.md-fab[disabled] md-icon, .md-button.md-THEME_NAME-theme.md-accent[disabled] md-icon, .md-button.md-THEME_NAME-theme.md-warn[disabled] md-icon {
color: '{{foreground-3}}'; }
a.md-button.md-THEME_NAME-theme.md-raised[disabled], a.md-button.md-THEME_NAME-theme.md-fab[disabled], .md-button.md-THEME_NAME-theme.md-raised[disabled], .md-button.md-THEME_NAME-theme.md-fab[disabled] {
background-color: '{{foreground-4}}'; }
a.md-button.md-THEME_NAME-theme[disabled], .md-button.md-THEME_NAME-theme[disabled] {
background-color: transparent; }

View File

@ -0,0 +1,166 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
/**
* Position a FAB button.
*/
.md-button {
box-sizing: border-box;
color: currentColor;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: relative;
outline: none;
border: 0;
display: inline-block;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
padding: 0 6px;
margin: 6px 8px;
line-height: 36px;
min-height: 36px;
background: transparent;
white-space: nowrap;
min-width: 88px;
text-align: center;
text-transform: uppercase;
font-weight: 500;
font-size: 14px;
font-style: inherit;
font-variant: inherit;
font-family: inherit;
text-decoration: none;
cursor: pointer;
overflow: hidden;
transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
.md-button *, .md-button *:before, .md-button *:after {
box-sizing: border-box; }
.md-button:focus {
outline: none; }
.md-button:hover, .md-button:focus {
text-decoration: none; }
.md-button.ng-hide, .md-button.ng-leave {
transition: none; }
.md-button.md-cornered {
border-radius: 0; }
.md-button.md-icon {
padding: 0;
background: none; }
.md-button.md-raised:not([disabled]) {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
.md-button.md-icon-button {
margin: 0 6px;
height: 48px;
min-width: 0;
line-height: 48px;
padding-left: 0;
padding-right: 0;
width: 48px;
border-radius: 50%; }
.md-button.md-icon-button .md-ripple-container {
border-radius: 50%;
background-clip: padding-box;
overflow: hidden;
-webkit-mask-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC'); }
.md-button.md-fab {
z-index: 20;
line-height: 56px;
min-width: 0;
width: 56px;
height: 56px;
vertical-align: middle;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
border-radius: 50%;
background-clip: padding-box;
overflow: hidden;
transition: 0.2s linear;
transition-property: background-color, box-shadow; }
.md-button.md-fab.md-fab-bottom-right {
top: auto;
right: 20px;
bottom: 20px;
left: auto;
position: absolute; }
.md-button.md-fab.md-fab-bottom-left {
top: auto;
right: auto;
bottom: 20px;
left: 20px;
position: absolute; }
.md-button.md-fab.md-fab-top-right {
top: 20px;
right: 20px;
bottom: auto;
left: auto;
position: absolute; }
.md-button.md-fab.md-fab-top-left {
top: 20px;
right: auto;
bottom: auto;
left: 20px;
position: absolute; }
.md-button.md-fab .md-ripple-container {
border-radius: 50%;
background-clip: padding-box;
overflow: hidden;
-webkit-mask-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC'); }
.md-button.md-fab.md-mini {
line-height: 40px;
width: 40px;
height: 40px; }
.md-button:not([disabled]).md-raised.md-focused, .md-button:not([disabled]).md-fab.md-focused {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
.md-button:not([disabled]).md-raised:active, .md-button:not([disabled]).md-fab:active {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4); }
.md-toast-open-top .md-button.md-fab-top-left, .md-toast-open-top .md-button.md-fab-top-right {
-webkit-transform: translate3d(0, 42px, 0);
transform: translate3d(0, 42px, 0); }
.md-toast-open-top .md-button.md-fab-top-left:not([disabled]).md-focused, .md-toast-open-top .md-button.md-fab-top-left:not([disabled]):hover, .md-toast-open-top .md-button.md-fab-top-right:not([disabled]).md-focused, .md-toast-open-top .md-button.md-fab-top-right:not([disabled]):hover {
-webkit-transform: translate3d(0, 41px, 0);
transform: translate3d(0, 41px, 0); }
.md-toast-open-bottom .md-button.md-fab-bottom-left, .md-toast-open-bottom .md-button.md-fab-bottom-right {
-webkit-transform: translate3d(0, -42px, 0);
transform: translate3d(0, -42px, 0); }
.md-toast-open-bottom .md-button.md-fab-bottom-left:not([disabled]).md-focused, .md-toast-open-bottom .md-button.md-fab-bottom-left:not([disabled]):hover, .md-toast-open-bottom .md-button.md-fab-bottom-right:not([disabled]).md-focused, .md-toast-open-bottom .md-button.md-fab-bottom-right:not([disabled]):hover {
-webkit-transform: translate3d(0, -43px, 0);
transform: translate3d(0, -43px, 0); }
.md-button-group {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
width: 100%; }
.md-button-group > .md-button {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
display: block;
overflow: hidden;
width: 0;
border-width: 1px 0px 1px 1px;
border-radius: 0;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap; }
.md-button-group > .md-button:first-child {
border-radius: 2px 0px 0px 2px; }
.md-button-group > .md-button:last-child {
border-right-width: 1px;
border-radius: 0px 2px 2px 0px; }
@media screen and (-ms-high-contrast: active) {
.md-button.md-raised, .md-button.md-fab {
border: 1px solid #fff; } }

View File

@ -0,0 +1,135 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
goog.provide('ng.material.components.button');
goog.require('ng.material.core');
/**
* @ngdoc module
* @name material.components.button
* @description
*
* Button
*/
angular
.module('material.components.button', [ 'material.core' ])
.directive('mdButton', MdButtonDirective);
/**
* @ngdoc directive
* @name mdButton
* @module material.components.button
*
* @restrict E
*
* @description
* `<md-button>` is a button directive with optional ink ripples (default enabled).
*
* If you supply a `href` or `ng-href` attribute, it will become an `<a>` element. Otherwise, it will
* become a `<button>` element. As per the [Material Design specifications](http://www.google.com/design/spec/style/color.html#color-ui-color-application)
* the FAB button background is filled with the accent color [by default]. The primary color palette may be used with
* the `md-primary` class.
*
* @param {boolean=} md-no-ink If present, disable ripple ink effects.
* @param {expression=} ng-disabled En/Disable based on the expression
* @param {string=} md-ripple-size Overrides the default ripple size logic. Options: `full`, `partial`, `auto`
* @param {string=} aria-label Adds alternative text to button for accessibility, useful for icon buttons.
* If no default text is found, a warning will be logged.
*
* @usage
*
* Regular buttons:
*
* <hljs lang="html">
* <md-button> Flat Button </md-button>
* <md-button href="http://google.com"> Flat link </md-button>
* <md-button class="md-raised"> Raised Button </md-button>
* <md-button ng-disabled="true"> Disabled Button </md-button>
* <md-button>
* <md-icon md-svg-src="your/icon.svg"></md-icon>
* Register Now
* </md-button>
* </hljs>
*
* FAB buttons:
*
* <hljs lang="html">
* <md-button class="md-fab" aria-label="FAB">
* <md-icon md-svg-src="your/icon.svg"></md-icon>
* </md-button>
* <!-- mini-FAB -->
* <md-button class="md-fab md-mini" aria-label="Mini FAB">
* <md-icon md-svg-src="your/icon.svg"></md-icon>
* </md-button>
* <!-- Button with SVG Icon -->
* <md-button class="md-icon-button" aria-label="Custom Icon Button">
* <md-icon md-svg-icon="path/to/your.svg"></md-icon>
* </md-button>
* </hljs>
*/
function MdButtonDirective($mdButtonInkRipple, $mdTheming, $mdAria, $timeout) {
return {
restrict: 'EA',
replace: true,
transclude: true,
template: getTemplate,
link: postLink
};
function isAnchor(attr) {
return angular.isDefined(attr.href) || angular.isDefined(attr.ngHref) || angular.isDefined(attr.ngLink) || angular.isDefined(attr.uiSref);
}
function getTemplate(element, attr) {
return isAnchor(attr) ?
'<a class="md-button" ng-transclude></a>' :
'<button class="md-button" ng-transclude></button>';
}
function postLink(scope, element, attr) {
var node = element[0];
$mdTheming(element);
$mdButtonInkRipple.attach(scope, element);
var elementHasText = node.textContent.trim();
if (!elementHasText) {
$mdAria.expect(element, 'aria-label');
}
// For anchor elements, we have to set tabindex manually when the
// element is disabled
if (isAnchor(attr) && angular.isDefined(attr.ngDisabled) ) {
scope.$watch(attr.ngDisabled, function(isDisabled) {
element.attr('tabindex', isDisabled ? -1 : 0);
});
}
// disabling click event when disabled is true
element.on('click', function(e){
if (attr.disabled === true) {
e.preventDefault();
e.stopImmediatePropagation();
}
});
// restrict focus styles to the keyboard
scope.mouseActive = false;
element.on('mousedown', function() {
scope.mouseActive = true;
$timeout(function(){
scope.mouseActive = false;
}, 100);
})
.on('focus', function() {
if(scope.mouseActive === false) { element.addClass('md-focused'); }
})
.on('blur', function() { element.removeClass('md-focused'); });
}
}
MdButtonDirective.$inject = ["$mdButtonInkRipple", "$mdTheming", "$mdAria", "$timeout"];
ng.material.components.button = angular.module("material.components.button");

View File

@ -0,0 +1,12 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-card.md-THEME_NAME-theme {
background-color: '{{background-color}}';
border-radius: 2px; }
md-card.md-THEME_NAME-theme .md-card-image {
border-radius: 2px 2px 0 0; }

View File

@ -0,0 +1,34 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-card {
box-sizing: border-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
margin: 8px;
box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.14), 0px 2px 2px 0px rgba(0, 0, 0, 0.098), 0px 1px 5px 0px rgba(0, 0, 0, 0.084); }
md-card > img, md-card > :not(md-card-content) img {
width: 100%; }
md-card md-card-content {
padding: 16px; }
md-card .md-actions {
margin: 0; }
md-card .md-actions .md-button {
margin-bottom: 8px;
margin-top: 8px;
margin-right: 4px;
margin-left: 4px; }
md-card md-card-footer {
padding: 16px; }
@media screen and (-ms-high-contrast: active) {
md-card {
border: 1px solid #fff; } }

View File

@ -0,0 +1,84 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
goog.provide('ng.material.components.card');
goog.require('ng.material.core');
/**
* @ngdoc module
* @name material.components.card
*
* @description
* Card components.
*/
angular.module('material.components.card', [
'material.core'
])
.directive('mdCard', mdCardDirective);
/**
* @ngdoc directive
* @name mdCard
* @module material.components.card
*
* @restrict E
*
* @description
* The `<md-card>` directive is a container element used within `<md-content>` containers.
*
* An image included as a direct descendant will fill the card's width, while the `<md-card-content>`
* container will wrap text content and provide padding. An `<md-card-footer>` element can be
* optionally included to put content flush against the bottom edge of the card.
*
* Action buttons can be included in an element with the `.md-actions` class, also used in `md-dialog`.
* You can then position buttons using layout attributes.
*
* Cards have constant width and variable heights; where the maximum height is limited to what can
* fit within a single view on a platform, but it can temporarily expand as needed.
*
* @usage
* ###Card with optional footer
* <hljs lang="html">
* <md-card>
* <img src="card-image.png" class="md-card-image" alt="image caption">
* <md-card-content>
* <h2>Card headline</h2>
* <p>Card content</p>
* </md-card-content>
* <md-card-footer>
* Card footer
* </md-card-footer>
* </md-card>
* </hljs>
*
* ###Card with actions
* <hljs lang="html">
* <md-card>
* <img src="card-image.png" class="md-card-image" alt="image caption">
* <md-card-content>
* <h2>Card headline</h2>
* <p>Card content</p>
* </md-card-content>
* <div class="md-actions" layout="row" layout-align="end center">
* <md-button>Action 1</md-button>
* <md-button>Action 2</md-button>
* </div>
* </md-card>
* </hljs>
*
*/
function mdCardDirective($mdTheming) {
return {
restrict: 'E',
link: function($scope, $element, $attr) {
$mdTheming($element);
}
};
}
mdCardDirective.$inject = ["$mdTheming"];
ng.material.components.card = angular.module("material.components.card");

View File

@ -0,0 +1,47 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-checkbox.md-THEME_NAME-theme .md-ripple {
color: '{{accent-600}}'; }
md-checkbox.md-THEME_NAME-theme.md-checked .md-ripple {
color: '{{background-600}}'; }
md-checkbox.md-THEME_NAME-theme.md-checked.md-focused .md-container:before {
background-color: '{{accent-color-0.26}}'; }
md-checkbox.md-THEME_NAME-theme .md-icon {
border-color: '{{foreground-2}}'; }
md-checkbox.md-THEME_NAME-theme.md-checked .md-icon {
background-color: '{{accent-color-0.87}}'; }
md-checkbox.md-THEME_NAME-theme.md-checked .md-icon:after {
border-color: '{{background-200}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-primary .md-ripple {
color: '{{primary-600}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-primary.md-checked .md-ripple {
color: '{{background-600}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-primary .md-icon {
border-color: '{{foreground-2}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-primary.md-checked .md-icon {
background-color: '{{primary-color-0.87}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-primary.md-checked.md-focused .md-container:before {
background-color: '{{primary-color-0.26}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-primary.md-checked .md-icon:after {
border-color: '{{background-200}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-warn .md-ripple {
color: '{{warn-600}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-warn .md-icon {
border-color: '{{foreground-2}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-warn.md-checked .md-icon {
background-color: '{{warn-color-0.87}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-warn.md-checked.md-focused:not([disabled]) .md-container:before {
background-color: '{{warn-color-0.26}}'; }
md-checkbox.md-THEME_NAME-theme:not([disabled]).md-warn.md-checked .md-icon:after {
border-color: '{{background-200}}'; }
md-checkbox.md-THEME_NAME-theme[disabled] .md-icon {
border-color: '{{foreground-3}}'; }
md-checkbox.md-THEME_NAME-theme[disabled].md-checked .md-icon {
background-color: '{{foreground-3}}'; }
md-checkbox.md-THEME_NAME-theme[disabled] .md-label {
color: '{{foreground-3}}'; }

View File

@ -0,0 +1,125 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-checkbox {
box-sizing: border-box;
display: block;
margin: 8px;
white-space: nowrap;
cursor: pointer;
outline: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
padding-left: 18px;
padding-right: 0;
position: relative;
line-height: 26px;
min-width: 18px;
min-height: 18px; }
html[dir=rtl] md-checkbox {
padding-left: 0; }
html[dir=rtl] md-checkbox {
padding-right: 18px; }
md-checkbox *, md-checkbox *:before, md-checkbox *:after {
box-sizing: border-box; }
md-checkbox.md-focused:not([disabled]) .md-container:before {
left: -8px;
top: -8px;
right: -8px;
bottom: -8px; }
md-checkbox.md-focused:not([disabled]):not(.md-checked) .md-container:before {
background-color: rgba(0, 0, 0, 0.12); }
md-checkbox .md-container {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: inline-block;
width: 18px;
height: 18px;
left: 0;
right: auto; }
html[dir=rtl] md-checkbox .md-container {
left: auto; }
html[dir=rtl] md-checkbox .md-container {
right: 0; }
md-checkbox .md-container:before {
background-color: transparent;
border-radius: 50%;
content: '';
position: absolute;
display: block;
height: auto;
left: 0;
top: 0;
right: 0;
bottom: 0;
transition: all 0.5s;
width: auto; }
md-checkbox .md-container:after {
content: '';
position: absolute;
top: -10px;
right: -10px;
bottom: -10px;
left: -10px; }
md-checkbox .md-container .md-ripple-container {
position: absolute;
display: block;
width: auto;
height: auto;
left: -15px;
top: -15px;
right: -15px;
bottom: -15px; }
md-checkbox.md-align-top-left > div.md-container {
top: 12px; }
md-checkbox .md-icon {
transition: 240ms;
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 18px;
border-width: 2px;
border-style: solid;
border-radius: 2px; }
md-checkbox.md-checked .md-icon {
border: none; }
md-checkbox[disabled] {
cursor: no-drop; }
md-checkbox.md-checked .md-icon:after {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
left: 6px;
top: 2px;
display: table;
width: 6px;
height: 12px;
border-width: 2px;
border-style: solid;
border-top: 0;
border-left: 0;
content: ''; }
md-checkbox .md-label {
position: relative;
display: inline-block;
vertical-align: middle;
white-space: normal;
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
margin-left: 10px;
margin-right: 0; }
html[dir=rtl] md-checkbox .md-label {
margin-left: 0; }
html[dir=rtl] md-checkbox .md-label {
margin-right: 10px; }

View File

@ -0,0 +1,166 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
goog.provide('ng.material.components.checkbox');
goog.require('ng.material.core');
/**
* @ngdoc module
* @name material.components.checkbox
* @description Checkbox module!
*/
angular
.module('material.components.checkbox', ['material.core'])
.directive('mdCheckbox', MdCheckboxDirective);
/**
* @ngdoc directive
* @name mdCheckbox
* @module material.components.checkbox
* @restrict E
*
* @description
* The checkbox directive is used like the normal [angular checkbox](https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D).
*
* As per the [material design spec](http://www.google.com/design/spec/style/color.html#color-ui-color-application)
* the checkbox is in the accent color by default. The primary color palette may be used with
* the `md-primary` class.
*
* @param {string} ng-model Assignable angular expression to data-bind to.
* @param {string=} name Property name of the form under which the control is published.
* @param {expression=} ng-true-value The value to which the expression should be set when selected.
* @param {expression=} ng-false-value The value to which the expression should be set when not selected.
* @param {string=} ng-change Angular expression to be executed when input changes due to user interaction with the input element.
* @param {boolean=} md-no-ink Use of attribute indicates use of ripple ink effects
* @param {string=} aria-label Adds label to checkbox for accessibility.
* Defaults to checkbox's text. If no default text is found, a warning will be logged.
*
* @usage
* <hljs lang="html">
* <md-checkbox ng-model="isChecked" aria-label="Finished?">
* Finished ?
* </md-checkbox>
*
* <md-checkbox md-no-ink ng-model="hasInk" aria-label="No Ink Effects">
* No Ink Effects
* </md-checkbox>
*
* <md-checkbox ng-disabled="true" ng-model="isDisabled" aria-label="Disabled">
* Disabled
* </md-checkbox>
*
* </hljs>
*
*/
function MdCheckboxDirective(inputDirective, $mdInkRipple, $mdAria, $mdConstant, $mdTheming, $mdUtil, $timeout) {
inputDirective = inputDirective[0];
var CHECKED_CSS = 'md-checked';
return {
restrict: 'E',
transclude: true,
require: '?ngModel',
priority:210, // Run before ngAria
template:
'<div class="md-container" md-ink-ripple md-ink-ripple-checkbox>' +
'<div class="md-icon"></div>' +
'</div>' +
'<div ng-transclude class="md-label"></div>',
compile: compile
};
// **********************************************************
// Private Methods
// **********************************************************
function compile (tElement, tAttrs) {
tAttrs.type = 'checkbox';
tAttrs.tabindex = tAttrs.tabindex || '0';
tElement.attr('role', tAttrs.type);
return function postLink(scope, element, attr, ngModelCtrl) {
ngModelCtrl = ngModelCtrl || $mdUtil.fakeNgModel();
$mdTheming(element);
if (attr.ngChecked) {
scope.$watch(
scope.$eval.bind(scope, attr.ngChecked),
ngModelCtrl.$setViewValue.bind(ngModelCtrl)
);
}
$$watchExpr('ngDisabled', 'tabindex', {
true: '-1',
false: attr.tabindex
});
$mdAria.expectWithText(element, 'aria-label');
// Reuse the original input[type=checkbox] directive from Angular core.
// This is a bit hacky as we need our own event listener and own render
// function.
inputDirective.link.pre(scope, {
on: angular.noop,
0: {}
}, attr, [ngModelCtrl]);
scope.mouseActive = false;
element.on('click', listener)
.on('keypress', keypressHandler)
.on('mousedown', function() {
scope.mouseActive = true;
$timeout(function(){
scope.mouseActive = false;
}, 100);
})
.on('focus', function() {
if(scope.mouseActive === false) { element.addClass('md-focused'); }
})
.on('blur', function() { element.removeClass('md-focused'); });
ngModelCtrl.$render = render;
function $$watchExpr(expr, htmlAttr, valueOpts) {
if (attr[expr]) {
scope.$watch(attr[expr], function(val) {
if (valueOpts[val]) {
element.attr(htmlAttr, valueOpts[val]);
}
});
}
}
function keypressHandler(ev) {
var keyCode = ev.which || ev.keyCode;
if (keyCode === $mdConstant.KEY_CODE.SPACE || keyCode === $mdConstant.KEY_CODE.ENTER) {
ev.preventDefault();
if (!element.hasClass('md-focused')) { element.addClass('md-focused'); }
listener(ev);
}
}
function listener(ev) {
if (element[0].hasAttribute('disabled')) return;
scope.$apply(function() {
// Toggle the checkbox value...
var viewValue = attr.ngChecked ? attr.checked : !ngModelCtrl.$viewValue;
ngModelCtrl.$setViewValue( viewValue, ev && ev.type);
ngModelCtrl.$render();
});
}
function render() {
if(ngModelCtrl.$viewValue) {
element.addClass(CHECKED_CSS);
} else {
element.removeClass(CHECKED_CSS);
}
}
};
}
}
MdCheckboxDirective.$inject = ["inputDirective", "$mdInkRipple", "$mdAria", "$mdConstant", "$mdTheming", "$mdUtil", "$timeout"];
ng.material.components.checkbox = angular.module("material.components.checkbox");

View File

@ -0,0 +1,24 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-chips.md-THEME_NAME-theme .md-chips {
box-shadow: 0 1px '{{background-300}}'; }
md-chips.md-THEME_NAME-theme .md-chips.md-focused {
box-shadow: 0 2px '{{primary-color}}'; }
md-chips.md-THEME_NAME-theme .md-chip {
background: '{{background-300}}';
color: '{{background-800}}'; }
md-chips.md-THEME_NAME-theme .md-chip.md-focused {
background: '{{primary-color}}';
color: '{{primary-contrast}}'; }
md-chips.md-THEME_NAME-theme .md-chip.md-focused md-icon {
color: '{{primary-contrast}}'; }
md-chips.md-THEME_NAME-theme md-chip-remove .md-button md-icon path {
fill: '{{background-500}}'; }
.md-contact-suggestion span.md-contact-email {
color: '{{background-400}}'; }

View File

@ -0,0 +1,136 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
.md-contact-chips .md-chips .md-chip {
padding: 0 8px 0 0; }
.md-contact-chips .md-chips .md-chip .md-contact-avatar {
float: left; }
.md-contact-chips .md-chips .md-chip .md-contact-avatar img {
height: 32px;
border-radius: 16px; }
.md-contact-chips .md-chips .md-chip .md-contact-name {
display: inline-block;
height: 32px;
margin-left: 8px; }
.md-contact-suggestion {
height: 56px; }
.md-contact-suggestion img {
height: 40px;
border-radius: 20px;
margin-top: 8px; }
.md-contact-suggestion .md-contact-name {
margin-left: 8px;
width: 120px; }
.md-contact-suggestion .md-contact-name, .md-contact-suggestion .md-contact-email {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis; }
.md-contact-chips-suggestions li {
height: 100%; }
.md-chips {
display: block;
font-family: RobotoDraft, Roboto, 'Helvetica Neue', sans-serif;
font-size: 13px;
padding: 0 0 8px 0;
vertical-align: middle;
cursor: text; }
.md-chips:after {
content: '';
display: table;
clear: both; }
.md-chips .md-chip {
cursor: default;
border-radius: 16px;
display: block;
height: 32px;
line-height: 32px;
margin: 8px 8px 0 0;
padding: 0 8px 0 12px;
float: left;
box-sizing: border-box;
max-width: 100%; }
.md-chips .md-chip .md-chip-content {
display: block;
padding-right: 4px;
float: left;
white-space: nowrap;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis; }
.md-chips .md-chip .md-chip-content:focus {
outline: none; }
.md-chips .md-chip .md-chip-remove-container {
display: inline-block;
margin-right: -5px; }
.md-chips .md-chip .md-chip-remove {
text-align: center;
width: 32px;
height: 32px;
min-width: 0;
padding: 0;
background: transparent;
border: none;
box-shadow: none;
margin: 0;
position: relative; }
.md-chips .md-chip .md-chip-remove md-icon {
height: 18px;
width: 18px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0); }
.md-chips .md-chip-input-container {
display: block;
line-height: 32px;
margin: 8px 8px 0 0;
padding: 0 8px 0 12px;
float: left; }
.md-chips .md-chip-input-container input:not([type]), .md-chips .md-chip-input-container input[type="email"], .md-chips .md-chip-input-container input[type="number"], .md-chips .md-chip-input-container input[type="tel"], .md-chips .md-chip-input-container input[type="url"], .md-chips .md-chip-input-container input[type="text"] {
border: 0;
height: 32px;
line-height: 32px;
padding: 0; }
.md-chips .md-chip-input-container input:not([type]):focus, .md-chips .md-chip-input-container input[type="email"]:focus, .md-chips .md-chip-input-container input[type="number"]:focus, .md-chips .md-chip-input-container input[type="tel"]:focus, .md-chips .md-chip-input-container input[type="url"]:focus, .md-chips .md-chip-input-container input[type="text"]:focus {
outline: none; }
.md-chips .md-chip-input-container md-autocomplete, .md-chips .md-chip-input-container md-autocomplete-wrap {
background: transparent;
height: 32px; }
.md-chips .md-chip-input-container md-autocomplete md-autocomplete-wrap {
box-shadow: none; }
.md-chips .md-chip-input-container md-autocomplete input {
position: relative; }
.md-chips .md-chip-input-container input {
border: 0;
height: 32px;
line-height: 32px;
padding: 0; }
.md-chips .md-chip-input-container input:focus {
outline: none; }
.md-chips .md-chip-input-container md-autocomplete, .md-chips .md-chip-input-container md-autocomplete-wrap {
height: 32px; }
.md-chips .md-chip-input-container md-autocomplete {
box-shadow: none; }
.md-chips .md-chip-input-container md-autocomplete input {
position: relative; }
.md-chips .md-chip-input-container:not(:first-child) {
margin: 8px 8px 0 0; }
.md-chips .md-chip-input-container input {
background: transparent;
border-width: 0; }
.md-chips md-autocomplete button {
display: none; }
@media screen and (-ms-high-contrast: active) {
.md-chip-input-container, md-chip {
border: 1px solid #fff; }
.md-chip-input-container md-autocomplete {
border: none; } }

View File

@ -0,0 +1,949 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
goog.provide('ng.material.components.chips');
goog.require('ng.material.components.autocomplete');
goog.require('ng.material.core');
/**
* @ngdoc module
* @name material.components.chips
*/
/*
* @see js folder for chips implementation
*/
angular.module('material.components.chips', [
'material.core',
'material.components.autocomplete'
]);
angular
.module('material.components.chips')
.directive('mdChip', MdChip);
/**
* @ngdoc directive
* @name mdChip
* @module material.components.chips
*
* @description
* `<md-chip>` is a component used within `<md-chips>` and is responsible for rendering individual
* chips.
*
*
* @usage
* <hljs lang="html">
* <md-chip>{{$chip}}</md-chip>
* </hljs>
*
*/
// This hint text is hidden within a chip but used by screen readers to
// inform the user how they can interact with a chip.
var DELETE_HINT_TEMPLATE = '\
<span ng-if="!$mdChipsCtrl.readonly" class="md-visually-hidden">\
{{$mdChipsCtrl.deleteHint}}\
</span>';
/**
* MDChip Directive Definition
*
* @param $mdTheming
* @param $mdInkRipple
* ngInject
*/
function MdChip($mdTheming) {
return {
restrict: 'E',
require: '^?mdChips',
compile: compile
};
function compile(element, attr) {
element.append(DELETE_HINT_TEMPLATE);
return function postLink(scope, element, attr, ctrl) {
element.addClass('md-chip');
$mdTheming(element);
if (ctrl) angular.element(element[0].querySelector('.md-chip-content'))
.on('blur', function () {
ctrl.selectedChip = -1;
});
};
}
}
MdChip.$inject = ["$mdTheming"];
angular
.module('material.components.chips')
.directive('mdChipRemove', MdChipRemove);
/**
* @ngdoc directive
* @name mdChipRemove
* @module material.components.chips
*
* @description
* `<md-chip-remove>`
* Designates an element to be used as the delete button for a chip. This
* element is passed as a child of the `md-chips` element.
*
* @usage
* <hljs lang="html">
* <md-chips><button md-chip-remove>DEL</button></md-chips>
* </hljs>
*/
/**
* MdChipRemove Directive Definition.
*
* @param $compile
* @param $timeout
* @returns {{restrict: string, require: string[], link: Function, scope: boolean}}
* @constructor
*/
function MdChipRemove ($timeout) {
return {
restrict: 'A',
require: '^mdChips',
scope: false,
link: postLink
};
function postLink(scope, element, attr, ctrl) {
element.on('click', function(event) {
scope.$apply(function() {
ctrl.removeChip(scope.$$replacedScope.$index);
});
});
// Child elements aren't available until after a $timeout tick as they are hidden by an
// `ng-if`. see http://goo.gl/zIWfuw
$timeout(function() {
element.attr({ tabindex: -1, ariaHidden: true });
element.find('button').attr('tabindex', '-1');
});
}
}
MdChipRemove.$inject = ["$timeout"];
angular
.module('material.components.chips')
.directive('mdChipTransclude', MdChipTransclude);
function MdChipTransclude ($compile, $mdUtil) {
return {
restrict: 'EA',
terminal: true,
link: link,
scope: false
};
function link (scope, element, attr) {
var ctrl = scope.$parent.$mdChipsCtrl,
newScope = ctrl.parent.$new(false, ctrl.parent);
newScope.$$replacedScope = scope;
newScope.$chip = scope.$chip;
newScope.$mdChipsCtrl = ctrl;
element.html(ctrl.$scope.$eval(attr.mdChipTransclude));
$compile(element.contents())(newScope);
}
}
MdChipTransclude.$inject = ["$compile", "$mdUtil"];
angular
.module('material.components.chips')
.controller('MdChipsCtrl', MdChipsCtrl);
/**
* Controller for the MdChips component. Responsible for adding to and
* removing from the list of chips, marking chips as selected, and binding to
* the models of various input components.
*
* @param $scope
* @param $mdConstant
* @param $log
* @param $element
* @constructor
*/
function MdChipsCtrl ($scope, $mdConstant, $log, $element, $timeout) {
/** @type {$timeout} **/
this.$timeout = $timeout;
/** @type {Object} */
this.$mdConstant = $mdConstant;
/** @type {angular.$scope} */
this.$scope = $scope;
/** @type {angular.$scope} */
this.parent = $scope.$parent;
/** @type {$log} */
this.$log = $log;
/** @type {$element} */
this.$element = $element;
/** @type {angular.NgModelController} */
this.ngModelCtrl = null;
/** @type {angular.NgModelController} */
this.userInputNgModelCtrl = null;
/** @type {Element} */
this.userInputElement = null;
/** @type {Array.<Object>} */
this.items = [];
/** @type {number} */
this.selectedChip = -1;
/**
* Hidden hint text for how to delete a chip. Used to give context to screen readers.
* @type {string}
*/
this.deleteHint = 'Press delete to remove this chip.';
/**
* Hidden label for the delete button. Used to give context to screen readers.
* @type {string}
*/
this.deleteButtonLabel = 'Remove';
/**
* Model used by the input element.
* @type {string}
*/
this.chipBuffer = '';
/**
* Whether to use the mdOnAppend expression to transform the chip buffer
* before appending it to the list.
* @type {boolean}
*/
this.useMdOnAppend = false;
}
MdChipsCtrl.$inject = ["$scope", "$mdConstant", "$log", "$element", "$timeout"];
/**
* Handles the keydown event on the input element: <enter> appends the
* buffer to the chip list, while backspace removes the last chip in the list
* if the current buffer is empty.
* @param event
*/
MdChipsCtrl.prototype.inputKeydown = function(event) {
var chipBuffer = this.getChipBuffer();
switch (event.keyCode) {
case this.$mdConstant.KEY_CODE.ENTER:
if (this.$scope.requireMatch || !chipBuffer) break;
event.preventDefault();
this.appendChip(chipBuffer);
this.resetChipBuffer();
break;
case this.$mdConstant.KEY_CODE.BACKSPACE:
if (chipBuffer) break;
event.stopPropagation();
if (this.items.length) this.selectAndFocusChipSafe(this.items.length - 1);
break;
}
};
/**
* Handles the keydown event on the chip elements: backspace removes the selected chip, arrow
* keys switch which chips is active
* @param event
*/
MdChipsCtrl.prototype.chipKeydown = function (event) {
if (this.getChipBuffer()) return;
switch (event.keyCode) {
case this.$mdConstant.KEY_CODE.BACKSPACE:
case this.$mdConstant.KEY_CODE.DELETE:
if (this.selectedChip < 0) return;
event.preventDefault();
this.removeAndSelectAdjacentChip(this.selectedChip);
break;
case this.$mdConstant.KEY_CODE.LEFT_ARROW:
event.preventDefault();
if (this.selectedChip < 0) this.selectedChip = this.items.length;
if (this.items.length) this.selectAndFocusChipSafe(this.selectedChip - 1);
break;
case this.$mdConstant.KEY_CODE.RIGHT_ARROW:
event.preventDefault();
this.selectAndFocusChipSafe(this.selectedChip + 1);
break;
case this.$mdConstant.KEY_CODE.ESCAPE:
case this.$mdConstant.KEY_CODE.TAB:
if (this.selectedChip < 0) return;
event.preventDefault();
this.onFocus();
break;
}
};
/**
* Get the input's placeholder - uses `placeholder` when list is empty and `secondary-placeholder`
* when the list is non-empty. If `secondary-placeholder` is not provided, `placeholder` is used
* always.
*/
MdChipsCtrl.prototype.getPlaceholder = function() {
// Allow `secondary-placeholder` to be blank.
var useSecondary = (this.items.length &&
(this.secondaryPlaceholder == '' || this.secondaryPlaceholder));
return useSecondary ? this.placeholder : this.secondaryPlaceholder;
};
/**
* Removes chip at {@code index} and selects the adjacent chip.
* @param index
*/
MdChipsCtrl.prototype.removeAndSelectAdjacentChip = function(index) {
var selIndex = this.getAdjacentChipIndex(index);
this.removeChip(index);
this.$timeout(angular.bind(this, function () {
this.selectAndFocusChipSafe(selIndex);
}));
};
/**
* Sets the selected chip index to -1.
*/
MdChipsCtrl.prototype.resetSelectedChip = function() {
this.selectedChip = -1;
};
/**
* Gets the index of an adjacent chip to select after deletion. Adjacency is
* determined as the next chip in the list, unless the target chip is the
* last in the list, then it is the chip immediately preceding the target. If
* there is only one item in the list, -1 is returned (select none).
* The number returned is the index to select AFTER the target has been
* removed.
* If the current chip is not selected, then -1 is returned to select none.
*/
MdChipsCtrl.prototype.getAdjacentChipIndex = function(index) {
var len = this.items.length - 1;
return (len == 0) ? -1 :
(index == len) ? index -1 : index;
};
/**
* Append the contents of the buffer to the chip list. This method will first
* call out to the md-on-append method, if provided
* @param newChip
*/
MdChipsCtrl.prototype.appendChip = function(newChip) {
if (this.items.indexOf(newChip) + 1) return;
if (this.useMdOnAppend && this.mdOnAppend) {
newChip = this.mdOnAppend({'$chip': newChip});
}
this.items.push(newChip);
};
/**
* Sets whether to use the md-on-append expression. This expression is
* bound to scope and controller in {@code MdChipsDirective} as
* {@code mdOnAppend}. Due to the nature of directive scope bindings, the
* controller cannot know on its own/from the scope whether an expression was
* actually provided.
*/
MdChipsCtrl.prototype.useMdOnAppendExpression = function() {
this.useMdOnAppend = true;
};
/**
* Gets the input buffer. The input buffer can be the model bound to the
* default input item {@code this.chipBuffer}, the {@code selectedItem}
* model of an {@code md-autocomplete}, or, through some magic, the model
* bound to any inpput or text area element found within a
* {@code md-input-container} element.
* @return {Object|string}
*/
MdChipsCtrl.prototype.getChipBuffer = function() {
return !this.userInputElement ? this.chipBuffer :
this.userInputNgModelCtrl ? this.userInputNgModelCtrl.$viewValue :
this.userInputElement[0].value;
};
/**
* Resets the input buffer for either the internal input or user provided input element.
*/
MdChipsCtrl.prototype.resetChipBuffer = function() {
if (this.userInputElement) {
if (this.userInputNgModelCtrl) {
this.userInputNgModelCtrl.$setViewValue('');
this.userInputNgModelCtrl.$render();
} else {
this.userInputElement[0].value = '';
}
} else {
this.chipBuffer = '';
}
};
/**
* Removes the chip at the given index.
* @param index
*/
MdChipsCtrl.prototype.removeChip = function(index) {
this.items.splice(index, 1);
};
MdChipsCtrl.prototype.removeChipAndFocusInput = function (index) {
this.removeChip(index);
this.onFocus();
};
/**
* Selects the chip at `index`,
* @param index
*/
MdChipsCtrl.prototype.selectAndFocusChipSafe = function(index) {
if (!this.items.length) {
this.selectChip(-1);
this.onFocus();
return;
}
if (index === this.items.length) return this.onFocus();
index = Math.max(index, 0);
index = Math.min(index, this.items.length - 1);
this.selectChip(index);
this.focusChip(index);
};
/**
* Marks the chip at the given index as selected.
* @param index
*/
MdChipsCtrl.prototype.selectChip = function(index) {
if (index >= -1 && index <= this.items.length) {
this.selectedChip = index;
} else {
this.$log.warn('Selected Chip index out of bounds; ignoring.');
}
};
/**
* Selects the chip at `index` and gives it focus.
* @param index
*/
MdChipsCtrl.prototype.selectAndFocusChip = function(index) {
this.selectChip(index);
if (index != -1) {
this.focusChip(index);
}
};
/**
* Call `focus()` on the chip at `index`
*/
MdChipsCtrl.prototype.focusChip = function(index) {
this.$element[0].querySelector('md-chip[index="' + index + '"] .md-chip-content').focus();
};
/**
* Configures the required interactions with the ngModel Controller.
* Specifically, set {@code this.items} to the {@code NgModelCtrl#$viewVale}.
* @param ngModelCtrl
*/
MdChipsCtrl.prototype.configureNgModel = function(ngModelCtrl) {
this.ngModelCtrl = ngModelCtrl;
var self = this;
ngModelCtrl.$render = function() {
// model is updated. do something.
self.items = self.ngModelCtrl.$viewValue;
};
};
MdChipsCtrl.prototype.onFocus = function () {
var input = this.$element[0].querySelector('input');
input && input.focus();
this.resetSelectedChip();
};
MdChipsCtrl.prototype.onInputFocus = function () {
this.inputHasFocus = true;
this.resetSelectedChip();
};
MdChipsCtrl.prototype.onInputBlur = function () {
this.inputHasFocus = false;
};
/**
* Configure event bindings on a user-provided input element.
* @param inputElement
*/
MdChipsCtrl.prototype.configureUserInput = function(inputElement) {
this.userInputElement = inputElement;
// Find the NgModelCtrl for the input element
var ngModelCtrl = inputElement.controller('ngModel');
// `.controller` will look in the parent as well.
if (ngModelCtrl != this.ngModelCtrl) {
this.userInputNgModelCtrl = ngModelCtrl;
}
// Bind to keydown and focus events of input
var scope = this.$scope;
var ctrl = this;
inputElement
.attr({ tabindex: 0 })
.on('keydown', function(event) { scope.$apply( angular.bind(ctrl, function() { ctrl.inputKeydown(event); })) })
.on('focus', angular.bind(ctrl, ctrl.onInputFocus))
.on('blur', angular.bind(ctrl, ctrl.onInputBlur));
};
MdChipsCtrl.prototype.configureAutocomplete = function(ctrl) {
ctrl.registerSelectedItemWatcher(angular.bind(this, function (item) {
if (item) {
this.appendChip(item);
this.resetChipBuffer();
}
}));
this.$element.find('input')
.on('focus',angular.bind(this, this.onInputFocus) )
.on('blur', angular.bind(this, this.onInputBlur) );
};
MdChipsCtrl.prototype.hasFocus = function () {
return this.inputHasFocus || this.selectedChip >= 0;
};
angular
.module('material.components.chips')
.directive('mdChips', MdChips);
/**
* @ngdoc directive
* @name mdChips
* @module material.components.chips
*
* @description
* `<md-chips>` is an input component for building lists of strings or objects. The list items are
* displayed as 'chips'. This component can make use of an `<input>` element or an
* `<md-autocomplete>` element.
*
* <strong>Custom `<md-chip-template>` template</strong>
* A custom template may be provided to render the content of each chip. This is achieved by
* specifying an `<md-chip-template>` element as a child of `<md-chips>`. Note: Any attributes on
* `<md-chip-template>` will be dropped as only the innerHTML is used for the chip template. The
* variables `$chip` and `$index` are available in the scope of `<md-chip-template>`, representing
* the chip object and its index in the list of chips, respectively.
* To override the chip delete control, include an element (ideally a button) with the attribute
* `md-chip-remove`. A click listener to remove the chip will be added automatically. The element
* is also placed as a sibling to the chip content (on which there are also click listeners) to
* avoid a nested ng-click situation.
*
* <h3> Pending Features </h3>
* <ul style="padding-left:20px;">
*
* <ul>Style
* <li>Colours for hover, press states (ripple?).</li>
* </ul>
*
* <ul>List Manipulation
* <li>delete item via DEL or backspace keys when selected</li>
* </ul>
*
* <ul>Validation
* <li>de-dupe values (or support duplicates, but fix the ng-repeat duplicate key issue)</li>
* <li>allow a validation callback</li>
* <li>hilighting style for invalid chips</li>
* </ul>
*
* <ul>Item mutation
* <li>Support `
* <md-chip-edit>` template, show/hide the edit element on tap/click? double tap/double
* click?
* </li>
* </ul>
*
* <ul>Truncation and Disambiguation (?)
* <li>Truncate chip text where possible, but do not truncate entries such that two are
* indistinguishable.</li>
* </ul>
*
* <ul>Drag and Drop
* <li>Drag and drop chips between related `<md-chips>` elements.
* </li>
* </ul>
* </ul>
*
* <span style="font-size:.8em;text-align:center">
* Warning: This component is a WORK IN PROGRESS. If you use it now,
* it will probably break on you in the future.
* </span>
*
* @param {string=|object=} ng-model A model to bind the list of items to
* @param {string=} placeholder Placeholder text that will be forwarded to the input.
* @param {string=} secondary-placeholder Placeholder text that will be forwarded to the input,
* displayed when there is at least on item in the list
* @param {boolean=} readonly Disables list manipulation (deleting or adding list items), hiding
* the input and delete buttons
* @param {expression} md-on-append An expression expected to convert the input string into an
* object when adding a chip.
* @param {string=} delete-hint A string read by screen readers instructing users that pressing
* the delete key will remove the chip.
* @param {string=} delete-button-label A label for the delete button. Also hidden and read by
* screen readers.
*
* @usage
* <hljs lang="html">
* <md-chips
* ng-model="myItems"
* placeholder="Add an item"
* readonly="isReadOnly">
* </md-chips>
* </hljs>
*
*/
var MD_CHIPS_TEMPLATE = '\
<md-chips-wrap\
ng-if="!$mdChipsCtrl.readonly || $mdChipsCtrl.items.length > 0"\
ng-keydown="$mdChipsCtrl.chipKeydown($event)"\
ng-class="{ \'md-focused\': $mdChipsCtrl.hasFocus() }"\
class="md-chips">\
<md-chip ng-repeat="$chip in $mdChipsCtrl.items"\
index="{{$index}}"\
ng-class="{\'md-focused\': $mdChipsCtrl.selectedChip == $index}">\
<div class="md-chip-content"\
tabindex="-1"\
aria-hidden="true"\
ng-focus="!$mdChipsCtrl.readonly && $mdChipsCtrl.selectChip($index)"\
md-chip-transclude="$mdChipsCtrl.chipContentsTemplate"></div>\
<div class="md-chip-remove-container"\
md-chip-transclude="$mdChipsCtrl.chipRemoveTemplate"></div>\
</md-chip>\
<div ng-if="!$mdChipsCtrl.readonly && $mdChipsCtrl.ngModelCtrl"\
class="md-chip-input-container"\
md-chip-transclude="$mdChipsCtrl.chipInputTemplate"></div>\
</div>\
</md-chips-wrap>';
var CHIP_INPUT_TEMPLATE = '\
<input\
tabindex="0"\
placeholder="{{$mdChipsCtrl.getPlaceholder()}}"\
aria-label="{{$mdChipsCtrl.getPlaceholder()}}"\
ng-model="$mdChipsCtrl.chipBuffer"\
ng-focus="$mdChipsCtrl.onInputFocus()"\
ng-blur="$mdChipsCtrl.onInputBlur()"\
ng-keydown="$mdChipsCtrl.inputKeydown($event)">';
var CHIP_DEFAULT_TEMPLATE = '\
<span>{{$chip}}</span>';
var CHIP_REMOVE_TEMPLATE = '\
<button\
class="md-chip-remove"\
ng-if="!$mdChipsCtrl.readonly"\
ng-click="$mdChipsCtrl.removeChipAndFocusInput($$replacedScope.$index)"\
type="button"\
aria-hidden="true"\
tabindex="-1">\
<md-icon md-svg-icon="md-close"></md-icon>\
<span class="md-visually-hidden">\
{{$mdChipsCtrl.deleteButtonLabel}}\
</span>\
</button>';
/**
* MDChips Directive Definition
*/
function MdChips ($mdTheming, $mdUtil, $compile, $log, $timeout) {
return {
template: function(element, attrs) {
// Clone the element into an attribute. By prepending the attribute
// name with '$', Angular won't write it into the DOM. The cloned
// element propagates to the link function via the attrs argument,
// where various contained-elements can be consumed.
var content = attrs['$mdUserTemplate'] = element.clone();
return MD_CHIPS_TEMPLATE;
},
require: ['mdChips'],
restrict: 'E',
controller: 'MdChipsCtrl',
controllerAs: '$mdChipsCtrl',
bindToController: true,
compile: compile,
scope: {
readonly: '=readonly',
placeholder: '@',
secondaryPlaceholder: '@',
mdOnAppend: '&',
deleteHint: '@',
deleteButtonLabel: '@',
requireMatch: '=?mdRequireMatch'
}
};
/**
* Builds the final template for `md-chips` and returns the postLink function.
*
* Building the template involves 3 key components:
* static chips
* chip template
* input control
*
* If no `ng-model` is provided, only the static chip work needs to be done.
*
* If no user-passed `md-chip-template` exists, the default template is used. This resulting
* template is appended to the chip content element.
*
* The remove button may be overridden by passing an element with an md-chip-remove attribute.
*
* If an `input` or `md-autocomplete` element is provided by the caller, it is set aside for
* transclusion later. The transclusion happens in `postLink` as the parent scope is required.
* If no user input is provided, a default one is appended to the input container node in the
* template.
*
* Static Chips (i.e. `md-chip` elements passed from the caller) are gathered and set aside for
* transclusion in the `postLink` function.
*
*
* @param element
* @param attr
* @returns {Function}
*/
function compile(element, attr) {
// Grab the user template from attr and reset the attribute to null.
var userTemplate = attr['$mdUserTemplate'];
attr['$mdUserTemplate'] = null;
// Set the chip remove, chip contents and chip input templates. The link function will put
// them on the scope for transclusion later.
var chipRemoveTemplate = getTemplateByQuery('md-chips>*[md-chip-remove]') || CHIP_REMOVE_TEMPLATE,
chipContentsTemplate = getTemplateByQuery('md-chips>md-chip-template') || CHIP_DEFAULT_TEMPLATE,
chipInputTemplate = getTemplateByQuery('md-chips>md-autocomplete')
|| getTemplateByQuery('md-chips>input')
|| CHIP_INPUT_TEMPLATE,
staticChips = userTemplate.find('md-chip');
// Warn of malformed template. See #2545
if (userTemplate[0].querySelector('md-chip-template>*[md-chip-remove]')) {
$log.warn('invalid placement of md-chip-remove within md-chip-template.');
}
function getTemplateByQuery (query) {
if (!attr.ngModel) return;
var element = userTemplate[0].querySelector(query);
return element && element.outerHTML;
}
/**
* Configures controller and transcludes.
*/
return function postLink(scope, element, attrs, controllers) {
$mdUtil.initOptionalProperties(scope, attr);
$mdTheming(element);
var mdChipsCtrl = controllers[0];
mdChipsCtrl.chipContentsTemplate = chipContentsTemplate;
mdChipsCtrl.chipRemoveTemplate = chipRemoveTemplate;
mdChipsCtrl.chipInputTemplate = chipInputTemplate;
element
.attr({ ariaHidden: true, tabindex: -1 })
.on('focus', function () { mdChipsCtrl.onFocus(); });
if (attr.ngModel) {
mdChipsCtrl.configureNgModel(element.controller('ngModel'));
// If an `md-on-append` attribute was set, tell the controller to use the expression
// when appending chips.
if (attrs.mdOnAppend) mdChipsCtrl.useMdOnAppendExpression();
// The md-autocomplete and input elements won't be compiled until after this directive
// is complete (due to their nested nature). Wait a tick before looking for them to
// configure the controller.
if (chipInputTemplate != CHIP_INPUT_TEMPLATE) {
$timeout(function() {
if (chipInputTemplate.indexOf('<md-autocomplete') === 0)
mdChipsCtrl
.configureAutocomplete(element.find('md-autocomplete')
.controller('mdAutocomplete'));
mdChipsCtrl.configureUserInput(element.find('input'));
});
}
}
// Compile with the parent's scope and prepend any static chips to the wrapper.
if (staticChips.length > 0) {
var compiledStaticChips = $compile(staticChips)(scope.$parent);
$timeout(function() { element.find('md-chips-wrap').prepend(compiledStaticChips); });
}
};
}
}
MdChips.$inject = ["$mdTheming", "$mdUtil", "$compile", "$log", "$timeout"];
angular
.module('material.components.chips')
.controller('MdContactChipsCtrl', MdContactChipsCtrl);
/**
* Controller for the MdContactChips component
* @constructor
*/
function MdContactChipsCtrl () {
/** @type {Object} */
this.selectedItem = null;
/** @type {string} */
this.searchText = '';
}
MdContactChipsCtrl.prototype.queryContact = function(searchText) {
var results = this.contactQuery({'$query': searchText});
return this.filterSelected ?
results.filter(angular.bind(this, this.filterSelectedContacts)) : results;
};
MdContactChipsCtrl.prototype.filterSelectedContacts = function(contact) {
return this.contacts.indexOf(contact) == -1;
};
angular
.module('material.components.chips')
.directive('mdContactChips', MdContactChips);
/**
* @ngdoc directive
* @name mdContactChips
* @module material.components.chips
*
* @description
* `<md-contact-chips>` is an input component based on `md-chips` and makes use of an
* `md-autocomplete` element. The component allows the caller to supply a query expression
* which returns a list of possible contacts. The user can select one of these and add it to
* the list of chips.
*
* @param {string=|object=} ng-model A model to bind the list of items to
* @param {string=} placeholder Placeholder text that will be forwarded to the input.
* @param {string=} secondary-placeholder Placeholder text that will be forwarded to the input,
* displayed when there is at least on item in the list
* @param {expression} md-contacts An expression expected to return contacts matching the search
* test, `$query`.
* @param {string} md-contact-name The field name of the contact object representing the
* contact's name.
* @param {string} md-contact-email The field name of the contact object representing the
* contact's email address.
* @param {string} md-contact-image The field name of the contact object representing the
* contact's image.
*
*
* // The following attribute has been removed but may come back.
* @param {expression=} filter-selected Whether to filter selected contacts from the list of
* suggestions shown in the autocomplete.
*
*
*
* @usage
* <hljs lang="html">
* <md-contact-chips
* ng-model="ctrl.contacts"
* md-contacts="ctrl.querySearch($query)"
* md-contact-name="name"
* md-contact-image="image"
* md-contact-email="email"
* placeholder="To">
* </md-contact-chips>
* </hljs>
*
*/
var MD_CONTACT_CHIPS_TEMPLATE = '\
<md-chips class="md-contact-chips"\
ng-model="$mdContactChipsCtrl.contacts"\
md-require-match="$mdContactChipsCtrl.requireMatch"\
md-autocomplete-snap>\
<md-autocomplete\
md-menu-class="md-contact-chips-suggestions"\
md-selected-item="$mdContactChipsCtrl.selectedItem"\
md-search-text="$mdContactChipsCtrl.searchText"\
md-items="item in $mdContactChipsCtrl.queryContact($mdContactChipsCtrl.searchText)"\
md-item-text="$mdContactChipsCtrl.mdContactName"\
md-no-cache="true"\
md-autoselect\
placeholder="{{$mdContactChipsCtrl.contacts.length == 0 ?\
$mdContactChipsCtrl.placeholder : $mdContactChipsCtrl.secondaryPlaceholder}}">\
<div class="md-contact-suggestion">\
<img \
ng-src="{{item[$mdContactChipsCtrl.contactImage]}}"\
alt="{{item[$mdContactChipsCtrl.contactName]}}" />\
<span class="md-contact-name" md-highlight-text="$mdContactChipsCtrl.searchText">\
{{item[$mdContactChipsCtrl.contactName]}}\
</span>\
<span class="md-contact-email" >{{item[$mdContactChipsCtrl.contactEmail]}}</span>\
</div>\
</md-autocomplete>\
<md-chip-template>\
<div class="md-contact-avatar">\
<img \
ng-src="{{$chip[$mdContactChipsCtrl.contactImage]}}"\
alt="{{$chip[$mdContactChipsCtrl.contactName]}}" />\
</div>\
<div class="md-contact-name">\
{{$chip[$mdContactChipsCtrl.contactName]}}\
</div>\
</md-chip-template>\
</md-chips>';
/**
* MDContactChips Directive Definition
*
* @param $mdTheming
* @returns {*}
* ngInject
*/
function MdContactChips ($mdTheming, $mdUtil) {
return {
template: function(element, attrs) {
return MD_CONTACT_CHIPS_TEMPLATE;
},
restrict: 'E',
controller: 'MdContactChipsCtrl',
controllerAs: '$mdContactChipsCtrl',
bindToController: true,
compile: compile,
scope: {
contactQuery: '&mdContacts',
placeholder: '@',
secondaryPlaceholder: '@',
contactName: '@mdContactName',
contactImage: '@mdContactImage',
contactEmail: '@mdContactEmail',
contacts: '=ngModel',
requireMatch: '=?mdRequireMatch'
}
};
function compile(element, attr) {
return function postLink(scope, element, attrs, controllers) {
$mdUtil.initOptionalProperties(scope, attr);
$mdTheming(element);
element.attr('tabindex', '-1');
};
}
}
MdContactChips.$inject = ["$mdTheming", "$mdUtil"];
ng.material.components.chips = angular.module("material.components.chips");

View File

@ -0,0 +1,10 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-content.md-THEME_NAME-theme {
color: '{{foreground-1}}';
background-color: '{{background-color}}'; }

View File

@ -0,0 +1,20 @@
/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v0.10.1
*/
/* mixin definition ; sets LTR and RTL within the same style call */
md-content {
display: block;
position: relative;
overflow: auto;
-webkit-overflow-scrolling: touch; }
md-content[md-scroll-y] {
overflow-y: auto;
overflow-x: hidden; }
md-content[md-scroll-x] {
overflow-x: auto;
overflow-y: hidden; }
md-content.autoScroll {
-webkit-overflow-scrolling: auto; }

Some files were not shown because too many files have changed in this diff Show More