Merge branch 'core' into core-range
42
package-lock.json
generated
@ -4,6 +4,16 @@
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
"JSONStream": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/JSONStream/-/JSONStream-1.3.1.tgz",
|
||||
"integrity": "sha1-cH92HgHa6eFvG8+TcDt4xwlmV5o=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"jsonparse": "1.3.1",
|
||||
"through": "2.3.8"
|
||||
}
|
||||
},
|
||||
"abab": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/abab/-/abab-1.0.3.tgz",
|
||||
@ -1107,8 +1117,8 @@
|
||||
"integrity": "sha1-4ye1MZThp61dxjR57pCZpSsCSGU=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-text-path": "1.0.1",
|
||||
"JSONStream": "1.3.1",
|
||||
"is-text-path": "1.0.1",
|
||||
"lodash": "4.17.4",
|
||||
"meow": "3.7.0",
|
||||
"split2": "2.1.1",
|
||||
@ -1137,8 +1147,8 @@
|
||||
"integrity": "sha512-8od6g684Fhi5Vpp4ABRv/RBsW1AY6wSHbJHEK6FGTv+8jvAAnlABniZu/FVmX9TcirkHepaEsa1QGkRvbg0CKw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-text-path": "1.0.1",
|
||||
"JSONStream": "1.3.1",
|
||||
"is-text-path": "1.0.1",
|
||||
"lodash": "4.17.4",
|
||||
"meow": "3.7.0",
|
||||
"split2": "2.1.1",
|
||||
@ -2881,16 +2891,6 @@
|
||||
"integrity": "sha1-P02uSpH6wxX3EGL4UhzCOfE2YoA=",
|
||||
"dev": true
|
||||
},
|
||||
"JSONStream": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/JSONStream/-/JSONStream-1.3.1.tgz",
|
||||
"integrity": "sha1-cH92HgHa6eFvG8+TcDt4xwlmV5o=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"jsonparse": "1.3.1",
|
||||
"through": "2.3.8"
|
||||
}
|
||||
},
|
||||
"jsprim": {
|
||||
"version": "1.4.1",
|
||||
"resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
|
||||
@ -4659,15 +4659,6 @@
|
||||
"any-observable": "0.2.0"
|
||||
}
|
||||
},
|
||||
"string_decoder": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
|
||||
"integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"safe-buffer": "5.1.1"
|
||||
}
|
||||
},
|
||||
"string-length": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/string-length/-/string-length-1.0.1.tgz",
|
||||
@ -4688,6 +4679,15 @@
|
||||
"strip-ansi": "3.0.1"
|
||||
}
|
||||
},
|
||||
"string_decoder": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
|
||||
"integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"safe-buffer": "5.1.1"
|
||||
}
|
||||
},
|
||||
"stringstream": {
|
||||
"version": "0.0.5",
|
||||
"resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
|
||||
|
@ -3,8 +3,8 @@
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"devDependencies": {
|
||||
"lerna": "^2.0.0-rc.5",
|
||||
"jest": "^20.0.4",
|
||||
"lerna": "^2.0.0-rc.5",
|
||||
"np": "^2.16.0"
|
||||
}
|
||||
}
|
||||
|
@ -1,3 +1,54 @@
|
||||
# @ionic/core
|
||||
|
||||
This contains the core stencil components for ionic based applications.
|
||||
This contains the core stencil components for ionic based applications.
|
||||
|
||||
## Let's get started
|
||||
|
||||
### 1. Install global dependencies
|
||||
|
||||
- stencil
|
||||
- np
|
||||
- jest
|
||||
- tsc
|
||||
- tslint
|
||||
|
||||
```
|
||||
npm i -g stencil np jest tsc tslint
|
||||
```
|
||||
|
||||
### 2. Clone your ionic fork
|
||||
```
|
||||
git@github.com:ionic-team/ionic.git
|
||||
cd ionic
|
||||
```
|
||||
|
||||
### 3. Run `npm install`
|
||||
```
|
||||
npm install
|
||||
cd packages/core
|
||||
npm install
|
||||
````
|
||||
|
||||
Notice that ionic-core lives in `packages/core`.
|
||||
|
||||
### 4. Run `npm run dev`
|
||||
Make sure you are inside `packages/core`
|
||||
|
||||
|
||||
## How to contribute
|
||||
|
||||
1. `npm run dev` allows you to modify the components and have live reloading, just like another ionic app.
|
||||
|
||||
3. When everything looks good, run `npm run validate` to verify the tests linter and production build passes.
|
||||
|
||||
|
||||
## More commands
|
||||
|
||||
- `npm run build`: build ionic-core for production.
|
||||
- `npm run dev`: live reloading server for ionic developement,
|
||||
- `npm run test`: runs unit tests.
|
||||
- `npm run clean`: cleans dist folder.
|
||||
- `npm run lint`: runs typescript linter.
|
||||
- `npm run lint-fix`: tries to auto-fix linter issues.
|
||||
- `npm run validate`: runs tests, linter and production build.
|
||||
- `npm run deploy`: publishes a new version to NPM.
|
||||
|
6819
packages/core/package-lock.json
generated
@ -1,24 +1,30 @@
|
||||
{
|
||||
"name": "@ionic/core",
|
||||
"version": "0.0.2-8",
|
||||
"version": "0.0.2-16",
|
||||
"description": "Base components for Ionic",
|
||||
"main": "dist/collection/index.js",
|
||||
"types": "dist/collection/index.d.ts",
|
||||
"browser": "dist/ionic.js",
|
||||
"collection": "dist/collection/collection-manifest.json",
|
||||
"files": [
|
||||
"dist/",
|
||||
"README.md"
|
||||
"dist/"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@stencil/core": "^0.0.5-7",
|
||||
"@stencil/core": "0.0.5-23",
|
||||
"@stencil/dev-server": "latest",
|
||||
"@stencil/utils": "latest"
|
||||
"@stencil/utils": "latest",
|
||||
"tslint-ionic-rules": "0.0.11"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "stencil build",
|
||||
"dev": "sd concurrent \"stencil build --dev --watch\" \"stencil-dev-server\"",
|
||||
"publish": "npm run build && node scripts/publish.js && node scripts/publish.js && ../../node_modules/.bin/np --any-branch",
|
||||
"test": "jest --no-cache"
|
||||
"test": "jest --no-cache",
|
||||
"clean": "rm -rf dist",
|
||||
"lint": "tslint --project .",
|
||||
"lint-fix": "tslint --project . --fix",
|
||||
"validate": "npm run clean && npm run lint && npm run test && npm run build",
|
||||
"deploy": "np --any-branch",
|
||||
"preversion": "npm run lint && npm run build"
|
||||
},
|
||||
"author": "Ionic Team",
|
||||
"license": "MIT",
|
||||
|
@ -1,17 +0,0 @@
|
||||
var fs = require('fs');
|
||||
var path = require('path');
|
||||
|
||||
|
||||
var DIST = path.join(__dirname, '../dist/collection');
|
||||
var SRC = path.join(__dirname, '../src');
|
||||
var INDEX_JS_DIST = path.join(DIST, 'index.js');
|
||||
var INDEX_DTS_SRC = path.join(SRC, 'index.d.ts');
|
||||
var INDEX_DTS_DIST = path.join(DIST, 'index.d.ts');
|
||||
|
||||
console.log('publish: create', INDEX_JS_DIST);
|
||||
fs.writeFileSync(INDEX_JS_DIST, '');
|
||||
|
||||
|
||||
console.log('publish: create', INDEX_DTS_DIST);
|
||||
var srcIndexDTS = fs.readFileSync(INDEX_DTS_SRC, 'utf-8');
|
||||
fs.writeFileSync(INDEX_DTS_DIST, srcIndexDTS);
|
@ -11,7 +11,7 @@ export class ActionSheetController {
|
||||
private actionSheets: ActionSheet[] = [];
|
||||
|
||||
@Method()
|
||||
create(opts?: ActionSheetOptions) {
|
||||
create(opts?: ActionSheetOptions): Promise<ActionSheet> {
|
||||
// create ionic's wrapping ion-action-sheet component
|
||||
const actionSheet = document.createElement('ion-action-sheet');
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
import { Component, CssClassMap, Element, Event, EventEmitter, Listen, Prop } from '@stencil/core';
|
||||
import { AnimationBuilder, Animation, AnimationController, Config } from '../../index';
|
||||
import { Animation, AnimationBuilder, AnimationController, Config } from '../../index';
|
||||
|
||||
import iOSEnterAnimation from './animations/ios.enter';
|
||||
import iOSLeaveAnimation from './animations/ios.leave';
|
||||
@ -176,22 +176,22 @@ export class ActionSheet {
|
||||
return [
|
||||
<ion-backdrop
|
||||
onClick={this.backdropClick.bind(this)}
|
||||
class="action-sheet-backdrop"
|
||||
class='action-sheet-backdrop'
|
||||
/>,
|
||||
<div class="action-sheet-wrapper" role="dialog">
|
||||
<div class="action-sheet-container">
|
||||
<div class="action-sheet-group">
|
||||
<div class='action-sheet-wrapper' role='dialog'>
|
||||
<div class='action-sheet-container'>
|
||||
<div class='action-sheet-group'>
|
||||
{this.title
|
||||
? <div class="action-sheet-title">{this.title}</div>
|
||||
? <div class='action-sheet-title'>{this.title}</div>
|
||||
: null}
|
||||
{this.subTitle
|
||||
? <div class="action-sheet-sub-title">{this.subTitle}</div>
|
||||
? <div class='action-sheet-sub-title'>{this.subTitle}</div>
|
||||
: null}
|
||||
{buttons.map(b =>
|
||||
<button class={this.buttonClass(b)} onClick={() => this.click(b)}>
|
||||
<span class="button-inner">
|
||||
<span class='button-inner'>
|
||||
{b.icon
|
||||
? <ion-icon name={b.icon} class="action-sheet-icon" />
|
||||
? <ion-icon name={b.icon} class='action-sheet-icon' />
|
||||
: null}
|
||||
{b.text}
|
||||
</span>
|
||||
@ -199,7 +199,7 @@ export class ActionSheet {
|
||||
)}
|
||||
</div>
|
||||
{cancelButton
|
||||
? <div class="action-sheet-group">
|
||||
? <div class='action-sheet-group'>
|
||||
<button
|
||||
class={this.buttonClass(cancelButton)}
|
||||
onClick={() => this.click(cancelButton)}
|
||||
@ -207,7 +207,7 @@ export class ActionSheet {
|
||||
{cancelButton.icon
|
||||
? <ion-icon
|
||||
name={cancelButton.icon}
|
||||
class="action-sheet-icon"
|
||||
class='action-sheet-icon'
|
||||
/>
|
||||
: null}
|
||||
{cancelButton.text}
|
||||
|
@ -3,7 +3,7 @@ import { Animation } from '../../../index';
|
||||
/**
|
||||
* iOS Action Sheet Enter Animation
|
||||
*/
|
||||
export default function(Animation: Animation, baseElm: HTMLElement) {
|
||||
export default function iOSEnterAnimation(Animation: Animation, baseElm: HTMLElement): Animation {
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const backdropAnimation = new Animation();
|
||||
|
@ -3,7 +3,7 @@ import { Animation } from '../../../index';
|
||||
/**
|
||||
* iOS Action Sheet Leave Animation
|
||||
*/
|
||||
export default function(Animation: Animation, baseElm: HTMLElement) {
|
||||
export default function iOSLeaveAnimation(Animation: Animation, baseElm: HTMLElement): Animation {
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const backdropAnimation = new Animation();
|
||||
|
@ -11,7 +11,7 @@ export class AlertController {
|
||||
private alerts: Alert[] = [];
|
||||
|
||||
@Method()
|
||||
create(opts?: AlertOptions) {
|
||||
create(opts?: AlertOptions): Promise<Alert> {
|
||||
// create ionic's wrapping ion-alert component
|
||||
const alert = document.createElement('ion-alert');
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
|
||||
import { Component, CssClassMap, Element, Event, EventEmitter, Listen, Prop } from '@stencil/core';
|
||||
import { AnimationBuilder, Animation, AnimationController, Config } from '../../index';
|
||||
import { Animation, AnimationBuilder, AnimationController, Config } from '../../index';
|
||||
|
||||
import iOSEnterAnimation from './animations/ios.enter';
|
||||
import iOSLeaveAnimation from './animations/ios.leave';
|
||||
@ -38,7 +38,7 @@ export class Alert {
|
||||
@Prop() subTitle: string;
|
||||
@Prop() message: string;
|
||||
@Prop() buttons: AlertButton[] = [];
|
||||
@Prop({state: true}) inputs: AlertInput[] = [];
|
||||
@Prop({ mutable: true }) inputs: AlertInput[] = [];
|
||||
@Prop() enableBackdropDismiss: boolean = true;
|
||||
|
||||
@Prop() enterAnimation: AnimationBuilder;
|
||||
@ -233,12 +233,12 @@ export class Alert {
|
||||
if (inputs.length === 0) return null;
|
||||
|
||||
return (
|
||||
<div class="alert-checkbox-group">
|
||||
<div class='alert-checkbox-group'>
|
||||
{ inputs.map(i => (
|
||||
<button onClick={() => this.cbClick(i)} aria-checked={i.checked} id={i.id} disabled={i.disabled} role="checkbox" class="alert-tappable alert-checkbox alert-checkbox-button">
|
||||
<div class="button-inner">
|
||||
<div class="alert-checkbox-icon"><div class="alert-checkbox-inner"></div></div>
|
||||
<div class="alert-checkbox-label">
|
||||
<button onClick={() => this.cbClick(i)} aria-checked={i.checked} id={i.id} disabled={i.disabled} role='checkbox' class='alert-tappable alert-checkbox alert-checkbox-button'>
|
||||
<div class='button-inner'>
|
||||
<div class='alert-checkbox-icon'><div class='alert-checkbox-inner'></div></div>
|
||||
<div class='alert-checkbox-label'>
|
||||
{i.label}
|
||||
</div>
|
||||
</div>
|
||||
@ -254,12 +254,12 @@ export class Alert {
|
||||
if (inputs.length === 0) return null;
|
||||
|
||||
return (
|
||||
<div class="alert-radio-group" role="radiogroup" aria-labelledby={hdrId} aria-activedescendant={this.activeId}>
|
||||
<div class='alert-radio-group' role='radiogroup' aria-labelledby={hdrId} aria-activedescendant={this.activeId}>
|
||||
{ inputs.map(i => (
|
||||
<button onClick={() => this.rbClick(i)} aria-checked={i.checked} disabled={i.disabled} id={i.id} class="alert-radio-button alert-tappable alert-radio" role="radio">
|
||||
<div class="button-inner">
|
||||
<div class="alert-radio-icon"><div class="alert-radio-inner"></div></div>
|
||||
<div class="alert-radio-label">
|
||||
<button onClick={() => this.rbClick(i)} aria-checked={i.checked} disabled={i.disabled} id={i.id} class='alert-radio-button alert-tappable alert-radio' role='radio'>
|
||||
<div class='button-inner'>
|
||||
<div class='alert-radio-icon'><div class='alert-radio-inner'></div></div>
|
||||
<div class='alert-radio-label'>
|
||||
{i.label}
|
||||
</div>
|
||||
</div>
|
||||
@ -273,9 +273,9 @@ export class Alert {
|
||||
if (inputs.length === 0) return null;
|
||||
|
||||
return (
|
||||
<div class="alert-input-group">
|
||||
<div class='alert-input-group'>
|
||||
{ inputs.map(i => (
|
||||
<div class="alert-input-wrapper">
|
||||
<div class='alert-input-wrapper'>
|
||||
<input
|
||||
placeholder={i.placeholder}
|
||||
value={i.value}
|
||||
@ -283,7 +283,7 @@ export class Alert {
|
||||
min={i.min}
|
||||
max={i.max}
|
||||
id={i.id}
|
||||
class="alert-input"/>
|
||||
class='alert-input'/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
@ -336,7 +336,7 @@ export class Alert {
|
||||
if (inputTypes.indexOf(i.type) < 0) {
|
||||
inputTypes.push(i.type);
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
if (inputTypes.length > 1 && (inputTypes.indexOf('checkbox') > -1 || inputTypes.indexOf('radio') > -1)) {
|
||||
console.warn(`Alert cannot mix input types: ${(inputTypes.join('/'))}. Please see alert docs for more info.`);
|
||||
@ -347,21 +347,21 @@ export class Alert {
|
||||
return [
|
||||
<ion-backdrop
|
||||
onClick={this.backdropClick.bind(this)}
|
||||
class="alert-backdrop"
|
||||
class='alert-backdrop'
|
||||
/>,
|
||||
<div class="alert-wrapper">
|
||||
<div class="alert-head">
|
||||
<div class='alert-wrapper'>
|
||||
<div class='alert-head'>
|
||||
{this.title
|
||||
? <h2 id={hdrId} class="alert-title">{this.title}</h2>
|
||||
? <h2 id={hdrId} class='alert-title'>{this.title}</h2>
|
||||
: null}
|
||||
{this.subTitle
|
||||
? <h2 id={subHdrId} class="alert-sub-title">{this.subTitle}</h2>
|
||||
? <h2 id={subHdrId} class='alert-sub-title'>{this.subTitle}</h2>
|
||||
: null}
|
||||
</div>
|
||||
<div id={msgId} class="alert-message" innerHTML={this.message}></div>
|
||||
<div id={msgId} class='alert-message' innerHTML={this.message}></div>
|
||||
|
||||
{(() => {
|
||||
switch(this.inputType) {
|
||||
switch (this.inputType) {
|
||||
case 'checkbox':
|
||||
return this.renderCheckbox(this.inputs);
|
||||
|
||||
@ -370,13 +370,13 @@ export class Alert {
|
||||
|
||||
default:
|
||||
return this.renderInput(this.inputs);
|
||||
};
|
||||
}
|
||||
})()}
|
||||
|
||||
<div class={alertButtonGroupClass}>
|
||||
{buttons.map(b =>
|
||||
<button class={this.buttonClass(b)} onClick={() => this.btnClick(b)}>
|
||||
<span class="button-inner">
|
||||
<span class='button-inner'>
|
||||
{b.text}
|
||||
</span>
|
||||
</button>
|
||||
@ -418,7 +418,7 @@ export interface AlertButton {
|
||||
role?: string;
|
||||
cssClass?: string;
|
||||
handler?: (value: any) => boolean|void;
|
||||
};
|
||||
}
|
||||
|
||||
export interface AlertEvent {
|
||||
detail: {
|
||||
|
@ -3,7 +3,7 @@ import { Animation } from '../../../index';
|
||||
/**
|
||||
* iOS Alert Enter Animation
|
||||
*/
|
||||
export default function(Animation: Animation, baseElm: HTMLElement) {
|
||||
export default function iOSEnterAnimation(Animation: Animation, baseElm: HTMLElement): Animation {
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const backdropAnimation = new Animation();
|
||||
|
@ -3,7 +3,7 @@ import { Animation } from '../../../index';
|
||||
/**
|
||||
* iOS Alert Leave Animation
|
||||
*/
|
||||
export default function(Animation: Animation, baseElm: HTMLElement) {
|
||||
export default function iOSLeaveAnimation(Animation: Animation, baseElm: HTMLElement): Animation {
|
||||
const baseAnimation = new Animation();
|
||||
|
||||
const backdropAnimation = new Animation();
|
||||
|
@ -1,10 +1,11 @@
|
||||
import { AnimationOptions, EffectProperty, EffectState, PlayOptions } from './animation-interface';
|
||||
import { CSS_PROP, CSS_VALUE_REGEX, DURATION_MIN, TRANSITION_END_FALLBACK_PADDING_MS, TRANSFORM_PROPS } from './constants';
|
||||
import { CSS_PROP, CSS_VALUE_REGEX, DURATION_MIN, TRANSFORM_PROPS, TRANSITION_END_FALLBACK_PADDING_MS } from './constants';
|
||||
import { transitionEnd } from './transition-end';
|
||||
|
||||
|
||||
|
||||
export class Animator {
|
||||
|
||||
private _afterAddClasses: string[];
|
||||
private _afterRemoveClasses: string[];
|
||||
private _afterStyles: { [property: string]: any; };
|
||||
@ -639,7 +640,7 @@ export class Animator {
|
||||
|
||||
// flip the number if we're going in reverse
|
||||
if (this._isReverse) {
|
||||
stepValue = ((stepValue * -1) + 1);
|
||||
stepValue = 1 - stepValue;
|
||||
}
|
||||
var i = 0;
|
||||
var j = 0;
|
||||
@ -1023,12 +1024,6 @@ export class Animator {
|
||||
children[i].progressStep(stepValue);
|
||||
}
|
||||
|
||||
if (this._isReverse) {
|
||||
// if the animation is going in reverse then
|
||||
// flip the step value: 0 becomes 1, 1 becomes 0
|
||||
stepValue = ((stepValue * -1) + 1);
|
||||
}
|
||||
|
||||
// ******** DOM WRITE ****************
|
||||
this._progress(stepValue);
|
||||
}
|
||||
|
5
packages/core/src/components/app/app-interfaces.ts
Normal file
@ -0,0 +1,5 @@
|
||||
import { Config } from '../..';
|
||||
export interface App {
|
||||
element?: HTMLElement;
|
||||
config?: Config;
|
||||
}
|
@ -1,5 +1,10 @@
|
||||
import { Component } from '@stencil/core';
|
||||
import { Component, Element, Listen, Prop } from '@stencil/core';
|
||||
import { Nav, NavContainer } from '../../navigation/nav-interfaces';
|
||||
import { Config } from '../..';
|
||||
import { App } from './app-interfaces';
|
||||
import { isReady } from '../../utils/helpers';
|
||||
|
||||
const rootNavs = new Map<number, Nav>();
|
||||
|
||||
@Component({
|
||||
tag: 'ion-app',
|
||||
@ -12,8 +17,114 @@ import { Component } from '@stencil/core';
|
||||
theme: 'app'
|
||||
}
|
||||
})
|
||||
export class App {
|
||||
export class IonApp implements App {
|
||||
|
||||
@Element() element: HTMLElement;
|
||||
@Prop({ context: 'config' }) config: Config;
|
||||
|
||||
@Listen('body:navInit')
|
||||
registerRootNav(event: CustomEvent) {
|
||||
rootNavs.set((event.detail as Nav).id, (event.detail as Nav));
|
||||
}
|
||||
|
||||
|
||||
|
||||
componentWillLoad() {
|
||||
componentDidLoadImpl(this);
|
||||
}
|
||||
|
||||
getActiveNavs(rootNavId?: number): Nav[] {
|
||||
/*const portal = portals.get(PORTAL_MODAL);
|
||||
if (portal && portal.views && portal.views.length) {
|
||||
return findTopNavs(portal);
|
||||
}
|
||||
*/
|
||||
// TODO - figure out if a modal is open, don't use portal
|
||||
if (!rootNavs.size) {
|
||||
return [];
|
||||
}
|
||||
if (rootNavId) {
|
||||
return findTopNavs(rootNavs.get(rootNavId));
|
||||
}
|
||||
if (rootNavs.size === 1) {
|
||||
return findTopNavs(rootNavs.values().next().value);
|
||||
}
|
||||
// fallback to just using all root navs
|
||||
let activeNavs: Nav[] = [];
|
||||
rootNavs.forEach(nav => {
|
||||
activeNavs = activeNavs.concat(findTopNavs(nav));
|
||||
});
|
||||
return activeNavs;
|
||||
}
|
||||
|
||||
getNavByIdOrName(nameOrId: number | string) {
|
||||
const navs = Array.from(rootNavs.values());
|
||||
for (const navContainer of navs) {
|
||||
const match = getNavByIdOrNameImpl(navContainer, nameOrId);
|
||||
if (match) {
|
||||
return match;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
render() {
|
||||
return <slot></slot>;
|
||||
return ([
|
||||
<slot></slot>
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export function findTopNavs(nav: NavContainer): NavContainer[] {
|
||||
let containers: NavContainer[] = [];
|
||||
const childNavs = nav.getActiveChildNavs();
|
||||
if (!childNavs || !childNavs.length) {
|
||||
containers.push(nav);
|
||||
} else {
|
||||
childNavs.forEach(childNav => {
|
||||
const topNavs = findTopNavs(childNav);
|
||||
containers = containers.concat(topNavs);
|
||||
});
|
||||
}
|
||||
return containers;
|
||||
}
|
||||
|
||||
export function getNavByIdOrNameImpl(nav: NavContainer, id: number | string): NavContainer {
|
||||
if (nav.id === id || nav.name === id) {
|
||||
return nav;
|
||||
}
|
||||
for (const child of nav.getAllChildNavs()) {
|
||||
const tmp = getNavByIdOrNameImpl(child, id);
|
||||
if (tmp) {
|
||||
return tmp;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export function componentDidLoadImpl(app: App) {
|
||||
app.element.classList.add(app.config.get('mode'));
|
||||
// TODO add platform classes
|
||||
if (app.config.getBoolean('hoverCSS', true)) {
|
||||
app.element.classList.add('enable-hover');
|
||||
}
|
||||
// TODO fire platform ready
|
||||
}
|
||||
|
||||
export function handleBackButtonClick(): Promise<any> {
|
||||
// if there is a menu controller dom element, hydrate it, otherwise move on
|
||||
// TODO ensure ion-menu-controller is the name
|
||||
const menuControllerElement = document.querySelector('ion-menu-controller'); // TODO - use menu controller types
|
||||
const promise = menuControllerElement ? isReady(menuControllerElement) : Promise.resolve();
|
||||
return promise.then(() => {
|
||||
// TODO check if the menu is open, close it if so
|
||||
console.log('todo');
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { Component, Element, Prop, CssClassMap } from '@stencil/core';
|
||||
import { Component, CssClassMap, Element, Prop } from '@stencil/core';
|
||||
|
||||
import { getElementClassObject } from '../../utils/theme';
|
||||
|
||||
@ -202,7 +202,7 @@ export class Button {
|
||||
const buttonClasses = {
|
||||
...hostClasses,
|
||||
...elementClasses
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<TagType class={buttonClasses} disabled={this.disabled}>
|
||||
|
@ -88,17 +88,17 @@ export class Checkbox {
|
||||
/*
|
||||
* @input {boolean} If true, the checkbox is checked. Default false.
|
||||
*/
|
||||
@Prop({ state: true }) checked: boolean = false;
|
||||
@Prop({ mutable: true }) checked: boolean = false;
|
||||
|
||||
/*
|
||||
* @input {boolean} If true, the user cannot interact with this element. Default false.
|
||||
*/
|
||||
@Prop({ state: true }) disabled: boolean = false;
|
||||
@Prop({ mutable: true }) disabled: boolean = false;
|
||||
|
||||
/**
|
||||
* @input {string} the value of the checkbox.
|
||||
*/
|
||||
@Prop({ state: true }) value: string;
|
||||
@Prop({ mutable: true }) value: string;
|
||||
|
||||
|
||||
ionViewWillLoad() {
|
||||
|
@ -92,7 +92,7 @@ export class ChipButton {
|
||||
const buttonClasses = {
|
||||
...hostClasses,
|
||||
...elementClasses
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<TagType class={buttonClasses} disabled={this.disabled}>
|
||||
|
@ -111,7 +111,7 @@ export class Content {
|
||||
...themedClasses,
|
||||
...hostClasses,
|
||||
'statusbar-padding': this.config.getBoolean('statusbarPadding')
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ion-scroll style={scrollStyle} props={props} class={scrollClasses}>
|
||||
|
8
packages/core/src/components/datetime/datetime-util.ts
Normal file
@ -0,0 +1,8 @@
|
||||
|
||||
|
||||
export interface LocaleData {
|
||||
monthNames?: string[];
|
||||
monthShortNames?: string[];
|
||||
dayNames?: string[];
|
||||
dayShortNames?: string[];
|
||||
}
|
29
packages/core/src/components/datetime/datetime.ios.scss
Normal file
@ -0,0 +1,29 @@
|
||||
@import "../../themes/ionic.globals.ios";
|
||||
@import "./datetime";
|
||||
|
||||
// iOS DateTime
|
||||
// --------------------------------------------------
|
||||
|
||||
/// @prop - Padding top of the DateTime component
|
||||
$datetime-ios-padding-top: $item-ios-padding-top !default;
|
||||
|
||||
/// @prop - Padding end of the DateTime component
|
||||
$datetime-ios-padding-end: ($item-ios-padding-end / 2) !default;
|
||||
|
||||
/// @prop - Padding bottom of the DateTime component
|
||||
$datetime-ios-padding-bottom: $item-ios-padding-bottom !default;
|
||||
|
||||
/// @prop - Padding start of the DateTime component
|
||||
$datetime-ios-padding-start: $item-ios-padding-start !default;
|
||||
|
||||
/// @prop - Color of the DateTime placeholder
|
||||
$datetime-ios-placeholder-color: #999 !default;
|
||||
|
||||
|
||||
.datetime-ios {
|
||||
@include padding($datetime-ios-padding-top, $datetime-ios-padding-end, $datetime-ios-padding-bottom, $datetime-ios-padding-start);
|
||||
}
|
||||
|
||||
.datetime-ios .datetime-placeholder {
|
||||
color: $datetime-ios-placeholder-color;
|
||||
}
|
29
packages/core/src/components/datetime/datetime.md.scss
Normal file
@ -0,0 +1,29 @@
|
||||
@import "../../themes/ionic.globals.md";
|
||||
@import "./datetime";
|
||||
|
||||
// Material Design DateTime
|
||||
// --------------------------------------------------
|
||||
|
||||
/// @prop - Padding top of the DateTime component
|
||||
$datetime-md-padding-top: $item-md-padding-top !default;
|
||||
|
||||
/// @prop - Padding end of the DateTime component
|
||||
$datetime-md-padding-end: ($item-md-padding-end / 2) !default;
|
||||
|
||||
/// @prop - Padding bottom of the DateTime component
|
||||
$datetime-md-padding-bottom: $item-md-padding-bottom !default;
|
||||
|
||||
/// @prop - Padding start of the DateTime component
|
||||
$datetime-md-padding-start: $item-md-padding-start !default;
|
||||
|
||||
/// @prop - Color of the DateTime placeholder
|
||||
$datetime-md-placeholder-color: #999 !default;
|
||||
|
||||
|
||||
.datetime-md {
|
||||
@include padding($datetime-md-padding-top, $datetime-md-padding-end, $datetime-md-padding-bottom, $datetime-md-padding-start);
|
||||
}
|
||||
|
||||
.datetime-md .datetime-placeholder {
|
||||
color: $datetime-md-placeholder-color;
|
||||
}
|
37
packages/core/src/components/datetime/datetime.scss
Normal file
@ -0,0 +1,37 @@
|
||||
@import "../../themes/ionic.globals";
|
||||
|
||||
// DateTime
|
||||
// --------------------------------------------------
|
||||
|
||||
ion-datetime {
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.datetime-text {
|
||||
overflow: hidden;
|
||||
|
||||
flex: 1;
|
||||
|
||||
min-width: 16px;
|
||||
min-height: 1.2em;
|
||||
|
||||
font-size: inherit;
|
||||
line-height: 1.2;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.datetime-disabled,
|
||||
.item-datetime-disabled ion-label {
|
||||
opacity: .4;
|
||||
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.item-label-stacked ion-datetime,
|
||||
.item-label-floating ion-datetime {
|
||||
@include padding-horizontal(0, null);
|
||||
|
||||
width: 100%;
|
||||
}
|
905
packages/core/src/components/datetime/datetime.tsx
Normal file
@ -0,0 +1,905 @@
|
||||
import { Component, CssClassMap, Event, EventEmitter, Prop } from '@stencil/core';
|
||||
|
||||
import { LocaleData } from './datetime-util';
|
||||
|
||||
import { isArray, isString } from '../../utils/helpers';
|
||||
|
||||
/**
|
||||
* @name DateTime
|
||||
* @description
|
||||
* The DateTime component is used to present an interface which makes it easy for
|
||||
* users to select dates and times. Tapping on `<ion-datetime>` will display a picker
|
||||
* interface that slides up from the bottom of the page. The picker then displays
|
||||
* scrollable columns that can be used to individually select years, months, days,
|
||||
* hours and minute values. The DateTime component is similar to the native
|
||||
* `<input type="datetime-local">` element, however, Ionic's DateTime component makes
|
||||
* it easy to display the date and time in a preferred format, and manage the datetime
|
||||
* values.
|
||||
*
|
||||
* ```html
|
||||
* <ion-item>
|
||||
* <ion-label>Date</ion-label>
|
||||
* <ion-datetime displayFormat="MM/DD/YYYY" [(ngModel)]="myDate"></ion-datetime>
|
||||
* </ion-item>
|
||||
* ```
|
||||
*
|
||||
*
|
||||
* ## Display and Picker Formats
|
||||
*
|
||||
* The DateTime component displays the values in two places: in the `<ion-datetime>`
|
||||
* component, and in the interface that is presented from the bottom of the screen.
|
||||
* The following chart lists all of the formats that can be used.
|
||||
*
|
||||
* | Format | Description | Example |
|
||||
* |---------|--------------------------------|-------------------------|
|
||||
* | `YYYY` | Year, 4 digits | `2018` |
|
||||
* | `YY` | Year, 2 digits | `18` |
|
||||
* | `M` | Month | `1` ... `12` |
|
||||
* | `MM` | Month, leading zero | `01` ... `12` |
|
||||
* | `MMM` | Month, short name | `Jan` |
|
||||
* | `MMMM` | Month, full name | `January` |
|
||||
* | `D` | Day | `1` ... `31` |
|
||||
* | `DD` | Day, leading zero | `01` ... `31` |
|
||||
* | `DDD` | Day, short name | `Fri` |
|
||||
* | `DDDD` | Day, full name | `Friday` |
|
||||
* | `H` | Hour, 24-hour | `0` ... `23` |
|
||||
* | `HH` | Hour, 24-hour, leading zero | `00` ... `23` |
|
||||
* | `h` | Hour, 12-hour | `1` ... `12` |
|
||||
* | `hh` | Hour, 12-hour, leading zero | `01` ... `12` |
|
||||
* | `a` | 12-hour time period, lowercase | `am` `pm` |
|
||||
* | `A` | 12-hour time period, uppercase | `AM` `PM` |
|
||||
* | `m` | Minute | `1` ... `59` |
|
||||
* | `mm` | Minute, leading zero | `01` ... `59` |
|
||||
* | `s` | Second | `1` ... `59` |
|
||||
* | `ss` | Second, leading zero | `01` ... `59` |
|
||||
* | `Z` | UTC Timezone Offset | `Z or +HH:mm or -HH:mm` |
|
||||
*
|
||||
* **Important**: See the [Month Names and Day of the Week Names](#month-names-and-day-of-the-week-names)
|
||||
* section below on how to use different names for the month and day.
|
||||
*
|
||||
* ### Display Format
|
||||
*
|
||||
* The `displayFormat` input property specifies how a datetime's value should be
|
||||
* printed, as formatted text, within the `ion-datetime` component.
|
||||
*
|
||||
* In the following example, the display in the `<ion-datetime>` will use the
|
||||
* month's short name, the numerical day with a leading zero, a comma and the
|
||||
* four-digit year. In addition to the date, it will display the time with the hours
|
||||
* in the 24-hour format and the minutes. Any character can be used as a separator.
|
||||
* An example display using this format is: `Jun 17, 2005 11:06`.
|
||||
*
|
||||
* ```html
|
||||
* <ion-item>
|
||||
* <ion-label>Date</ion-label>
|
||||
* <ion-datetime displayFormat="MMM DD, YYYY HH:mm" [(ngModel)]="myDate"></ion-datetime>
|
||||
* </ion-item>
|
||||
* ```
|
||||
*
|
||||
* ### Picker Format
|
||||
*
|
||||
* The `pickerFormat` input property determines which columns should be shown in the
|
||||
* interface, the order of the columns, and which format to use within each column.
|
||||
* If the `pickerFormat` input is not provided then it will default to the `displayFormat`.
|
||||
*
|
||||
* In the following example, the display in the `<ion-datetime>` will use the
|
||||
* `MM/YYYY` format, such as `06/2020`. However, the picker interface
|
||||
* will display two columns with the month's long name, and the four-digit year.
|
||||
*
|
||||
* ```html
|
||||
* <ion-item>
|
||||
* <ion-label>Date</ion-label>
|
||||
* <ion-datetime displayFormat="MM/YYYY" pickerFormat="MMMM YYYY" [(ngModel)]="myDate"></ion-datetime>
|
||||
* </ion-item>
|
||||
* ```
|
||||
*
|
||||
* ### Datetime Data
|
||||
*
|
||||
* Historically, handling datetime values within JavaScript, or even within HTML
|
||||
* inputs, has always been a challenge. Specifically, JavaScript's `Date` object is
|
||||
* notoriously difficult to correctly parse apart datetime strings or to format
|
||||
* datetime values. Even worse is how different browsers and JavaScript versions
|
||||
* parse various datetime strings differently, especially per locale.
|
||||
*
|
||||
* But no worries, all is not lost! Ionic's datetime input has been designed so
|
||||
* developers can avoid the common pitfalls, allowing developers to easily format
|
||||
* datetime values within the input, and give the user a simple datetime picker for a
|
||||
* great user experience.
|
||||
*
|
||||
* ##### ISO 8601 Datetime Format: YYYY-MM-DDTHH:mmZ
|
||||
*
|
||||
* Ionic uses the [ISO 8601 datetime format](https://www.w3.org/TR/NOTE-datetime)
|
||||
* for its value. The value is simply a string, rather than using JavaScript's `Date`
|
||||
* object. Additionally, when using the ISO datetime format, it makes it easier
|
||||
* to serialize and pass within JSON objects, and sending databases a standardized
|
||||
* format which it can be easily parsed if need be.
|
||||
*
|
||||
* An ISO format can be used as a simple year, or just the hour and minute, or get more
|
||||
* detailed down to the millisecond and timezone. Any of the ISO formats below can be used,
|
||||
* and after a user selects a new value, Ionic will continue to use the same ISO format
|
||||
* which datetime value was originally given as.
|
||||
*
|
||||
* | Description | Format | Datetime Value Example |
|
||||
* |----------------------|------------------------|------------------------------|
|
||||
* | Year | YYYY | 1994 |
|
||||
* | Year and Month | YYYY-MM | 1994-12 |
|
||||
* | Complete Date | YYYY-MM-DD | 1994-12-15 |
|
||||
* | Date and Time | YYYY-MM-DDTHH:mm | 1994-12-15T13:47 |
|
||||
* | UTC Timezone | YYYY-MM-DDTHH:mm:ssTZD | 1994-12-15T13:47:20.789Z |
|
||||
* | Timezone Offset | YYYY-MM-DDTHH:mm:ssTZD | 1994-12-15T13:47:20.789+5:00 |
|
||||
* | Hour and Minute | HH:mm | 13:47 |
|
||||
* | Hour, Minute, Second | HH:mm:ss | 13:47:20 |
|
||||
*
|
||||
* Note that the year is always four-digits, milliseconds (if it's added) is always
|
||||
* three-digits, and all others are always two-digits. So the number representing
|
||||
* January always has a leading zero, such as `01`. Additionally, the hour is always
|
||||
* in the 24-hour format, so `00` is `12am` on a 12-hour clock, `13` means `1pm`,
|
||||
* and `23` means `11pm`.
|
||||
*
|
||||
* It's also important to note that neither the `displayFormat` or `pickerFormat` can
|
||||
* set the datetime value's output, which is the value that is set by the component's
|
||||
* `ngModel`. The format's are merely for displaying the value as text and the picker's
|
||||
* interface, but the datetime's value is always persisted as a valid ISO 8601 datetime
|
||||
* string.
|
||||
*
|
||||
*
|
||||
* ## Min and Max Datetimes
|
||||
*
|
||||
* Dates are infinite in either direction, so for a user's selection there should be at
|
||||
* least some form of restricting the dates that can be selected. By default, the maximum
|
||||
* date is to the end of the current year, and the minimum date is from the beginning
|
||||
* of the year that was 100 years ago.
|
||||
*
|
||||
* To customize the minimum and maximum datetime values, the `min` and `max` component
|
||||
* inputs can be provided which may make more sense for the app's use-case, rather
|
||||
* than the default of the last 100 years. Following the same IS0 8601 format listed
|
||||
* in the table above, each component can restrict which dates can be selected by the
|
||||
* user. Below is an example of restricting the date selection between the beginning
|
||||
* of 2016, and October 31st of 2020:
|
||||
*
|
||||
* ```html
|
||||
* <ion-item>
|
||||
* <ion-label>Date</ion-label>
|
||||
* <ion-datetime displayFormat="MMMM YYYY" min="2016" max="2020-10-31" [(ngModel)]="myDate">
|
||||
* </ion-datetime>
|
||||
* </ion-item>
|
||||
* ```
|
||||
*
|
||||
*
|
||||
* ## Month Names and Day of the Week Names
|
||||
*
|
||||
* At this time, there is no one-size-fits-all standard to automatically choose the correct
|
||||
* language/spelling for a month name, or day of the week name, depending on the language
|
||||
* or locale. Good news is that there is an
|
||||
* [Intl.DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat)
|
||||
* standard which *most* browsers have adopted. However, at this time the standard has not
|
||||
* been fully implemented by all popular browsers so Ionic is unavailable to take advantage
|
||||
* of it *yet*. Additionally, Angular also provides an internationalization service, but it
|
||||
* is still under heavy development so Ionic does not depend on it at this time.
|
||||
*
|
||||
* All things considered, the by far easiest solution is to just provide an array of names
|
||||
* if the app needs to use names other than the default English version of month and day
|
||||
* names. The month names and day names can be either configured at the app level, or
|
||||
* individual `ion-datetime` level.
|
||||
*
|
||||
* ### App Config Level
|
||||
*
|
||||
* ```ts
|
||||
* //app.module.ts
|
||||
* @NgModule({
|
||||
* ...,
|
||||
* imports: [
|
||||
* IonicModule.forRoot(MyApp, {
|
||||
* monthNames: ['janeiro', 'fevereiro', 'mar\u00e7o', ... ],
|
||||
* monthShortNames: ['jan', 'fev', 'mar', ... ],
|
||||
* dayNames: ['domingo', 'segunda-feira', 'ter\u00e7a-feira', ... ],
|
||||
* dayShortNames: ['dom', 'seg', 'ter', ... ],
|
||||
* })
|
||||
* ],
|
||||
* ...
|
||||
* })
|
||||
* ```
|
||||
*
|
||||
* ### Component Input Level
|
||||
*
|
||||
* ```html
|
||||
* <ion-item>
|
||||
* <ion-label>Período</ion-label>
|
||||
* <ion-datetime displayFormat="DDDD MMM D, YYYY" [(ngModel)]="myDate"
|
||||
* monthNames="janeiro, fevereiro, mar\u00e7o, ..."
|
||||
* monthShortNames="jan, fev, mar, ..."
|
||||
* dayNames="domingo, segunda-feira, ter\u00e7a-feira, ..."
|
||||
* dayShortNames="dom, seg, ter, ..."></ion-datetime>
|
||||
* </ion-item>
|
||||
* ```
|
||||
*
|
||||
*
|
||||
* ### Advanced Datetime Validation and Manipulation
|
||||
*
|
||||
* The datetime picker provides the simplicity of selecting an exact format, and persists
|
||||
* the datetime values as a string using the standardized
|
||||
* [ISO 8601 datetime format](https://www.w3.org/TR/NOTE-datetime).
|
||||
* However, it's important to note that `ion-datetime` does not attempt to solve all
|
||||
* situtations when validating and manipulating datetime values. If datetime values need
|
||||
* to be parsed from a certain format, or manipulated (such as adding 5 days to a date,
|
||||
* subtracting 30 minutes, etc.), or even formatting data to a specific locale, then we highly
|
||||
* recommend using [moment.js](http://momentjs.com/) to "Parse, validate, manipulate, and
|
||||
* display dates in JavaScript". [Moment.js](http://momentjs.com/) has quickly become
|
||||
* our goto standard when dealing with datetimes within JavaScript, but Ionic does not
|
||||
* prepackage this dependency since most apps will not require it, and its locale
|
||||
* configuration should be decided by the end-developer.
|
||||
*
|
||||
*
|
||||
* @usage
|
||||
* ```html
|
||||
* <ion-item>
|
||||
* <ion-label>Date</ion-label>
|
||||
* <ion-datetime displayFormat="MM/DD/YYYY" [(ngModel)]="myDate">
|
||||
* </ion-datetime>
|
||||
* </ion-item>
|
||||
* ```
|
||||
*
|
||||
*
|
||||
* @demo /docs/demos/src/datetime/
|
||||
*/
|
||||
@Component({
|
||||
tag: 'ion-datetime',
|
||||
styleUrls: {
|
||||
ios: 'datetime.ios.scss',
|
||||
md: 'datetime.md.scss',
|
||||
wp: 'datetime.wp.scss'
|
||||
},
|
||||
host: {
|
||||
theme: 'datetime'
|
||||
}
|
||||
})
|
||||
export class DateTime {
|
||||
text: any;
|
||||
id: string;
|
||||
labelId: string;
|
||||
locale: LocaleData = {};
|
||||
|
||||
/**
|
||||
* @input {boolean} If true, the user cannot interact with this element. Defaults to `false`.
|
||||
*/
|
||||
@Prop() disabled: boolean = false;
|
||||
|
||||
/**
|
||||
* @input {string} The minimum datetime allowed. Value must be a date string
|
||||
* following the
|
||||
* [ISO 8601 datetime format standard](https://www.w3.org/TR/NOTE-datetime),
|
||||
* such as `1996-12-19`. The format does not have to be specific to an exact
|
||||
* datetime. For example, the minimum could just be the year, such as `1994`.
|
||||
* Defaults to the beginning of the year, 100 years ago from today.
|
||||
*/
|
||||
@Prop() min: string;
|
||||
|
||||
/**
|
||||
* @input {string} The maximum datetime allowed. Value must be a date string
|
||||
* following the
|
||||
* [ISO 8601 datetime format standard](https://www.w3.org/TR/NOTE-datetime),
|
||||
* `1996-12-19`. The format does not have to be specific to an exact
|
||||
* datetime. For example, the maximum could just be the year, such as `1994`.
|
||||
* Defaults to the end of this year.
|
||||
*/
|
||||
@Prop() max: string;
|
||||
|
||||
/**
|
||||
* @input {string} The display format of the date and time as text that shows
|
||||
* within the item. When the `pickerFormat` input is not used, then the
|
||||
* `displayFormat` is used for both display the formatted text, and determining
|
||||
* the datetime picker's columns. See the `pickerFormat` input description for
|
||||
* more info. Defaults to `MMM D, YYYY`.
|
||||
*/
|
||||
@Prop() displayFormat: string = 'MMM D, YYYY';
|
||||
|
||||
/**
|
||||
* @input {string} The format of the date and time picker columns the user selects.
|
||||
* A datetime input can have one or many datetime parts, each getting their
|
||||
* own column which allow individual selection of that particular datetime part. For
|
||||
* example, year and month columns are two individually selectable columns which help
|
||||
* choose an exact date from the datetime picker. Each column follows the string
|
||||
* parse format. Defaults to use `displayFormat`.
|
||||
*/
|
||||
@Prop() pickerFormat: string;
|
||||
|
||||
/**
|
||||
* @input {string} The text to display on the picker's cancel button. Default: `Cancel`.
|
||||
*/
|
||||
@Prop() cancelText: string = 'Cancel';
|
||||
|
||||
/**
|
||||
* @input {string} The text to display on the picker's "Done" button. Default: `Done`.
|
||||
*/
|
||||
@Prop() doneText: string = 'Done';
|
||||
|
||||
/**
|
||||
* @input {array | string} Values used to create the list of selectable years. By default
|
||||
* the year values range between the `min` and `max` datetime inputs. However, to
|
||||
* control exactly which years to display, the `yearValues` input can take either an array
|
||||
* of numbers, or string of comma separated numbers. For example, to show upcoming and
|
||||
* recent leap years, then this input's value would be `yearValues="2024,2020,2016,2012,2008"`.
|
||||
*/
|
||||
@Prop() yearValues: any;
|
||||
|
||||
/**
|
||||
* @input {array | string} Values used to create the list of selectable months. By default
|
||||
* the month values range from `1` to `12`. However, to control exactly which months to
|
||||
* display, the `monthValues` input can take either an array of numbers, or string of
|
||||
* comma separated numbers. For example, if only summer months should be shown, then this
|
||||
* input value would be `monthValues="6,7,8"`. Note that month numbers do *not* have a
|
||||
* zero-based index, meaning January's value is `1`, and December's is `12`.
|
||||
*/
|
||||
@Prop() monthValues: any;
|
||||
|
||||
/**
|
||||
* @input {array | string} Values used to create the list of selectable days. By default
|
||||
* every day is shown for the given month. However, to control exactly which days of
|
||||
* the month to display, the `dayValues` input can take either an array of numbers, or
|
||||
* string of comma separated numbers. Note that even if the array days have an invalid
|
||||
* number for the selected month, like `31` in February, it will correctly not show
|
||||
* days which are not valid for the selected month.
|
||||
*/
|
||||
@Prop() dayValues: any;
|
||||
|
||||
/**
|
||||
* @input {array | string} Values used to create the list of selectable hours. By default
|
||||
* the hour values range from `0` to `23` for 24-hour, or `1` to `12` for 12-hour. However,
|
||||
* to control exactly which hours to display, the `hourValues` input can take either an
|
||||
* array of numbers, or string of comma separated numbers.
|
||||
*/
|
||||
@Prop() hourValues: any;
|
||||
|
||||
/**
|
||||
* @input {array | string} Values used to create the list of selectable minutes. By default
|
||||
* the mintues range from `0` to `59`. However, to control exactly which minutes to display,
|
||||
* the `minuteValues` input can take either an array of numbers, or string of comma separated
|
||||
* numbers. For example, if the minute selections should only be every 15 minutes, then
|
||||
* this input value would be `minuteValues="0,15,30,45"`.
|
||||
*/
|
||||
@Prop() minuteValues: any;
|
||||
|
||||
/**
|
||||
* @input {array} Full names for each month name. This can be used to provide
|
||||
* locale month names. Defaults to English.
|
||||
*/
|
||||
@Prop() monthNames: any;
|
||||
|
||||
/**
|
||||
* @input {array} Short abbreviated names for each month name. This can be used to provide
|
||||
* locale month names. Defaults to English.
|
||||
*/
|
||||
@Prop() monthShortNames: any;
|
||||
|
||||
/**
|
||||
* @input {array} Full day of the week names. This can be used to provide
|
||||
* locale names for each day in the week. Defaults to English.
|
||||
*/
|
||||
@Prop() dayNames: any;
|
||||
|
||||
/**
|
||||
* @input {array} Short abbreviated day of the week names. This can be used to provide
|
||||
* locale names for each day in the week. Defaults to English.
|
||||
*/
|
||||
@Prop() dayShortNames: any;
|
||||
|
||||
/**
|
||||
* @input {any} Any additional options that the picker interface can accept.
|
||||
* See the [Picker API docs](../../picker/Picker) for the picker options.
|
||||
*/
|
||||
@Prop() pickerOptions: any = {};
|
||||
|
||||
/**
|
||||
* @input {string} The text to display when there's no date selected yet.
|
||||
* Using lowercase to match the input attribute
|
||||
*/
|
||||
@Prop() placeholder: string;
|
||||
|
||||
/**
|
||||
* @output {any} Emitted when the datetime selection was cancelled.
|
||||
*/
|
||||
@Event() ionCancel: EventEmitter;
|
||||
|
||||
ionViewDidLoad() {
|
||||
// first see if locale names were provided in the inputs
|
||||
// then check to see if they're in the config
|
||||
// if neither were provided then it will use default English names
|
||||
['monthNames', 'monthShortNames', 'dayNames', 'dayShortNames'].forEach(type => {
|
||||
// this.locale[type] = convertToArrayOfStrings((this[type] ? this[type] : this.config.get(type), type);
|
||||
console.log('this[type]', this[type]);
|
||||
this.locale[type] = convertToArrayOfStrings(this[type], type);
|
||||
});
|
||||
|
||||
// this.initialize();
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
open() {
|
||||
// TODO check this.isFocus() || this.disabled
|
||||
if (this.disabled) {
|
||||
return;
|
||||
}
|
||||
console.debug('datetime, open picker');
|
||||
|
||||
// // the user may have assigned some options specifically for the alert
|
||||
// const pickerOptions = deepCopy(this.pickerOptions);
|
||||
|
||||
// // Configure picker under the hood
|
||||
// const picker = this._picker = this._pickerCtrl.create(pickerOptions);
|
||||
// picker.addButton({
|
||||
// text: this.cancelText,
|
||||
// role: 'cancel',
|
||||
// handler: () => this.ionCancel.emit(this)
|
||||
// });
|
||||
// picker.addButton({
|
||||
// text: this.doneText,
|
||||
// handler: (data: any) => this.value = data,
|
||||
// });
|
||||
|
||||
// picker.ionChange.subscribe(() => {
|
||||
// this.validate();
|
||||
// picker.refresh();
|
||||
// });
|
||||
|
||||
// // Update picker status before presenting
|
||||
// this.generate();
|
||||
// this.validate();
|
||||
|
||||
// // Present picker
|
||||
// this._fireFocus();
|
||||
// picker.present(pickerOptions);
|
||||
// picker.onDidDismiss(() => {
|
||||
// this._fireBlur();
|
||||
// });
|
||||
}
|
||||
|
||||
hostData() {
|
||||
return {
|
||||
class: {
|
||||
'datetime-disabled': this.disabled
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
console.log('rendering', this);
|
||||
let addPlaceholderClass = false;
|
||||
|
||||
// If selected text has been passed in, use that first
|
||||
let dateTimeText = this.text;
|
||||
if (!dateTimeText && this.placeholder) {
|
||||
dateTimeText = this.placeholder;
|
||||
addPlaceholderClass = true;
|
||||
}
|
||||
|
||||
const dateTimeTextClasses: CssClassMap = {
|
||||
'datetime-text': true,
|
||||
'datetime-placeholder': addPlaceholderClass
|
||||
};
|
||||
|
||||
return [
|
||||
<div class={ dateTimeTextClasses }>{ dateTimeText }</div>,
|
||||
<button
|
||||
aria-haspopup='true'
|
||||
id={this.id}
|
||||
aria-labelledby={this.labelId}
|
||||
aria-disabled={this.disabled ? 'true' : false}
|
||||
onClick={this.open.bind(this)}
|
||||
class='item-cover'>
|
||||
</button>
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
* Use to convert a string of comma separated strings or
|
||||
* an array of strings, and clean up any user input
|
||||
*/
|
||||
function convertToArrayOfStrings(input: any, type: string): string[] {
|
||||
if (!input) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (isString(input)) {
|
||||
// convert the string to an array of strings
|
||||
// auto remove any [] characters
|
||||
input = input.replace(/\[|\]/g, '').split(',');
|
||||
}
|
||||
|
||||
var values: string[];
|
||||
if (isArray(input)) {
|
||||
// trim up each string value
|
||||
values = input.map((val: string) => val.trim());
|
||||
}
|
||||
|
||||
if (!values || !values.length) {
|
||||
console.warn(`Invalid "${type}Names". Must be an array of strings, or a comma separated string.`);
|
||||
}
|
||||
|
||||
return values;
|
||||
}
|
||||
|
||||
// _locale: LocaleData = {};
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// ngAfterContentInit() {
|
||||
// // first see if locale names were provided in the inputs
|
||||
// // then check to see if they're in the config
|
||||
// // if neither were provided then it will use default English names
|
||||
// ['monthNames', 'monthShortNames', 'dayNames', 'dayShortNames'].forEach(type => {
|
||||
// (<any>this)._locale[type] = convertToArrayOfStrings(isPresent((<any>this)[type]) ? (<any>this)[type] : this._config.get(type), type);
|
||||
// });
|
||||
|
||||
// this._initialize();
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// _inputNormalize(val: any): DateTimeData {
|
||||
// updateDate(this._value, val);
|
||||
// return this._value;
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// _inputUpdated() {
|
||||
// this.updateText();
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// _inputShouldChange(): boolean {
|
||||
// return true;
|
||||
// }
|
||||
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// _inputNgModelEvent(): any {
|
||||
// return convertDataToISO(this.value);
|
||||
// }
|
||||
|
||||
// @HostListener('click', ['$event'])
|
||||
// _click(ev: UIEvent) {
|
||||
// // do not continue if the click event came from a form submit
|
||||
// if (ev.detail === 0) {
|
||||
// return;
|
||||
// }
|
||||
// ev.preventDefault();
|
||||
// ev.stopPropagation();
|
||||
// this.open();
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// generate() {
|
||||
// const picker = this._picker;
|
||||
// // if a picker format wasn't provided, then fallback
|
||||
// // to use the display format
|
||||
// let template = this.pickerFormat || this.displayFormat || DEFAULT_FORMAT;
|
||||
|
||||
// if (isPresent(template)) {
|
||||
// // make sure we've got up to date sizing information
|
||||
// this.calcMinMax();
|
||||
|
||||
// // does not support selecting by day name
|
||||
// // automaticallly remove any day name formats
|
||||
// template = template.replace('DDDD', '{~}').replace('DDD', '{~}');
|
||||
// if (template.indexOf('D') === -1) {
|
||||
// // there is not a day in the template
|
||||
// // replace the day name with a numeric one if it exists
|
||||
// template = template.replace('{~}', 'D');
|
||||
// }
|
||||
// // make sure no day name replacer is left in the string
|
||||
// template = template.replace(/{~}/g, '');
|
||||
|
||||
// // parse apart the given template into an array of "formats"
|
||||
// parseTemplate(template).forEach(format => {
|
||||
// // loop through each format in the template
|
||||
// // create a new picker column to build up with data
|
||||
// let key = convertFormatToKey(format);
|
||||
// let values: any[];
|
||||
|
||||
// // first see if they have exact values to use for this input
|
||||
// if (isPresent((<any>this)[key + 'Values'])) {
|
||||
// // user provide exact values for this date part
|
||||
// values = convertToArrayOfNumbers((<any>this)[key + 'Values'], key);
|
||||
|
||||
// } else {
|
||||
// // use the default date part values
|
||||
// values = dateValueRange(format, this._min, this._max);
|
||||
// }
|
||||
|
||||
// const column: PickerColumn = {
|
||||
// name: key,
|
||||
// selectedIndex: 0,
|
||||
// options: values.map(val => {
|
||||
// return {
|
||||
// value: val,
|
||||
// text: renderTextFormat(format, val, null, this._locale),
|
||||
// };
|
||||
// })
|
||||
// };
|
||||
|
||||
// // cool, we've loaded up the columns with options
|
||||
// // preselect the option for this column
|
||||
// const optValue = getValueFromFormat(this.getValue(), format);
|
||||
// const selectedIndex = column.options.findIndex(opt => opt.value === optValue);
|
||||
// if (selectedIndex >= 0) {
|
||||
// // set the select index for this column's options
|
||||
// column.selectedIndex = selectedIndex;
|
||||
// }
|
||||
|
||||
// // add our newly created column to the picker
|
||||
// picker.addColumn(column);
|
||||
// });
|
||||
|
||||
|
||||
// // Normalize min/max
|
||||
// const min = <any>this._min;
|
||||
// const max = <any>this._max;
|
||||
// const columns = this._picker.getColumns();
|
||||
// ['month', 'day', 'hour', 'minute']
|
||||
// .filter(name => !columns.find(column => column.name === name))
|
||||
// .forEach(name => {
|
||||
// min[name] = 0;
|
||||
// max[name] = 0;
|
||||
// });
|
||||
|
||||
// this.divyColumns();
|
||||
// }
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// validateColumn(name: string, index: number, min: number, max: number, lowerBounds: number[], upperBounds: number[]): number {
|
||||
// assert(lowerBounds.length === 5, 'lowerBounds length must be 5');
|
||||
// assert(upperBounds.length === 5, 'upperBounds length must be 5');
|
||||
|
||||
// const column = this._picker.getColumn(name);
|
||||
// if (!column) {
|
||||
// return 0;
|
||||
// }
|
||||
|
||||
// const lb = lowerBounds.slice();
|
||||
// const ub = upperBounds.slice();
|
||||
// const options = column.options;
|
||||
// let indexMin = options.length - 1;
|
||||
// let indexMax = 0;
|
||||
|
||||
// for (var i = 0; i < options.length; i++) {
|
||||
// var opt = options[i];
|
||||
// var value = opt.value;
|
||||
// lb[index] = opt.value;
|
||||
// ub[index] = opt.value;
|
||||
|
||||
// var disabled = opt.disabled = (
|
||||
// value < lowerBounds[index] ||
|
||||
// value > upperBounds[index] ||
|
||||
// dateSortValue(ub[0], ub[1], ub[2], ub[3], ub[4]) < min ||
|
||||
// dateSortValue(lb[0], lb[1], lb[2], lb[3], lb[4]) > max
|
||||
// );
|
||||
// if (!disabled) {
|
||||
// indexMin = Math.min(indexMin, i);
|
||||
// indexMax = Math.max(indexMax, i);
|
||||
// }
|
||||
// }
|
||||
// let selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax);
|
||||
// opt = column.options[selectedIndex];
|
||||
// if (opt) {
|
||||
// return opt.value;
|
||||
// }
|
||||
// return 0;
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @private
|
||||
// */
|
||||
// validate() {
|
||||
// const today = new Date();
|
||||
// const minCompareVal = dateDataSortValue(this._min);
|
||||
// const maxCompareVal = dateDataSortValue(this._max);
|
||||
// const yearCol = this._picker.getColumn('year');
|
||||
|
||||
// assert(minCompareVal <= maxCompareVal, 'invalid min/max value');
|
||||
|
||||
// let selectedYear: number = today.getFullYear();
|
||||
// if (yearCol) {
|
||||
// // default to the first value if the current year doesn't exist in the options
|
||||
// if (!yearCol.options.find(col => col.value === today.getFullYear())) {
|
||||
// selectedYear = yearCol.options[0].value;
|
||||
// }
|
||||
|
||||
// var yearOpt = yearCol.options[yearCol.selectedIndex];
|
||||
// if (yearOpt) {
|
||||
// // they have a selected year value
|
||||
// selectedYear = yearOpt.value;
|
||||
// }
|
||||
// }
|
||||
|
||||
// const selectedMonth = this.validateColumn(
|
||||
// 'month', 1,
|
||||
// minCompareVal, maxCompareVal,
|
||||
// [selectedYear, 0, 0, 0, 0],
|
||||
// [selectedYear, 12, 31, 23, 59]
|
||||
// );
|
||||
|
||||
// const numDaysInMonth = daysInMonth(selectedMonth, selectedYear);
|
||||
// const selectedDay = this.validateColumn(
|
||||
// 'day', 2,
|
||||
// minCompareVal, maxCompareVal,
|
||||
// [selectedYear, selectedMonth, 0, 0, 0],
|
||||
// [selectedYear, selectedMonth, numDaysInMonth, 23, 59]
|
||||
// );
|
||||
|
||||
// const selectedHour = this.validateColumn(
|
||||
// 'hour', 3,
|
||||
// minCompareVal, maxCompareVal,
|
||||
// [selectedYear, selectedMonth, selectedDay, 0, 0],
|
||||
// [selectedYear, selectedMonth, selectedDay, 23, 59]
|
||||
// );
|
||||
|
||||
// this.validateColumn(
|
||||
// 'minute', 4,
|
||||
// minCompareVal, maxCompareVal,
|
||||
// [selectedYear, selectedMonth, selectedDay, selectedHour, 0],
|
||||
// [selectedYear, selectedMonth, selectedDay, selectedHour, 59]
|
||||
// );
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// divyColumns() {
|
||||
// const pickerColumns = this._picker.getColumns();
|
||||
// let columnsWidth: number[] = [];
|
||||
// let col: PickerColumn;
|
||||
// let width: number;
|
||||
// for (var i = 0; i < pickerColumns.length; i++) {
|
||||
// col = pickerColumns[i];
|
||||
// columnsWidth.push(0);
|
||||
|
||||
// for (var j = 0; j < col.options.length; j++) {
|
||||
// width = col.options[j].text.length;
|
||||
// if (width > columnsWidth[i]) {
|
||||
// columnsWidth[i] = width;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// if (columnsWidth.length === 2) {
|
||||
// width = Math.max(columnsWidth[0], columnsWidth[1]);
|
||||
// pickerColumns[0].align = 'right';
|
||||
// pickerColumns[1].align = 'left';
|
||||
// pickerColumns[0].optionsWidth = pickerColumns[1].optionsWidth = `${width * 17}px`;
|
||||
|
||||
// } else if (columnsWidth.length === 3) {
|
||||
// width = Math.max(columnsWidth[0], columnsWidth[2]);
|
||||
// pickerColumns[0].align = 'right';
|
||||
// pickerColumns[1].columnWidth = `${columnsWidth[1] * 17}px`;
|
||||
// pickerColumns[0].optionsWidth = pickerColumns[2].optionsWidth = `${width * 17}px`;
|
||||
// pickerColumns[2].align = 'left';
|
||||
// }
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// updateText() {
|
||||
// // create the text of the formatted data
|
||||
// const template = this.displayFormat || this.pickerFormat || DEFAULT_FORMAT;
|
||||
// this._text = renderDateTime(template, this.getValue(), this._locale);
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// getValue(): DateTimeData {
|
||||
// return this._value;
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// hasValue(): boolean {
|
||||
// const val = this._value;
|
||||
// return isPresent(val)
|
||||
// && isObject(val)
|
||||
// && Object.keys(val).length > 0;
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// */
|
||||
// calcMinMax(now?: Date) {
|
||||
// const todaysYear = (now || new Date()).getFullYear();
|
||||
// if (isPresent(this.yearValues)) {
|
||||
// var years = convertToArrayOfNumbers(this.yearValues, 'year');
|
||||
// if (isBlank(this.min)) {
|
||||
// this.min = Math.min.apply(Math, years);
|
||||
// }
|
||||
// if (isBlank(this.max)) {
|
||||
// this.max = Math.max.apply(Math, years);
|
||||
// }
|
||||
// } else {
|
||||
// if (isBlank(this.min)) {
|
||||
// this.min = (todaysYear - 100).toString();
|
||||
// }
|
||||
// if (isBlank(this.max)) {
|
||||
// this.max = todaysYear.toString();
|
||||
// }
|
||||
// }
|
||||
// const min = this._min = parseDate(this.min);
|
||||
// const max = this._max = parseDate(this.max);
|
||||
|
||||
// min.year = min.year || todaysYear;
|
||||
// max.year = max.year || todaysYear;
|
||||
|
||||
// min.month = min.month || 1;
|
||||
// max.month = max.month || 12;
|
||||
// min.day = min.day || 1;
|
||||
// max.day = max.day || 31;
|
||||
// min.hour = min.hour || 0;
|
||||
// max.hour = max.hour || 23;
|
||||
// min.minute = min.minute || 0;
|
||||
// max.minute = max.minute || 59;
|
||||
// min.second = min.second || 0;
|
||||
// max.second = max.second || 59;
|
||||
|
||||
// // Ensure min/max constraits
|
||||
// if (min.year > max.year) {
|
||||
// console.error('min.year > max.year');
|
||||
// min.year = max.year - 100;
|
||||
// }
|
||||
// if (min.year === max.year) {
|
||||
// if (min.month > max.month) {
|
||||
// console.error('min.month > max.month');
|
||||
// min.month = 1;
|
||||
// } else if (min.month === max.month && min.day > max.day) {
|
||||
// console.error('min.day > max.day');
|
||||
// min.day = 1;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// }
|
||||
|
||||
// /**
|
||||
// * @hidden
|
||||
// * Use to convert a string of comma separated numbers or
|
||||
// * an array of numbers, and clean up any user input
|
||||
// */
|
||||
// function convertToArrayOfNumbers(input: any, type: string): number[] {
|
||||
// if (isString(input)) {
|
||||
// // convert the string to an array of strings
|
||||
// // auto remove any whitespace and [] characters
|
||||
// input = input.replace(/\[|\]|\s/g, '').split(',');
|
||||
// }
|
||||
|
||||
// let values: number[];
|
||||
// if (isArray(input)) {
|
||||
// // ensure each value is an actual number in the returned array
|
||||
// values = input
|
||||
// .map((num: any) => parseInt(num, 10))
|
||||
// .filter(isFinite);
|
||||
// }
|
||||
|
||||
// if (!values || !values.length) {
|
||||
// console.warn(`Invalid "${type}Values". Must be an array of numbers, or a comma separated string of numbers.`);
|
||||
// }
|
||||
|
||||
// return values;
|
||||
// }
|
||||
|
||||
|
||||
// const DEFAULT_FORMAT = 'MMM D, YYYY';
|
54
packages/core/src/components/datetime/datetime.wp.scss
Normal file
@ -0,0 +1,54 @@
|
||||
@import "../../themes/ionic.globals.wp";
|
||||
@import "./datetime";
|
||||
|
||||
// Windows DateTime
|
||||
// --------------------------------------------------
|
||||
|
||||
/// @prop - Min width of the DateTime component
|
||||
$datetime-wp-min-width: 45% !default;
|
||||
|
||||
/// @prop - Padding top of the DateTime component
|
||||
$datetime-wp-padding-top: $item-wp-padding-top !default;
|
||||
|
||||
/// @prop - Padding end of the DateTime component
|
||||
$datetime-wp-padding-end: ($item-wp-padding-end / 2) !default;
|
||||
|
||||
/// @prop - Padding bottom of the DateTime component
|
||||
$datetime-wp-padding-bottom: $item-wp-padding-bottom !default;
|
||||
|
||||
/// @prop - Padding start of the DateTime component
|
||||
$datetime-wp-padding-start: $item-wp-padding-start !default;
|
||||
|
||||
/// @prop - Border width of the DateTime component
|
||||
$datetime-wp-border-width: 2px !default;
|
||||
|
||||
/// @prop - Border color of the DateTime component
|
||||
$datetime-wp-border-color: $input-wp-border-color !default;
|
||||
|
||||
/// @prop - Color of the DateTime placeholder
|
||||
$datetime-wp-placeholder-color: $input-wp-border-color !default;
|
||||
|
||||
|
||||
.datetime-wp {
|
||||
@include padding($datetime-wp-padding-top, $datetime-wp-padding-end, $datetime-wp-padding-bottom, $datetime-wp-padding-start);
|
||||
|
||||
min-width: $datetime-wp-min-width;
|
||||
}
|
||||
|
||||
.datetime-wp .datetime-text {
|
||||
@include padding(0, 8px);
|
||||
|
||||
min-height: 3.4rem;
|
||||
|
||||
border: $datetime-wp-border-width solid $datetime-wp-border-color;
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
.item-datetime .datetime-wp ion-label[floating] {
|
||||
@include transform(translate3d(8px, 41px, 0));
|
||||
}
|
||||
|
||||
.datetime-wp .datetime-placeholder {
|
||||
color: $datetime-wp-placeholder-color;
|
||||
}
|
||||
|
146
packages/core/src/components/datetime/test/basic.html
Normal file
@ -0,0 +1,146 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Ionic DateTime</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<script src="/dist/ionic.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<ion-app>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-title>Datetime</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content class="outer-content test-content">
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-label>MMMM</ion-label>
|
||||
<ion-datetime display-format="MMMM" value="2012-12-15T13:47:20.789"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>MM DD YY</ion-label>
|
||||
<ion-datetime display-format="MM DD YY" placeholder="Select Date"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>YYYY</ion-label>
|
||||
<ion-datetime display-format="YYYY" min="1981" max="2002" value="1989"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>MMMM YY</ion-label>
|
||||
<ion-datetime display-format="MMMM YY" min="1989-06-04" max="2004-08-23" value="1994-12-15T13:47:20.789"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>MM/DD/YYYY</ion-label>
|
||||
<ion-datetime display-format="MM/DD/YYYY" min="1994-03-14" max="2012-12-09" value="2002-09-23T15:03:46.789" class="e2eOpenMMDDYYYY"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>DDD. MMM DD, YY (custom locale)</ion-label>
|
||||
<ion-datetime id="customDayShortNames" value="1995-04-15" min="1990-02" max="2000"
|
||||
display-format="DDD. MMM DD, YY"
|
||||
month-short-names="jan, feb, mar, apr, mai, jun, jul, aug, sep, okt, nov, des"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>D MMM YYYY H:mm</ion-label>
|
||||
<ion-datetime display-format="D MMM YYYY H:mm" min="1997" max="2010" value="2005-06-17T11:06Z"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>DDDD MMM D, YYYY</ion-label>
|
||||
<ion-datetime display-format="DDDD MMM D, YYYY" min="2005" max="2016" value="2008-09-02"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>HH:mm</ion-label>
|
||||
<ion-datetime display-format="HH:mm"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>h:mm a</ion-label>
|
||||
<ion-datetime (ionChange)="onChange($event)" (ionCancel)="onCancel($event)" display-format="h:mm a"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>hh:mm A (15 min steps)</ion-label>
|
||||
<ion-datetime display-format="h:mm A" minute-values="0,15,30,45"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Leap years, summer months</ion-label>
|
||||
<ion-datetime id="customYearValues" display-format="MM/YYYY" pickerFormat="MMMM YYYY" month-values="6,7,8"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>Specific days/months/years</ion-label>
|
||||
<ion-datetime month-values="6,7,8" year-values="2014,2015" day-values="01,02,03,04,05,06,08,09,10, 11, 12, 13, 14" display-format="DD/MMM/YYYY"></ion-datetime>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-label>myDate</ion-label>
|
||||
<ion-datetime display-format="MMM DD, YYYY HH:mm"></ion-datetime>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
|
||||
<ion-list>
|
||||
<ion-item>
|
||||
<ion-label>HH:mm:ss</ion-label>
|
||||
<ion-datetime display-format="HH:mm:ss"></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
<ion-item>
|
||||
<ion-label>No display-format</ion-label>
|
||||
<ion-datetime></ion-datetime>
|
||||
</ion-item>
|
||||
|
||||
</ion-list>
|
||||
|
||||
<div text-center>
|
||||
<ion-button onclick="toggleBoolean('dynamicDisabled', 'disabled')">
|
||||
Toggle Disabled
|
||||
</ion-button>
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
|
||||
<script>
|
||||
var yearValuesArray = [2020, 2016, 2008, 2004, 2000, 1996];
|
||||
var customYearValues = document.getElementById('customYearValues');
|
||||
customYearValues.yearValues = yearValuesArray;
|
||||
|
||||
var dayShortNamesArray = [
|
||||
's\u00f8n',
|
||||
'man',
|
||||
'tir',
|
||||
'ons',
|
||||
'tor',
|
||||
'fre',
|
||||
'l\u00f8r'
|
||||
];
|
||||
var customDayShortNames = document.getElementById('customDayShortNames');
|
||||
customDayShortNames.dayShortNames = dayShortNamesArray;
|
||||
|
||||
|
||||
function toggleBoolean(id, prop) {
|
||||
var ele = document.getElementById(id);
|
||||
|
||||
var isTrue = ele[prop] ? false : true;
|
||||
ele[prop] = isTrue;
|
||||
console.log('in toggleBoolean, setting', prop, 'to', isTrue);
|
||||
}
|
||||
</script>
|
||||
</ion-app>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
@ -104,4 +104,4 @@ export class FabContainer {
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { Component, Element, CssClassMap, Method, Prop, State } from '@stencil/core';
|
||||
import { Component, CssClassMap, Element, Method, Prop, State } from '@stencil/core';
|
||||
import { createThemedClasses, getElementClassObject } from '../../utils/theme';
|
||||
|
||||
|
||||
@ -171,11 +171,11 @@ export class FabButton {
|
||||
...themedClasses,
|
||||
...hostClasses,
|
||||
...elementClasses
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<TagType class={fabClasses} onClick={this.clickedFab.bind(this)} disabled={this.disabled}>
|
||||
<ion-icon name="close" class="fab-close-icon"></ion-icon>
|
||||
<ion-icon name='close' class='fab-close-icon'></ion-icon>
|
||||
<span class='button-inner'>
|
||||
<slot></slot>
|
||||
</span>
|
||||
|
@ -1,49 +1,13 @@
|
||||
import { applyStyles, getElementReference, pointerCoordX, pointerCoordY } from '../../utils/helpers';
|
||||
import { BlockerDelegate, GestureController, GestureDelegate, BLOCK_ALL } from '../gesture-controller/gesture-controller';
|
||||
import { ElementRef, applyStyles, assert, getElementReference, updateDetail } from '../../utils/helpers';
|
||||
import { BLOCK_ALL, BlockerDelegate, GestureController, GestureDelegate } from '../gesture-controller/gesture-controller';
|
||||
import { Component, Element, Event, EventEmitter, Listen, Prop, PropDidChange } from '@stencil/core';
|
||||
import { PanRecognizer } from './recognizers';
|
||||
|
||||
/**
|
||||
* @name Range
|
||||
* @description
|
||||
* The Range slider lets users select from a range of values by moving
|
||||
* the slider knob. It can accept dual knobs, but by default one knob
|
||||
* controls the value of the range.
|
||||
*
|
||||
* ### Range Labels
|
||||
* Labels can be placed on either side of the range by adding the
|
||||
* `range-start` or `range-end` property to the element. The element
|
||||
* doesn't have to be an `ion-label`, it can be added to any element
|
||||
* to place it to the left or right of the range. See [usage](#usage)
|
||||
* below for examples.
|
||||
*
|
||||
*
|
||||
* ### Minimum and Maximum Values
|
||||
* Minimum and maximum values can be passed to the range through the `min`
|
||||
* and `max` properties, respectively. By default, the range sets the `min`
|
||||
* to `0` and the `max` to `100`.
|
||||
*
|
||||
*
|
||||
* ### Steps and Snaps
|
||||
* The `step` property specifies the value granularity of the range's value.
|
||||
* It can be useful to set the `step` when the value isn't in increments of `1`.
|
||||
* Setting the `step` property will show tick marks on the range for each step.
|
||||
* The `snaps` property can be set to automatically move the knob to the nearest
|
||||
* tick mark based on the step property value.
|
||||
*
|
||||
*
|
||||
* ### Dual Knobs
|
||||
* Setting the `dual-knobs` property to `true` on the range component will
|
||||
* enable two knobs on the range. If the range has two knobs, the value will
|
||||
* be an object containing two properties: `lower` and `upper`.
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
@Component({
|
||||
tag: 'ion-gesture'
|
||||
})
|
||||
export class Gesture {
|
||||
|
||||
@Element() private el: HTMLElement;
|
||||
private detail: GestureDetail = {};
|
||||
private positions: number[] = [];
|
||||
@ -54,9 +18,10 @@ export class Gesture {
|
||||
private hasCapturedPan = false;
|
||||
private hasPress = false;
|
||||
private hasStartedPan = false;
|
||||
private requiresMove = false;
|
||||
private hasFiredStart = true;
|
||||
private isMoveQueued = false;
|
||||
private blocker: BlockerDelegate;
|
||||
private fireOnMoveFunc: any;
|
||||
|
||||
@Event() private ionGestureMove: EventEmitter;
|
||||
@Event() private ionGestureStart: EventEmitter;
|
||||
@ -64,7 +29,8 @@ export class Gesture {
|
||||
@Event() private ionGestureNotCaptured: EventEmitter;
|
||||
@Event() private ionPress: EventEmitter;
|
||||
|
||||
@Prop() attachTo: string = 'child';
|
||||
@Prop() enabled: boolean = true;
|
||||
@Prop() attachTo: ElementRef = 'child';
|
||||
@Prop() autoBlockAll: boolean = false;
|
||||
@Prop() block: string = null;
|
||||
@Prop() disableScroll: boolean = false;
|
||||
@ -76,14 +42,16 @@ export class Gesture {
|
||||
@Prop() type: string = 'pan';
|
||||
|
||||
@Prop() canStart: GestureCallback;
|
||||
@Prop() onWillStart: (_: GestureDetail) => Promise<void>;
|
||||
@Prop() onStart: GestureCallback;
|
||||
@Prop() onMove: GestureCallback;
|
||||
@Prop() onEnd: GestureCallback;
|
||||
@Prop() onPress: GestureCallback;
|
||||
@Prop() onDown: GestureCallback;
|
||||
@Prop() onUp: GestureCallback;
|
||||
@Prop() notCaptured: GestureCallback;
|
||||
|
||||
constructor() {
|
||||
this.fireOnMoveFunc = this.fireOnMove.bind(this);
|
||||
}
|
||||
|
||||
ionViewDidLoad() {
|
||||
// in this case, we already know the GestureController and Gesture are already
|
||||
@ -93,17 +61,13 @@ export class Gesture {
|
||||
this.gesture = this.ctrl.createGesture(this.gestureName, this.gesturePriority, this.disableScroll);
|
||||
|
||||
const types = this.type.replace(/\s/g, '').toLowerCase().split(',');
|
||||
|
||||
if (types.indexOf('pan') > -1) {
|
||||
this.pan = new PanRecognizer(this.direction, this.threshold, this.maxAngle);
|
||||
this.requiresMove = true;
|
||||
}
|
||||
this.hasPress = (types.indexOf('press') > -1);
|
||||
|
||||
this.enabledChange(true);
|
||||
if (this.pan || this.hasPress) {
|
||||
Context.enableListener(this, 'touchstart', true, this.attachTo);
|
||||
Context.enableListener(this, 'mousedown', true, this.attachTo);
|
||||
|
||||
Context.dom.write(() => {
|
||||
applyStyles(getElementReference(this.el, this.attachTo), GESTURE_INLINE_STYLES);
|
||||
});
|
||||
@ -115,6 +79,19 @@ export class Gesture {
|
||||
}
|
||||
}
|
||||
|
||||
@PropDidChange('enabled')
|
||||
enabledChange(isEnabled: boolean) {
|
||||
if (!this.gesture) {
|
||||
return;
|
||||
}
|
||||
if (this.pan || this.hasPress) {
|
||||
Context.enableListener(this, 'touchstart', isEnabled, this.attachTo);
|
||||
Context.enableListener(this, 'mousedown', isEnabled, this.attachTo);
|
||||
if (!isEnabled) {
|
||||
this.abortGesture();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@PropDidChange('block')
|
||||
blockChange(block: string) {
|
||||
@ -132,10 +109,12 @@ export class Gesture {
|
||||
onTouchStart(ev: TouchEvent) {
|
||||
this.lastTouch = now(ev);
|
||||
|
||||
this.enableMouse(false);
|
||||
this.enableTouch(true);
|
||||
|
||||
this.pointerDown(ev, this.lastTouch);
|
||||
if (this.pointerDown(ev, this.lastTouch)) {
|
||||
this.enableMouse(false);
|
||||
this.enableTouch(true);
|
||||
} else {
|
||||
this.abortGesture();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -144,35 +123,39 @@ export class Gesture {
|
||||
const timeStamp = now(ev);
|
||||
|
||||
if (this.lastTouch === 0 || (this.lastTouch + MOUSE_WAIT < timeStamp)) {
|
||||
this.enableMouse(true);
|
||||
this.enableTouch(false);
|
||||
|
||||
this.pointerDown(ev, timeStamp);
|
||||
if (this.pointerDown(ev, timeStamp)) {
|
||||
this.enableMouse(true);
|
||||
this.enableTouch(false);
|
||||
} else {
|
||||
this.abortGesture();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
private pointerDown(ev: UIEvent, timeStamp: number): boolean {
|
||||
if (!this.gesture || this.hasStartedPan) {
|
||||
if (!this.gesture || this.hasStartedPan || !this.hasFiredStart) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const detail = this.detail;
|
||||
|
||||
detail.startX = detail.currentX = pointerCoordX(ev);
|
||||
detail.startY = detail.currentY = pointerCoordY(ev);
|
||||
updateDetail(ev, detail);
|
||||
detail.startX = detail.currentX;
|
||||
detail.startY = detail.currentY;
|
||||
detail.startTimeStamp = detail.timeStamp = timeStamp;
|
||||
detail.velocityX = detail.velocityY = detail.deltaX = detail.deltaY = 0;
|
||||
detail.directionX = detail.directionY = detail.velocityDirectionX = detail.velocityDirectionY = null;
|
||||
detail.event = ev;
|
||||
this.positions.length = 0;
|
||||
|
||||
assert(this.hasFiredStart, 'fired start must be false');
|
||||
assert(!this.hasStartedPan, 'pan can be started at this point');
|
||||
assert(!this.hasCapturedPan, 'pan can be started at this point');
|
||||
assert(!this.isMoveQueued, 'some move is still queued');
|
||||
assert(this.positions.length === 0, 'positions must be emprty');
|
||||
|
||||
// Check if gesture can start
|
||||
if (this.canStart && this.canStart(detail) === false) {
|
||||
return false;
|
||||
}
|
||||
|
||||
this.positions.push(detail.currentX, detail.currentY, timeStamp);
|
||||
|
||||
// Release fallback
|
||||
this.gesture.release();
|
||||
|
||||
@ -181,13 +164,11 @@ export class Gesture {
|
||||
return false;
|
||||
}
|
||||
|
||||
this.positions.push(detail.currentX, detail.currentY, timeStamp);
|
||||
if (this.pan) {
|
||||
this.hasStartedPan = true;
|
||||
this.hasCapturedPan = false;
|
||||
|
||||
this.pan.start(detail.startX, detail.startY);
|
||||
}
|
||||
this.onDown(detail)
|
||||
return true;
|
||||
}
|
||||
|
||||
@ -197,7 +178,6 @@ export class Gesture {
|
||||
@Listen('touchmove', { passive: true, enabled: false })
|
||||
onTouchMove(ev: TouchEvent) {
|
||||
this.lastTouch = this.detail.timeStamp = now(ev);
|
||||
|
||||
this.pointerMove(ev);
|
||||
}
|
||||
|
||||
@ -205,7 +185,6 @@ export class Gesture {
|
||||
@Listen('document:mousemove', { passive: true, enabled: false })
|
||||
onMoveMove(ev: TouchEvent) {
|
||||
const timeStamp = now(ev);
|
||||
|
||||
if (this.lastTouch === 0 || (this.lastTouch + MOUSE_WAIT < timeStamp)) {
|
||||
this.detail.timeStamp = timeStamp;
|
||||
this.pointerMove(ev);
|
||||
@ -213,107 +192,138 @@ export class Gesture {
|
||||
}
|
||||
|
||||
private pointerMove(ev: UIEvent) {
|
||||
assert(!!this.pan, 'pan must be non null');
|
||||
|
||||
// fast path, if gesture is currently captured
|
||||
// do minimun job to get user-land even dispatched
|
||||
if (this.hasCapturedPan) {
|
||||
if (!this.isMoveQueued && this.hasFiredStart) {
|
||||
this.isMoveQueued = true;
|
||||
this.calcGestureData(ev);
|
||||
Context.dom.write(this.fireOnMoveFunc);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// gesture is currently being detected
|
||||
const detail = this.detail;
|
||||
this.calcGestureData(ev);
|
||||
|
||||
if (this.pan) {
|
||||
if (this.hasCapturedPan) {
|
||||
|
||||
if (!this.isMoveQueued) {
|
||||
this.isMoveQueued = true;
|
||||
|
||||
Context.dom.write(() => {
|
||||
this.isMoveQueued = false;
|
||||
detail.type = 'pan';
|
||||
|
||||
if (this.onMove) {
|
||||
this.onMove(detail);
|
||||
} else {
|
||||
this.ionGestureMove.emit(this.detail);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
} else if (this.pan.detect(detail.currentX, detail.currentY)) {
|
||||
if (this.pan.isGesture() !== 0) {
|
||||
if (!this.tryToCapturePan(ev)) {
|
||||
this.abortGesture();
|
||||
}
|
||||
if (this.pan.detect(detail.currentX, detail.currentY)) {
|
||||
if (this.pan.isGesture() !== 0) {
|
||||
if (!this.tryToCapturePan()) {
|
||||
this.abortGesture();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private calcGestureData(ev: UIEvent) {
|
||||
private fireOnMove() {
|
||||
const detail = this.detail;
|
||||
detail.currentX = pointerCoordX(ev);
|
||||
detail.currentY = pointerCoordY(ev);
|
||||
detail.deltaX = (detail.currentX - detail.startX);
|
||||
detail.deltaY = (detail.currentY - detail.startY);
|
||||
detail.event = ev;
|
||||
|
||||
// figure out which direction we're movin'
|
||||
detail.directionX = detail.velocityDirectionX = (detail.deltaX > 0 ? 'left' : (detail.deltaX < 0 ? 'right' : null));
|
||||
detail.directionY = detail.velocityDirectionY = (detail.deltaY > 0 ? 'up' : (detail.deltaY < 0 ? 'down' : null));
|
||||
|
||||
const positions = this.positions;
|
||||
positions.push(detail.currentX, detail.currentY, detail.timeStamp);
|
||||
|
||||
var endPos = (positions.length - 1);
|
||||
var startPos = endPos;
|
||||
var timeRange = (detail.timeStamp - 100);
|
||||
|
||||
// move pointer to position measured 100ms ago
|
||||
for (var i = endPos; i > 0 && positions[i] > timeRange; i -= 3) {
|
||||
startPos = i;
|
||||
}
|
||||
|
||||
if (startPos !== endPos) {
|
||||
// compute relative movement between these two points
|
||||
var movedX = (positions[startPos - 2] - positions[endPos - 2]);
|
||||
var movedY = (positions[startPos - 1] - positions[endPos - 1]);
|
||||
var factor = 16.67 / (positions[endPos] - positions[startPos]);
|
||||
|
||||
// based on XXms compute the movement to apply for each render step
|
||||
detail.velocityX = movedX * factor;
|
||||
detail.velocityY = movedY * factor;
|
||||
|
||||
detail.velocityDirectionX = (movedX > 0 ? 'left' : (movedX < 0 ? 'right' : null));
|
||||
detail.velocityDirectionY = (movedY > 0 ? 'up' : (movedY < 0 ? 'down' : null));
|
||||
this.isMoveQueued = false;
|
||||
if (this.onMove) {
|
||||
this.onMove(detail);
|
||||
} else {
|
||||
this.ionGestureMove.emit(detail);
|
||||
}
|
||||
}
|
||||
|
||||
private tryToCapturePan(ev: UIEvent): boolean {
|
||||
private calcGestureData(ev: UIEvent) {
|
||||
const detail = this.detail;
|
||||
updateDetail(ev, detail);
|
||||
|
||||
const currentX = detail.currentX;
|
||||
const currentY = detail.currentY;
|
||||
const timestamp = detail.timeStamp;
|
||||
detail.deltaX = currentX - detail.startX;
|
||||
detail.deltaY = currentY - detail.startY;
|
||||
detail.event = ev;
|
||||
|
||||
const timeRange = timestamp - 100;
|
||||
const positions = this.positions;
|
||||
let startPos = positions.length - 1;
|
||||
|
||||
// move pointer to position measured 100ms ago
|
||||
for (;
|
||||
startPos > 0 && positions[startPos] > timeRange;
|
||||
startPos -= 3) { }
|
||||
|
||||
if (startPos > 1) {
|
||||
// compute relative movement between these two points
|
||||
var frequency = 1 / (positions[startPos] - timestamp);
|
||||
var movedY = positions[startPos - 1] - currentY;
|
||||
var movedX = positions[startPos - 2] - currentX;
|
||||
|
||||
// based on XXms compute the movement to apply for each render step
|
||||
// velocity = space/time = s*(1/t) = s*frequency
|
||||
detail.velocityX = movedX * frequency;
|
||||
detail.velocityY = movedY * frequency;
|
||||
} else {
|
||||
detail.velocityX = 0;
|
||||
detail.velocityY = 0;
|
||||
}
|
||||
positions.push(currentX, currentY, timestamp);
|
||||
}
|
||||
|
||||
private tryToCapturePan(): boolean {
|
||||
if (this.gesture && !this.gesture.capture()) {
|
||||
return false;
|
||||
}
|
||||
this.hasCapturedPan = true;
|
||||
this.hasFiredStart = false;
|
||||
|
||||
this.detail.event = ev;
|
||||
// reset start position since the real user-land event starts here
|
||||
// If the pan detector threshold is big, not reseting the start position
|
||||
// will cause a jump in the animation equal to the detector threshold.
|
||||
// the array of positions used to calculate the gesture velocity does not
|
||||
// need to be cleaned, more points in the positions array always results in a
|
||||
// more acurate value of the velocity.
|
||||
const detail = this.detail;
|
||||
detail.startX = detail.currentX;
|
||||
detail.startY = detail.currentY;
|
||||
detail.startTimeStamp = detail.timeStamp;
|
||||
|
||||
if (this.onWillStart) {
|
||||
this.onWillStart(this.detail).then(this.fireOnStart.bind(this));
|
||||
} else {
|
||||
this.fireOnStart();
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
private fireOnStart() {
|
||||
assert(!this.hasFiredStart, 'has fired must be false');
|
||||
if (this.onStart) {
|
||||
this.onStart(this.detail);
|
||||
} else {
|
||||
this.ionGestureStart.emit(this.detail);
|
||||
}
|
||||
|
||||
this.hasCapturedPan = true;
|
||||
|
||||
return true;
|
||||
this.hasFiredStart = true;
|
||||
}
|
||||
|
||||
private abortGesture() {
|
||||
this.hasStartedPan = false;
|
||||
this.hasCapturedPan = false;
|
||||
|
||||
this.gesture && this.gesture.release();
|
||||
|
||||
this.reset();
|
||||
this.enable(false);
|
||||
this.notCaptured && this.notCaptured(this.detail);
|
||||
}
|
||||
|
||||
private reset() {
|
||||
this.hasCapturedPan = false;
|
||||
this.hasStartedPan = false;
|
||||
this.hasFiredStart = true;
|
||||
this.gesture && this.gesture.release();
|
||||
}
|
||||
|
||||
// END *************************
|
||||
|
||||
@Listen('touchcancel', { passive: true, enabled: false })
|
||||
onTouchCancel(ev: TouchEvent) {
|
||||
this.lastTouch = this.detail.timeStamp = now(ev);
|
||||
|
||||
this.pointerUp(ev);
|
||||
this.enableTouch(false);
|
||||
}
|
||||
|
||||
|
||||
@Listen('touchend', { passive: true, enabled: false })
|
||||
onTouchEnd(ev: TouchEvent) {
|
||||
this.lastTouch = this.detail.timeStamp = now(ev);
|
||||
@ -336,47 +346,46 @@ export class Gesture {
|
||||
|
||||
|
||||
private pointerUp(ev: UIEvent) {
|
||||
const hasCaptured = this.hasCapturedPan;
|
||||
const hasFiredStart = this.hasFiredStart;
|
||||
this.reset();
|
||||
|
||||
if (!hasFiredStart) {
|
||||
return;
|
||||
}
|
||||
const detail = this.detail;
|
||||
|
||||
this.gesture && this.gesture.release();
|
||||
|
||||
detail.event = ev;
|
||||
|
||||
this.calcGestureData(ev);
|
||||
this.onUp(detail)
|
||||
if (this.pan) {
|
||||
if (this.hasCapturedPan) {
|
||||
detail.type = 'pan';
|
||||
if (this.onEnd) {
|
||||
this.onEnd(detail);
|
||||
} else {
|
||||
this.ionGestureEnd.emit(detail);
|
||||
}
|
||||
|
||||
} else if (this.hasPress) {
|
||||
this.detectPress();
|
||||
|
||||
// Try to capture press
|
||||
if (hasCaptured) {
|
||||
detail.type = 'pan';
|
||||
if (this.onEnd) {
|
||||
this.onEnd(detail);
|
||||
} else {
|
||||
if (this.notCaptured) {
|
||||
this.notCaptured(detail);
|
||||
} else {
|
||||
this.ionGestureNotCaptured.emit(detail);
|
||||
}
|
||||
this.ionGestureEnd.emit(detail);
|
||||
}
|
||||
|
||||
} else if (this.hasPress) {
|
||||
this.detectPress();
|
||||
return;
|
||||
}
|
||||
|
||||
this.hasCapturedPan = false;
|
||||
this.hasStartedPan = false;
|
||||
// Try to capture press
|
||||
if (this.hasPress && this.detectPress()) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Not captured any event
|
||||
if (this.notCaptured) {
|
||||
this.notCaptured(detail);
|
||||
} else {
|
||||
this.ionGestureNotCaptured.emit(detail);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
private detectPress() {
|
||||
private detectPress(): boolean {
|
||||
const detail = this.detail;
|
||||
|
||||
if (Math.abs(detail.startX - detail.currentX) < 10 && Math.abs(detail.startY - detail.currentY) < 10) {
|
||||
const vecX = detail.deltaX;
|
||||
const vecY = detail.deltaY;
|
||||
const dis = vecX * vecX + vecY * vecY;
|
||||
if (dis < 100) {
|
||||
detail.type = 'press';
|
||||
|
||||
if (this.onPress) {
|
||||
@ -384,14 +393,15 @@ export class Gesture {
|
||||
} else {
|
||||
this.ionPress.emit(detail);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
// ENABLE LISTENERS *************************
|
||||
|
||||
private enableMouse(shouldEnable: boolean) {
|
||||
if (this.requiresMove) {
|
||||
if (this.pan) {
|
||||
Context.enableListener(this, 'document:mousemove', shouldEnable);
|
||||
}
|
||||
Context.enableListener(this, 'document:mouseup', shouldEnable);
|
||||
@ -399,10 +409,11 @@ export class Gesture {
|
||||
|
||||
|
||||
private enableTouch(shouldEnable: boolean) {
|
||||
if (this.requiresMove) {
|
||||
Context.enableListener(this, 'touchmove', shouldEnable);
|
||||
if (this.pan) {
|
||||
Context.enableListener(this, 'touchmove', shouldEnable, this.attachTo);
|
||||
}
|
||||
Context.enableListener(this, 'touchend', shouldEnable);
|
||||
Context.enableListener(this, 'touchcancel', shouldEnable, this.attachTo);
|
||||
Context.enableListener(this, 'touchend', shouldEnable, this.attachTo);
|
||||
}
|
||||
|
||||
|
||||
@ -451,10 +462,6 @@ export interface GestureDetail {
|
||||
velocityY?: number;
|
||||
deltaX?: number;
|
||||
deltaY?: number;
|
||||
directionX?: 'left'|'right';
|
||||
directionY?: 'up'|'down';
|
||||
velocityDirectionX?: 'left'|'right';
|
||||
velocityDirectionY?: 'up'|'down';
|
||||
timeStamp?: number;
|
||||
}
|
||||
|
||||
|
@ -11,7 +11,7 @@ import { Component, Prop, State } from '@stencil/core';
|
||||
host: {
|
||||
theme: 'icon'
|
||||
},
|
||||
assetsDir: 'svg'
|
||||
assetsDir: 'svj'
|
||||
})
|
||||
export class Icon {
|
||||
mode: string;
|
||||
@ -112,105 +112,106 @@ export class Icon {
|
||||
|
||||
render() {
|
||||
if (this.isServer) {
|
||||
return <div class="icon-inner">{/* ssr */}</div>;
|
||||
return <div class='icon-inner'>{/* ssr */}</div>;
|
||||
}
|
||||
|
||||
const svgUrl = getSvgUrl(this.iconName);
|
||||
if (!svgUrl) {
|
||||
const iconName = this.iconName;
|
||||
if (!iconName) {
|
||||
// we don't have good data
|
||||
return <div class="icon-inner">{/* invalid svg */}</div>;
|
||||
return <div class='icon-inner'>{/* invalid svg */}</div>;
|
||||
}
|
||||
|
||||
const svgContent = svgContents[svgUrl];
|
||||
const svgContent = svgContents[iconName];
|
||||
if (svgContent === this.svgContent) {
|
||||
// we've already loaded up this svg at one point
|
||||
// and the svg content we've loaded and assigned checks out
|
||||
// render this svg!!
|
||||
return <div class="icon-inner" innerHTML={svgContent}></div>;
|
||||
return <div class='icon-inner' innerHTML={svgContent}></div>;
|
||||
}
|
||||
|
||||
// haven't loaded this svg yet
|
||||
// start the request
|
||||
loadSvgContent(svgUrl, loadedSvgContent => {
|
||||
loadSvgContent(iconName, loadedSvgContent => {
|
||||
// we're finished loading the svg content!
|
||||
// set to this.svgContent so we do another render
|
||||
this.svgContent = loadedSvgContent;
|
||||
});
|
||||
|
||||
// actively requesting the svg, so let's just render a div for now
|
||||
return <div class="icon-inner">{/* loading svg */}</div>;
|
||||
return <div class='icon-inner'>{/* loading svg */}</div>;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
function getSvgUrl(iconName: string) {
|
||||
if (iconName !== null) {
|
||||
return `${publicPath}svg/${iconName}.svg`;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
|
||||
function loadSvgContent(svgUrl: string, callback: {(loadedSvgContent: string): void}) {
|
||||
function loadSvgContent(iconName: string, callback: {(loadedSvgContent: string): void}) {
|
||||
// static since all IonIcons use this same function and pointing at global/shared data
|
||||
// passed in callback will have instance info
|
||||
|
||||
// add to the list of callbacks to fiure when this url is finished loading
|
||||
loadCallbacks[svgUrl] = loadCallbacks[svgUrl] || [];
|
||||
loadCallbacks[svgUrl].push(callback);
|
||||
(loadCallbacks[iconName] = loadCallbacks[iconName] || []).push(callback);
|
||||
|
||||
if (activeRequests[svgUrl]) {
|
||||
// already requesting this url, don't bother again kicking off another
|
||||
if (activeRequests[iconName]) {
|
||||
// already requesting this icon, don't bother kicking off another
|
||||
return;
|
||||
}
|
||||
|
||||
// add this url to our list of active requests
|
||||
activeRequests[svgUrl] = true;
|
||||
// add this icons to our list of active requests
|
||||
activeRequests[iconName] = true;
|
||||
|
||||
|
||||
// kick off the request for the external svg file
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.addEventListener('load', function() {
|
||||
// awesome, we've finished loading the svg file
|
||||
// create a script element to add to the document.head
|
||||
var scriptElm = document.createElement('script');
|
||||
scriptElm.charset = 'utf-8';
|
||||
scriptElm.async = true;
|
||||
scriptElm.src = `${publicPath}svj/${iconName}.svj`;
|
||||
|
||||
// remove this url from the active requests
|
||||
delete activeRequests[svgUrl];
|
||||
// create a fallback timeout if something goes wrong
|
||||
var tmrId = setTimeout(onScriptComplete, 120000);
|
||||
|
||||
// this response is the content of the svg file we're looking for
|
||||
let svgContent = this.responseText;
|
||||
function onScriptComplete() {
|
||||
clearTimeout(tmrId);
|
||||
scriptElm.onerror = scriptElm.onload = null;
|
||||
scriptElm.parentNode.removeChild(scriptElm);
|
||||
|
||||
if (this.status >= 400) {
|
||||
// umm, not awesome, something is up
|
||||
console.error('Icon could not be loaded:', svgUrl);
|
||||
svgContent = `<!--error loading svg-->`;
|
||||
}
|
||||
// remove from our list of active requests
|
||||
delete activeRequests[iconName];
|
||||
}
|
||||
|
||||
// cache the svg content in the global IonIcon constant
|
||||
svgContents[svgUrl] = svgContent;
|
||||
// add script completed listener to this script element
|
||||
scriptElm.onerror = scriptElm.onload = onScriptComplete;
|
||||
|
||||
// find any callbacks waiting on this url
|
||||
const svgLoadCallbacks = loadCallbacks[svgUrl];
|
||||
if (svgLoadCallbacks) {
|
||||
// loop through all the callbacks that are waiting on the svg content
|
||||
svgLoadCallbacks.forEach(cb => {
|
||||
// fire off this callback which was provided by an instance
|
||||
cb(svgContent);
|
||||
});
|
||||
delete loadCallbacks[svgUrl];
|
||||
}
|
||||
});
|
||||
|
||||
xhr.addEventListener('error', () => {
|
||||
// umm, idk
|
||||
console.error('Icon could not be loaded:', svgUrl);
|
||||
});
|
||||
|
||||
// let's do this!
|
||||
xhr.open('GET', svgUrl, true);
|
||||
xhr.send();
|
||||
// inject a script tag in the head
|
||||
// kick off the actual request
|
||||
document.head.appendChild(scriptElm);
|
||||
}
|
||||
|
||||
|
||||
const activeRequests: {[url: string]: boolean} = {};
|
||||
const loadCallbacks: {[url: string]: {(loadedSvgContent: string): void}[]} = [] as any;
|
||||
const svgContents: {[url: string]: string} = {};
|
||||
const activeRequests: {[iconName: string]: boolean} = {};
|
||||
const loadCallbacks: {[iconName: string]: {(loadedSvgContent: string): void}[]} = [] as any;
|
||||
const svgContents: {[iconName: string]: string} = {};
|
||||
|
||||
// add a jsonp handler to the window
|
||||
// as svg jsonp files are requested
|
||||
// once they load they'll call this method
|
||||
(window as any).loadIonicon = function loadIonicon(svgContent: string, iconName: string) {
|
||||
// awesome, we've finished loading the svg file
|
||||
|
||||
// remove this url from the active requests
|
||||
delete activeRequests[iconName];
|
||||
|
||||
svgContents[iconName] = svgContent;
|
||||
|
||||
// find any callbacks waiting on this icon
|
||||
const svgLoadCallbacks = loadCallbacks[iconName];
|
||||
if (svgLoadCallbacks) {
|
||||
// loop through all the callbacks that are waiting on the svg content
|
||||
svgLoadCallbacks.forEach(cb => {
|
||||
// fire off this callback which was provided by an instance
|
||||
cb(svgContent);
|
||||
});
|
||||
delete loadCallbacks[iconName];
|
||||
}
|
||||
|
||||
};
|
||||
|
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm0 398.7c-105.1 0-190.7-85.5-190.7-190.7S150.9 65.3 256 65.3 446.7 150.9 446.7 256 361.1 446.7 256 446.7z"/><path d="M264 128h-16v120H128v16h120v120h16V264h120v-16H264z"/></svg>
|
Before Width: | Height: | Size: 331 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm128 216H264v120h-16V264H128v-16h120V128h16v120h120v16z"/></svg>
|
Before Width: | Height: | Size: 218 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M384 264H264v120h-16V264H128v-16h120V128h16v120h120v16z"/></svg>
|
Before Width: | Height: | Size: 135 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M438.4 192.4c12.2-14.2 19.6-32.3 19.6-52.2.1-43.8-35.5-79.6-80.4-82.1-1.6-.1-3.1-.1-4.8-.1-20.4-.1-39.1 6.8-53.8 18.1l53.8 52.4-10.5 10.4c-25.7-19.4-57-32-91-34.9v-.1c0-8.5-7-15.5-15.5-15.5s-15.5 7-15.5 15.5v.1c-33.9 2.9-65.1 15.5-90.7 34.9l-10.4-10.4L193 76.1c-14.7-11.4-33.4-18.2-53.7-18.1-1.6 0-3.2.1-4.8.1-45 2.5-80.6 38.3-80.4 82.1 0 19.8 7.4 38 19.6 52.2l54-52.6 9.5 9.5c-35.1 31.9-57.1 78-57.1 129.2 0 43.9 16.2 84 43 114.7l-36.4 44.6L99 448l35.2-42.9c31.6 30.2 74.4 48.9 121.6 48.9h.4c47.2 0 90.2-18.7 121.8-48.9l35.2 43 12.3-10.1-36.5-44.7c26.8-30.8 43-70.9 43-114.7 0-51.1-22-97.3-57.2-129.3l9.5-9.5 54.1 52.6zM76.2 167.8c-4.2-8.6-6.4-18.4-6.5-28-.1-35.1 28.4-64.6 65.5-66.8 12.7-.7 23.1 1.4 32.1 6.1l-91.1 88.7zm339.7 108.7c0 87.7-72 157.1-160.1 157.1-88 0-159.8-69.4-159.8-157.1 0-87.7 71.8-158.7 159.9-158.7 88.1 0 160 70.9 160 158.7zM344.7 79.2c8.8-4.8 19.3-6.8 32.1-6.1 37.2 2 65.6 31.5 65.5 66.8 0 9.6-2.3 19.4-6.5 28.1l-91.1-88.8z"/><path d="M256 160v128h-96v16h112V160z"/></svg>
|
Before Width: | Height: | Size: 1.1 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M438.4 192.4c12.2-14.2 19.6-32.3 19.6-52.2.1-43.8-35.5-79.6-80.4-82.1-1.6-.1-3.1-.1-4.8-.1-20.4-.1-39.1 6.8-53.8 18.1l53.8 52.4-10.6 10.4c-25.7-19.4-57.2-32-91.2-34.9v-.1c0-8.5-7-15.5-15.5-15.5s-15.5 7-15.5 15.5v.1c-34 2.9-65 15.5-90.6 34.9L139 128.6l53.8-52.4c-14.7-11.4-33.4-18.2-53.7-18.1-1.6 0-3.2.1-4.8.1-45 2.5-80.6 38.3-80.4 82.1 0 19.8 7.4 38 19.6 52.2l54-52.6 9.5 9.5c-35.1 31.9-57.1 78-57.1 129.2 0 43.9 16.2 84 43 114.7l-36.4 44.6L99 448l35.2-42.9c31.6 30.2 74.4 48.9 121.6 48.9h.4c47.2 0 90.2-18.7 121.8-48.9l35.2 43 12.3-10.1-36.5-44.7c26.8-30.8 43-70.9 43-114.7 0-51.1-22-97.3-57.2-129.3l9.5-9.5 54.1 52.6zM272 304H160v-16h96V160h16v144z"/></svg>
|
Before Width: | Height: | Size: 756 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M464 144v288H48V144h416m16-16H32v320h448V128zM72 96h368v16H72zM104 64h304v16H104z"/></svg>
|
Before Width: | Height: | Size: 186 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M480 128H32v320h448V128zM72 96h368v16H72zM104 64h304v16H104z"/></svg>
|
Before Width: | Height: | Size: 165 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm0 398.7c-105.1 0-190.7-85.5-190.7-190.7 0-105.1 85.5-190.7 190.7-190.7 105.1 0 190.7 85.5 190.7 190.7 0 105.1-85.6 190.7-190.7 190.7z"/><path d="M256 333.1c-8.8 0-16 7.2-16 16s7.2 16 16 16 16-7.2 16-16-7.2-16-16-16zM244.2 233.2V144h24v89.2l-6 70.8h-12l-6-70.8z"/></svg>
|
Before Width: | Height: | Size: 424 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm-11.8 96h24v89.2l-6 70.8h-12l-6-70.8V144zM256 365.1c-8.8 0-16-7.2-16-16s7.2-16 16-16 16 7.2 16 16c0 8.9-7.2 16-16 16z"/></svg>
|
Before Width: | Height: | Size: 281 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M378.605 133.395C305.902 60.69 189.38 47.998 116.85 48c-38.926 0-65.19 3.658-65.19 3.658s-29.985 215.227 81.735 326.947C206.1 451.31 322.617 464 395.15 464c38.925 0 65.19-3.658 65.19-3.658s29.986-215.226-81.735-326.947zM65.142 65.208C76.137 64.194 94.374 63 116.856 63H117l-.068-.07c27.167 0 53.167 1.753 77.792 5.22l-126.6 126.58a515.877 515.877 0 0 1-2.64-22.246c-4.586-47.435-2.086-88.228-.342-107.276zM143.9 368.102c-23.85-23.852-42.793-54.938-56.304-92.396-6.973-19.332-12.51-40.373-16.57-62.866L212.838 71.05c10.672 1.93 21.064 4.19 31.14 6.804 52.028 13.492 93.784 35.708 124.14 66.064 23.85 23.85 42.786 54.928 56.297 92.386 6.974 19.333 12.51 40.375 16.567 62.87L299.17 440.987c-10.66-1.93-21.04-4.19-31.104-6.8-52.03-13.49-93.806-35.727-124.166-66.084zm302.96 78.766c-10.993 1.012-29.23 2.275-51.71 2.275-27.19 0-53.224-1.77-77.875-5.25l126.607-126.607a516.862 516.862 0 0 1 2.638 22.233c4.588 47.436 2.086 88.297.34 107.348z"/><path d="M307.304 317.847l22.625 22.632-28.655 28.65 11.315 11.315 67.88-67.88-11.313-11.315-28.72 28.72-22.626-22.63 28.717-28.717-11.313-11.313-28.715 28.714-22.634-22.638 28.702-28.702-11.313-11.314-28.7 28.7-22.626-22.63 28.696-28.698-11.314-11.313-28.694 28.694-22.63-22.637 28.686-28.687-11.313-11.313-28.684 28.685-22.624-22.63 28.682-28.682-11.313-11.313-67.882 67.882 11.314 11.313 28.693-28.694 22.624 22.63-28.692 28.69 11.313 11.313 28.69-28.69 22.63 22.638-28.678 28.68 11.313 11.313 28.677-28.677 22.626 22.63-28.674 28.675 11.314 11.314 28.67-28.67 22.634 22.637-28.66 28.66 11.314 11.315z"/></svg>
|
Before Width: | Height: | Size: 1.6 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M378.605 133.395C305.902 60.69 189.38 47.998 116.85 48c-38.926 0-65.19 3.658-65.19 3.658s-29.985 215.227 81.735 326.947C206.1 451.31 322.617 464 395.148 464c38.927 0 65.193-3.658 65.193-3.658s29.987-215.226-81.735-326.947zm-310.48 61.333L194.706 68.146c6.123.86 12.164 1.825 18.112 2.9L71.024 212.837a476.047 476.047 0 0 1-2.9-18.11zM267.31 335.195L296 306.507l-22.627-22.628-28.688 28.687-11.313-11.312 28.688-28.688-22.627-22.627-28.688 28.688-11.313-11.312 28.688-28.688L205.492 216l-28.688 28.688-11.313-11.312 28.69-28.69-22.628-22.626-28.688 28.688-11.314-11.313 67.884-67.883 11.313 11.314-28.688 28.688 22.627 22.627 28.688-28.687 11.313 11.313L216 205.494l22.628 22.628 28.688-28.688 11.314 11.313-28.688 28.688 22.627 22.627 28.687-28.688 11.313 11.312-28.688 28.688 22.628 22.628 28.688-28.688 11.312 11.313-28.688 28.688 22.627 22.627 28.687-28.688 11.314 11.312-67.882 67.884-11.313-11.313 28.688-28.688-22.628-22.63-28.688 28.69-11.315-11.315zM317.26 443.89c-6.122-.862-12.16-1.83-18.105-2.905L440.98 299.16a474.432 474.432 0 0 1 2.9 18.11L317.26 443.89z"/></svg>
|
Before Width: | Height: | Size: 1.1 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M403.1 108.9c-81.2-81.2-212.9-81.2-294.2 0s-81.2 212.9 0 294.2c81.2 81.2 212.9 81.2 294.2 0 81.2-81.2 81.2-213 0-294.2zm-281.9 12.3c74.3-74.3 195.3-74.3 269.6 0 38 38 56.5 88.1 55.7 138-2.9-4.6-23.1-35.2-52.5-35.2-27.9 0-42.3 26.1-51.8 43.3-1.4 2.6-2.8 5-4 7.1-11.6 19.5-27.7 30.4-43.1 29.3-13.6-1-25.2-11.3-32.6-29.2-9.3-22.4-29.6-46.5-53.7-49.9-11.4-1.6-28.6.9-45.3 21.7-3.3 4.1-7 9.5-11.2 15.9-10.6 15.7-26.5 39.4-38.7 41.4-21 3.4-36.6-12.2-39.3-14.6-2-1.7-4.4-4.3-7.3-7.6-7.5-56.9 10.5-116.6 54.2-160.2zm269.6 269.6c-74.3 74.3-195.3 74.3-269.6 0-24.2-24.2-40.5-53.3-48.9-84.1 7 5.7 19.3 13.3 35.5 13.3 2.7 0 5.6-.2 8.5-.7 19-3.1 35.8-28.1 49.4-48.2 3.9-5.8 7.5-11.2 10.4-14.8 9.7-12 20-17.4 30.6-15.9 12.9 1.8 31.1 16.2 41.1 40.2 9.9 23.7 26.3 37.6 46.3 39 21.6 1.5 43.3-12.4 58-37.1 1.4-2.3 2.8-4.8 4.2-7.5 8.6-15.6 19.3-35.1 37.7-35.1 11.1 0 20.9 7.3 27.2 13.4 7.4 7.2 9 9 12.9 14.6 3.4 4.8 6.5 8.7 10.3 16.7-5.8 38.9-23.7 76.3-53.6 106.2z"/></svg>
|
Before Width: | Height: | Size: 1.0 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M403.1 108.9c-81.2-81.2-212.9-81.2-294.2 0s-81.2 212.9 0 294.2c81.2 81.2 212.9 81.2 294.2 0 81.2-81.2 81.2-213 0-294.2zm-281.9 12.3c74.3-74.3 195.3-74.3 269.6 0 38 38 56.5 88.1 55.7 138-2.9-4.7-23.1-35.2-52.5-35.2-27.9 0-42.3 26.1-51.8 43.3-1.4 2.6-2.8 5-4 7.1-11.6 19.5-27.7 30.4-43.1 29.3-13.6-1-25.2-11.3-32.6-29.2-9.3-22.4-29.6-46.5-53.7-49.9-11.4-1.6-28.6.9-45.3 21.7-3.3 4.1-7 9.5-11.2 15.9-10.6 15.7-26.5 39.4-38.7 41.4-21 3.4-36.6-12.2-39.3-14.6-2-1.7-4.4-4.3-7.2-7.5-7.6-57 10.4-116.7 54.1-160.3z"/></svg>
|
Before Width: | Height: | Size: 585 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256c0 65.5 30.3 123.9 77.6 162.1l-.6 1.1 8.3 4.8c34.4 25.2 76.8 40 122.7 40 114.9 0 208-93.1 208-208S370.9 48 256 48zm176.9 133.3c10 23.7 15.1 48.8 15.1 74.7 0 5.4-.2 10.7-.7 16H284.5l94.4-163.5c4.4 3.7 8.7 7.6 12.9 11.7 17.6 17.7 31.4 38.2 41.1 61.1zM237 257.1l9.9-17.1h18.7l9.4 16.4-9 15.6h-20.4l-8.6-14.9zm93.7-178c12.5 5.3 24.3 11.9 35.4 19.6l-81.8 141.7-95-164.5C210.6 68 233 64 256 64c25.9 0 51.1 5.1 74.7 15.1zm-210.5 41.1c15.9-15.9 34.1-28.7 54.2-38.1l82 141.9H66.7c2.5-14.7 6.6-28.9 12.4-42.7 9.7-22.9 23.5-43.4 41.1-61.1zm0 271.6c-17.6-17.6-31.5-38.2-41.2-61-9.9-23.7-15-48.9-15-74.8 0-5.4.2-10.7.7-16h163.8l-94.7 164c-4.7-3.8-9.2-7.9-13.6-12.2zm61.1 41.1c-12.3-5.2-23.9-11.6-34.7-19.1l81.2-140.7L322 436.3c-21.1 7.7-43.3 11.7-66 11.7-25.9 0-51.1-5.1-74.7-15.1zm210.5-41.1c-16 16-34.4 28.9-54.8 38.4L254.9 288h190.5c-2.5 14.7-6.6 28.9-12.4 42.7-9.8 22.9-23.6 43.4-41.2 61.1z"/></svg>
|
Before Width: | Height: | Size: 993 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M246.9 240l-9.9 17.1 8.6 14.9H266l9.1-15.6-9.5-16.4z"/><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm-1.1 240L337 430.1c-2.1 1-4.1 1.9-6.2 2.8-2.9 1.2-5.8 2.4-8.7 3.4l-94.2-163.2-81.2 140.7c-4.4-3.1-8.7-6.3-12.8-9.7l94.7-164H64.7c.4-5.4 1.1-10.7 2-16h189.7l-81.9-142c2.2-1.1 4.5-2.1 6.8-3 2.7-1.1 5.4-2.2 8.1-3.2l95 164.5 81.8-141.7c4.4 3.1 8.7 6.4 12.8 9.8L284.5 272h162.8c-.4 5.4-1.1 10.7-2 16H254.9z"/></svg>
|
Before Width: | Height: | Size: 529 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M154 80c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22V86c0-12.1-9.9-22-22-22zM282 80c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22V86c0-12.1-9.9-22-22-22zM410 80c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22V86c0-12.1-9.9-22-22-22zM154 224c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6v-52c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22v-52c0-12.1-9.9-22-22-22zM282 224c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6v-52c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22v-52c0-12.1-9.9-22-22-22zM410 224c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6v-52c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22v-52c0-12.1-9.9-22-22-22zM154 368c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6v-52c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22v-52c0-12.1-9.9-22-22-22zM282 368c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6v-52c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22v-52c0-12.1-9.9-22-22-22zM410 368c3.3 0 6 2.7 6 6v52c0 3.3-2.7 6-6 6h-52c-3.3 0-6-2.7-6-6v-52c0-3.3 2.7-6 6-6h52m0-16h-52c-12.1 0-22 9.9-22 22v52c0 12.1 9.9 22 22 22h52c12.1 0 22-9.9 22-22v-52c0-12.1-9.9-22-22-22z"/></svg>
|
Before Width: | Height: | Size: 1.7 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M154 160h-52c-12.1 0-22-9.9-22-22V86c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM282 160h-52c-12.1 0-22-9.9-22-22V86c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM410 160h-52c-12.1 0-22-9.9-22-22V86c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM154 304h-52c-12.1 0-22-9.9-22-22v-52c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM282 304h-52c-12.1 0-22-9.9-22-22v-52c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM410 304h-52c-12.1 0-22-9.9-22-22v-52c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM154 448h-52c-12.1 0-22-9.9-22-22v-52c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM282 448h-52c-12.1 0-22-9.9-22-22v-52c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22zM410 448h-52c-12.1 0-22-9.9-22-22v-52c0-12.1 9.9-22 22-22h52c12.1 0 22 9.9 22 22v52c0 12.1-9.9 22-22 22z"/></svg>
|
Before Width: | Height: | Size: 1013 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm0 398.7c-105.1 0-190.7-85.5-190.7-190.7 0-105.1 85.5-190.7 190.7-190.7 105.1 0 190.7 85.5 190.7 190.7 0 105.1-85.6 190.7-190.7 190.7z"/><path d="M139.3 352l34.2-28.8-24.7-16.2zM342.2 298c-6.8 3.2-15.2 14-3.9 28.6 9.1 11.7 18 8.7 26.5 25.4 4.8-4.1 9.4-21.7 7.3-35.7-2.4-15.3-12.3-26.5-29.9-18.3zM251.6 189.6c1.6-2.7.6-6.3-2.1-7.9l-15.1-8.6c-2.8-1.6-6.3-.6-7.9 2.1L189.1 240l-18.5 32-16.9 29.2 24.9 15 25.5-44.3 18.4-32 29.1-50.3zM230.6 240l-18.5 32h89.2l-18.1-32zM351 272h33v-32h-51zM181.1 240H128v32h34.6zM324.6 240l-60-105.8c-1.6-2.8-5.2-3.7-7.9-2.1l-15.1 8.6c-2.8 1.6-3.7 5.1-2.1 7.9l51.7 91.4 18.1 32 .2.3.5-.3 24.4-14.8-9.8-17.2zM343.2 272l-4.9-8.7-14.4 8.7-10.4 6.3 13 23 24.9-15.1z"/></svg>
|
Before Width: | Height: | Size: 851 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zM128 240h53.1l-18.5 32H128v-32zm11.3 112l9.5-45 24.8 16.2-34.3 28.8zm39.3-35.7l-24.9-15 16.9-29.2 18.5-32 37.4-64.8c1.6-2.8 5.2-3.7 7.9-2.1l15.1 8.6c2.8 1.6 3.7 5.1 2.1 7.9l-29 50.4-18.4 32-25.6 44.2zm33.5-44.3l18.4-32h52.7l18.1 32h-89.2zm97.4.3l-.2-.3-18.1-32-51.7-91.4c-1.6-2.7-.6-6.3 2.1-7.9l15.1-8.6c2.8-1.6 6.3-.6 7.9 2.1l60 105.8 9.8 17.2L310 272l-.5.3zm4 6l10.4-6.3 14.4-8.7 5 8.7 8.1 14.2-24.9 15-13-22.9zm51.2 73.7c-8.5-16.8-17.4-13.7-26.5-25.4-11.3-14.6-2.9-25.4 3.9-28.6 17.6-8.2 27.5 3 29.8 18.3 2.2 14-2.4 31.6-7.2 35.7zm19.3-80h-33l-18-32h51v32z"/></svg>
|
Before Width: | Height: | Size: 722 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M287.8 240c8.8 0 16.1 7.2 16.1 16s-7 16-15.9 16h-64c-8.8 0-16-7.2-16-16s7.2-16 16-16h63m1-16h-64c-17.6 0-32 14.4-32 32s14.4 32 32 32h64c17.6 0 32-14.4 32-32s-14.4-32-32-32z"/><path d="M416 112H96v80h16v208h288V192h16v-80zm-32 272H128V192h256v192zm16-208H112v-48h288v48z"/></svg>
|
Before Width: | Height: | Size: 374 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M112 400h288V208H112v192zm112-160h64c8.8 0 16 7.2 16 16s-7.2 16-16 16h-64c-8.8 0-16-7.2-16-16s7.2-16 16-16zM96 112v80h320v-80z"/></svg>
|
Before Width: | Height: | Size: 231 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M352 128.4L319.7 96 160 256l159.7 160 32.3-32.4L224.7 256z"/></svg>
|
Before Width: | Height: | Size: 163 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M128.4 160L96 192.3 256 352l160-159.7-32.4-32.3L256 287.3z"/></svg>
|
Before Width: | Height: | Size: 138 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm0 260.4L349.2 208l12.8 13.8L256 336 150 221.8l12.8-13.8L256 308.4z"/></svg>
|
Before Width: | Height: | Size: 230 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M349.2 208l12.8 13.8L256 336 150 221.8l12.8-13.8L256 308.4z"/><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm0 17.3c105.1 0 190.7 85.5 190.7 190.7 0 105.1-85.5 190.7-190.7 190.7-105.1 0-190.7-85.5-190.7-190.7 0-105.1 85.6-190.7 190.7-190.7z"/></svg>
|
Before Width: | Height: | Size: 366 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm48 301.2L290.2 362 176 256l114.2-106 13.8 12.8L203.6 256 304 349.2z"/></svg>
|
Before Width: | Height: | Size: 231 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M304 162.8L290.2 150 176 256l114.2 106 13.8-12.8L203.6 256z"/><path d="M256 48C141.1 48 48 141.1 48 256s93.1 208 208 208 208-93.1 208-208S370.9 48 256 48zm0 398.7c-105.1 0-190.7-85.5-190.7-190.7 0-105.1 85.5-190.7 190.7-190.7 105.1 0 190.7 85.5 190.7 190.7 0 105.1-85.6 190.7-190.7 190.7z"/></svg>
|
Before Width: | Height: | Size: 368 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M48 256c0 114.9 93.1 208 208 208s208-93.1 208-208S370.9 48 256 48 48 141.1 48 256zm260.4 0L208 162.8l13.8-12.8L336 256 221.8 362 208 349.2 308.4 256z"/></svg>
|
Before Width: | Height: | Size: 229 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M208 162.8l13.8-12.8L336 256 221.8 362 208 349.2 308.4 256z"/><path d="M48 256c0 114.9 93.1 208 208 208s208-93.1 208-208S370.9 48 256 48 48 141.1 48 256zm17.3 0c0-105.1 85.5-190.7 190.7-190.7 105.1 0 190.7 85.5 190.7 190.7 0 105.1-85.5 190.7-190.7 190.7-105.1 0-190.7-85.6-190.7-190.7z"/></svg>
|
Before Width: | Height: | Size: 365 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 464c114.9 0 208-93.1 208-208S370.9 48 256 48 48 141.1 48 256s93.1 208 208 208zm0-260.4L162.8 304 150 290.2 256 176l106 114.2-12.8 13.8L256 203.6z"/></svg>
|
Before Width: | Height: | Size: 230 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M162.8 304L150 290.2 256 176l106 114.2-12.8 13.8L256 203.6z"/><path d="M256 464c114.9 0 208-93.1 208-208S370.9 48 256 48 48 141.1 48 256s93.1 208 208 208zm0-17.3c-105.1 0-190.7-85.5-190.7-190.7 0-105.1 85.5-190.7 190.7-190.7 105.1 0 190.7 85.5 190.7 190.7 0 105.1-85.6 190.7-190.7 190.7z"/></svg>
|
Before Width: | Height: | Size: 367 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M287.3 256L160 383.6l32.3 32.4L352 256 192.3 96 160 128.4z"/></svg>
|
Before Width: | Height: | Size: 138 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M376 248H155.3l66.3-74.4c2.9-3.4 3.2-8.1.1-11.2-3.1-3.1-8.5-3.3-11.4-.1l-80 88c-.2.2-.4.4-.5.6-.1.1-.1.2-.2.3-.1.1-.2.2-.3.4-.1.1-.1.2-.2.3-.1.1-.1.2-.2.3-.1.1-.1.2-.2.4-.1.1-.1.2-.2.3 0 .1-.1.2-.1.4 0 .1-.1.3-.1.4 0 .1-.1.2-.1.4 0 .1-.1.3-.1.4 0 .1 0 .3-.1.4v.3c-.1.5-.1 1.1 0 1.6v.3c0 .1 0 .3.1.4 0 .1.1.3.1.4 0 .1.1.2.1.4 0 .1.1.3.1.4 0 .1.1.2.1.4 0 .1.1.2.2.3.1.1.1.2.2.4.1.1.1.2.2.3.1.1.1.2.2.3.1.1.2.2.3.4.1.1.1.2.2.3.2.2.3.4.5.6l80 88c1.6 1.7 3.6 2.3 5.7 2.3 2 0 4.1-.8 5.7-2.3 3.1-3.1 3-8 0-11.3L155.3 264H376c4.4 0 8-3.6 8-8s-3.6-8-8-8z"/></svg>
|
Before Width: | Height: | Size: 625 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M248 136v220.7l-74.4-66.3c-3.4-2.9-8.1-3.2-11.2-.1-3.1 3.1-3.3 8.5-.1 11.4l88 80c.2.2.4.4.6.5.1.1.2.1.3.2.1.1.2.2.4.3.1.1.2.1.3.2.1.1.2.1.3.2.1.1.2.1.4.2.1.1.2.1.3.2.1 0 .2.1.4.1.1 0 .3.1.4.1.1 0 .2.1.4.1.1 0 .3.1.4.1.1 0 .3 0 .4.1h.3c.5.1 1.1.1 1.6 0h.3c.1 0 .3 0 .4-.1.1 0 .3-.1.4-.1.1 0 .2-.1.4-.1.1 0 .3-.1.4-.1.1 0 .2-.1.4-.1.1 0 .2-.1.3-.2.1-.1.2-.1.4-.2.1-.1.2-.1.3-.2.1-.1.2-.1.3-.2.1-.1.2-.2.4-.3.1-.1.2-.1.3-.2.2-.2.4-.3.6-.5l88-80c1.7-1.6 2.3-3.6 2.3-5.7 0-2-.8-4.1-2.3-5.7-3.1-3.1-8-3-11.3 0L264 356.7V136c0-4.4-3.6-8-8-8s-8 3.6-8 8z"/></svg>
|
Before Width: | Height: | Size: 625 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M136 264h220.7l-66.3 74.4c-2.9 3.4-3.2 8.1-.1 11.2 3.1 3.1 8.5 3.3 11.4.1l80-88c.2-.2.4-.4.5-.6.1-.1.1-.2.2-.3.1-.1.2-.2.3-.4.1-.1.1-.2.2-.3.1-.1.1-.2.2-.3.1-.1.1-.2.2-.4.1-.1.1-.2.2-.3 0-.1.1-.2.1-.4 0-.1.1-.3.1-.4 0-.1.1-.2.1-.4 0-.1.1-.3.1-.4 0-.1 0-.3.1-.4v-.3c.1-.5.1-1.1 0-1.6v-.3c0-.1 0-.3-.1-.4 0-.1-.1-.3-.1-.4 0-.1-.1-.2-.1-.4 0-.1-.1-.3-.1-.4 0-.1-.1-.2-.1-.4 0-.1-.1-.2-.2-.3-.1-.1-.1-.2-.2-.4-.1-.1-.1-.2-.2-.3-.1-.1-.1-.2-.2-.3-.1-.1-.2-.2-.3-.4-.1-.1-.1-.2-.2-.3-.2-.2-.3-.4-.5-.6l-80-88c-1.6-1.7-3.6-2.3-5.7-2.3-2 0-4.1.8-5.7 2.3-3.1 3.1-3 8 0 11.3l66.3 74.3H136c-4.4 0-8 3.6-8 8 0 4.5 3.6 8.1 8 8.1z"/></svg>
|
Before Width: | Height: | Size: 696 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M264 376V155.3l74.4 66.3c3.4 2.9 8.1 3.2 11.2.1 3.1-3.1 3.3-8.5.1-11.4l-88-80c-.2-.2-.4-.4-.6-.5-.1-.1-.2-.1-.3-.2-.1-.1-.2-.2-.4-.3-.1-.1-.2-.1-.3-.2-.1-.1-.2-.1-.3-.2-.1-.1-.2-.1-.4-.2-.1-.1-.2-.1-.3-.2-.1 0-.2-.1-.4-.1-.1 0-.3-.1-.4-.1-.1 0-.2-.1-.4-.1-.1 0-.3-.1-.4-.1-.1 0-.3 0-.4-.1h-.3c-.5-.1-1.1-.1-1.6 0h-.3c-.1 0-.3 0-.4.1-.1 0-.3.1-.4.1-.1 0-.2.1-.4.1-.1 0-.3.1-.4.1-.1 0-.2.1-.4.1-.1 0-.2.1-.3.2-.1.1-.2.1-.4.2-.1.1-.2.1-.3.2-.1.1-.2.1-.3.2-.1.1-.2.2-.4.3-.1.1-.2.1-.3.2-.2.2-.4.3-.6.5l-88 80c-1.7 1.6-2.3 3.6-2.3 5.7 0 2 .8 4.1 2.3 5.7 3.1 3.1 8 3 11.3 0l74.3-66.3V376c0 4.4 3.6 8 8 8 4.5 0 8.1-3.6 8.1-8z"/></svg>
|
Before Width: | Height: | Size: 698 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M383.6 352l32.4-32.3L256 160 96 319.7l32.4 32.3L256 224.7z"/></svg>
|
Before Width: | Height: | Size: 138 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M433.9 344.6C401 408.4 336.3 448 265.1 448c-50.5 0-97.3-19.9-131.9-56.1-34.4-36-53.3-84.2-53.3-135.9s18.9-99.9 53.3-135.9C167.8 83.9 214.7 64 265.1 64c50.9 0 93.9 19.3 121.1 54.2 26.3 33.8 34.5 78.1 23.2 124.9-10.9 45.1-33.5 65.8-50.5 75.2-17.5 9.7-41.8 13.4-52.4 4.4-.3-.3-.6-.6-.8-.9-1.5-1.9-2.3-5.4-2.4-8.5-.1-3.1.2-6.7 1-10.7.8-4 1.9-8.4 3.2-12.7L346.1 173h-21.3l-10 26.5c-4.6-12.1-10.6-20.8-18.1-26-7.5-5.3-15.7-7.9-24.5-7.9-14.2 0-27.2 3.5-38.9 10.4-11.8 6.9-21.8 15.9-30.1 27.1-8.3 11.2-14.7 23.8-19.3 37.7-4.6 13.9-6.8 27.9-6.8 41.9 0 8.1 1.2 15.7 3.6 22.7 2.4 7 5.9 13.2 10.4 18.6 4.5 5.4 10.1 9.7 16.7 12.8 6.6 3.1 14 4.7 22.3 4.7 10.2 0 19.7-2.7 28.5-8.4s16.3-12.1 22.5-18.1h.8c.8 9 4.7 15.5 9.8 20.1 2.6 2.3 6.3 4.5 11.1 6.1v.1c21.1 7.2 42.1 3 63.8-9 19.8-11 46.1-34.7 58.3-85.5 12.5-51.6 3.2-100.8-26.2-138.6C368.5 69.4 321 48 265.1 48c-54.8 0-105.7 21.7-143.3 61C84.5 148 64 200.2 64 256s20.5 108 57.8 147c37.6 39.4 88.6 61 143.3 61 77.1 0 147.2-42.9 182.9-112l-14.1-7.4zm-150.4-58.2c-6.1 9.8-13.3 18-21.5 24.8-8.2 6.7-17 10.1-26.6 10.1-9.8 0-17.9-3.6-24.3-10.7-6.4-7.2-9.6-16.9-9.6-29.3 0-9.6 1.6-20 4.9-31.2 3.3-11.1 8-21.5 14.1-31s13.5-17.4 22.1-23.7c8.6-6.3 18.1-9.5 28.4-9.5 4.1 0 8 1.1 11.9 3.3 3.8 2.2 7.2 5.1 10.2 8.7 3 3.6 5.5 7.6 7.4 12.2 1.9 4.5 2.9 9.3 2.9 14.2 0 9.1-1.8 19.3-5.3 30.6-3.6 11.2-8.5 21.7-14.6 31.5z"/></svg>
|
Before Width: | Height: | Size: 1.4 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M384 92.1c5.3 5 10.2 10.5 14.7 16.3 29.4 37.7 38.7 86.9 26.2 138.6-12.3 50.7-38.5 74.5-58.3 85.5-21.7 12-42.7 16.2-63.8 9v-.1c-4.8-1.6-8.5-3.8-11.1-6.1-5.1-4.6-9-11.1-9.8-20.1h-.8c-6.2 6-13.6 12.4-22.5 18.1-8.9 5.7-18.3 8.4-28.5 8.4-8.3 0-15.7-1.5-22.3-4.7-6.6-3.1-12.1-7.4-16.7-12.8s-8-11.6-10.4-18.6c-2.4-7-3.6-14.6-3.6-22.7 0-14 2.3-28 6.8-41.9 4.5-13.9 11-26.5 19.3-37.7 8.3-11.2 18.3-20.3 30.1-27.1 11.8-6.9 24.7-10.4 38.9-10.4 8.8 0 17 2.6 24.5 7.9s13.5 13.9 18.1 26l10-26.5h21.3L307.6 290c-1.3 4.3-2.4 8.7-3.2 12.7s-1.1 7.6-1 10.7c.1 3.1.9 6.6 2.4 8.5.2.3.5.6.8.9 10.6 9.1 34.9 5.3 52.4-4.4 17.1-9.4 39.7-30.1 50.5-75.2 11.3-46.8 3-91.1-23.2-124.9-22.8-29.2-54.6-58.8-96.8-66.5-13.9-2.5-22.1-3.8-33.5-3.8-114.9 0-208 93.1-208 208s93.1 208 208 208 208-93.1 208-208c0-66.6-31.3-125.9-80-163.9z"/><path d="M211.1 310.6c6.4 7.1 14.5 10.7 24.3 10.7 9.6 0 18.4-3.4 26.6-10.1 8.2-6.8 15.4-15 21.5-24.8s11-20.3 14.5-31.6 5.3-21.5 5.4-30.5c0-4.9-1-9.7-2.9-14.2-1-2.3-2.1-4.5-3.3-6.6-1.2-2-2.6-3.9-4.1-5.7-3-3.6-6.4-6.5-10.2-8.7-3.8-2.2-7.8-3.3-11.9-3.3-10.4 0-19.8 3.2-28.4 9.5-8.6 6.3-16 14.2-22.1 23.7-6.1 9.5-10.8 19.8-14.1 31-3.3 11.1-4.9 21.5-4.9 31.2v.1c0 12.4 3.2 22.1 9.6 29.3z"/></svg>
|
Before Width: | Height: | Size: 1.2 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M343.5 191.5c-4.7 0-8.5 3.8-8.5 8.5v157c0 19-7.5 38.2-20.9 52.4-13.7 14.4-33.3 22.6-52.1 22.6h-12c-39.5 0-74-36-74-75V135.9c0-30.6 25.4-54.8 56-54.8s55 24.2 55 54.8v214.3c0 17.2-13.6 33.8-31 33.8s-32-16.5-32-33.8V232c0-4.7-3.8-8.5-8.5-8.5s-8.5 3.8-8.5 8.5v118.2c0 28.8 22.3 49.8 49 49.8s48-20 48-49.8V135.9C304 96 271.6 64 231.7 64S160 96 160 135.9V357c0 23.2 9.5 46.8 27.3 64.3C205 438.7 226.8 448 250 448h12c48 0 90-41.4 90-91V200c0-4.7-3.8-8.5-8.5-8.5z"/></svg>
|
Before Width: | Height: | Size: 535 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M395 96H230c-46.7 0-73.2 34.7-102 63.5s-72.1 74.7-72.1 74.7C51 239.8 48 247 48 255.1c0 8 3 15.3 7.9 21 0 0 34.3 37.6 72.1 75.5 37.8 37.8 56.7 64.5 102 64.5h165c38.5 0 69-32.5 69-71V165c0-38.5-30.5-69-69-69zm53 249c0 14.5-5.3 28.4-15.5 38.7-10.1 10.4-23.3 16.3-37.5 16.3H230c-32.6 0-48.2-16.3-76.5-45.4l-85.7-89.2C66 263.3 64 259.8 64 255c0-4.7 2-8.2 3.8-10.3l83.1-86.1c12.2-12.7 23.8-24.5 36.9-33.3 13.8-9.3 27.2-13.4 42.2-13.4h165c14.3 0 27.5 5.3 37.6 15.4 10.1 10.1 15.4 23.3 15.4 37.6V345z"/><path d="M316.4 256l63.6-63.4-14.6-14.6-63.6 63.5-63.2-63.2-14.6 14.6 63.3 63.1-63.3 63.2 14.6 14.5 63.2-63.1 63.6 63.4 14.6-14.5z"/></svg>
|
Before Width: | Height: | Size: 705 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M395 96H230c-46.7 0-73.2 34.7-102 63.5s-72.1 74.7-72.1 74.7C51 239.8 48 247 48 255.1c0 8 3 15.3 7.9 21 0 0 34.3 37.6 72.1 75.5 37.8 37.8 56.7 64.5 102 64.5h165c38.5 0 69-32.5 69-71V165c0-38.5-30.5-69-69-69zm-29.6 238l-63.6-63.4-63.3 63.1-14.5-14.5 63.3-63.2-63.3-63.1 14.6-14.6 63.3 63.2 63.6-63.5 14.6 14.6-63.7 63.4 63.6 63.5-14.6 14.5z"/></svg>
|
Before Width: | Height: | Size: 418 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M48 384h80v-16H64V144h64v-16H48zM384 128v16h64v224h-64v16h80V128z"/><path d="M112 192h16v128h-16zM384 192h16v128h-16zM320 160h16v192h-16zM176 160h16v192h-16zM247 176h16v160h-16z"/></svg>
|
Before Width: | Height: | Size: 282 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M48 128v256h416V128H48zm80 192h-16V192h16v128zm64 32h-16V160h16v192zm71-16h-16V176h16v160zm73 16h-16V160h16v192zm64-32h-16V192h16v128z"/></svg>
|
Before Width: | Height: | Size: 239 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M462.686 279.37c.132-1.183.257-2.366.37-3.555l.01-.117c.61-6.485.934-13.053.934-19.698 0-114.863-93.13-208-208-208-7.95 0-15.792.462-23.512 1.33l-.27.03v.002C135.208 60.41 58.442 138.2 48.988 235.687h-.003c-.072.748-.13 1.497-.195 2.246a205.782 205.782 0 0 0-.353 4.743c-.026.418-.056.835-.08 1.254-.064 1.12-.116 2.245-.163 3.37-.01.282-.02.563-.032.844A211.116 211.116 0 0 0 48 256c0 114.863 93.137 208 208 208 2.627 0 5.24-.065 7.843-.162a227.567 227.567 0 0 0 4.202-.193c.455-.025.907-.058 1.36-.086 1.604-.104 3.2-.223 4.795-.36.703-.062 1.41-.116 2.112-.185v-.004c97.494-9.45 175.28-86.215 186.326-183.228h.004c.016-.137.028-.275.044-.413zM446.666 256c0 2.568-.067 5.122-.168 7.666a207.715 207.715 0 0 1-30.614-3.664l6.11-19.056-15.232-4.884-6.488 20.235a207.82 207.82 0 0 1-22.442-7.638 207.424 207.424 0 0 1-14.625-6.605l11.518-17.003-13.247-8.974-12.36 18.246c-12.24-7.35-23.702-15.977-34.304-25.812l14.73-14.73-11.313-11.313-14.73 14.73c-9.554-10.298-17.963-21.41-25.174-33.255l18.487-12.522-8.972-13.246-17.323 11.735a207.82 207.82 0 0 1-7.174-15.74 208.075 208.075 0 0 1-7.327-21.352l20.812-6.673-4.885-15.234-19.71 6.32a207.82 207.82 0 0 1-3.897-31.73c2.544-.1 5.097-.166 7.665-.166C361.133 65.335 446.666 150.87 446.666 256zm-381.33 0c0-1.317.024-2.63.05-3.94a207.7 207.7 0 0 1 26.892 3.41l-7.115 22.19 15.235 4.886 7.5-23.39a208.056 208.056 0 0 1 22.738 7.72c5.175 2.1 10.24 4.404 15.197 6.896l-13.405 19.79 13.246 8.973 14.22-20.992c12.037 7.28 23.32 15.793 33.764 25.483l-16.853 16.853 11.313 11.313 16.854-16.854c9.968 10.743 18.7 22.368 26.114 34.795l-20.753 14.058 8.972 13.246 19.473-13.19a208.258 208.258 0 0 1 14.363 37.893l-22.83 7.32 4.883 15.233 21.53-6.903a207.698 207.698 0 0 1 3.216 25.822c-1.312.026-2.623.05-3.94.05-105.13 0-190.664-85.535-190.663-190.665zm210.557 189.63a225.09 225.09 0 0 0-3.86-29.747l24.1-7.727-4.883-15.232-22.896 7.34a222.73 222.73 0 0 0-16.234-42.053l20.172-13.663-8.973-13.246-18.99 12.863a223.836 223.836 0 0 0-28.04-37.145l17.082-17.08-11.313-11.314-17.083 17.08a223.96 223.96 0 0 0-36.108-27.413l12.695-18.742-13.246-8.972-13.447 19.85a222.682 222.682 0 0 0-42.094-16.494l7.157-22.325-15.235-4.885-7.52 23.452a224.982 224.982 0 0 0-30.81-4.067c9.168-88.037 78.492-158.454 166.023-169.31a225.012 225.012 0 0 0 4.543 35.338l-25.935 8.316 4.885 15.235 24.903-7.985a222.673 222.673 0 0 0 16.387 41.246l-22.322 15.12 8.973 13.247 21.236-14.385c7.688 12.528 16.735 24.455 27.116 35.59l-19.204 19.204 11.313 11.314 19.203-19.205a223.968 223.968 0 0 0 36.647 27.746l-14.555 21.486 13.248 8.974 15.328-22.628a222.64 222.64 0 0 0 41.23 16.118l-8.168 25.477 15.232 4.884 8.525-26.59a225.095 225.095 0 0 0 34.223 4.31c-10.856 87.53-81.273 156.853-169.31 166.022z"/></svg>
|
Before Width: | Height: | Size: 2.7 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M256 48c-8.044 0-15.975.473-23.782 1.36C128.555 61.167 48 149.18 48 256c0 114.863 93.137 208 208 208 106.827 0 194.833-80.553 206.638-184.218A210.028 210.028 0 0 0 464 256c0-114.863-93.13-208-208-208zm3.94 398.614a208.734 208.734 0 0 0-3.21-25.804l-21.51 6.896-4.886-15.234 22.812-7.314a207.982 207.982 0 0 0-8.02-23.794 207.873 207.873 0 0 0-6.34-14.105l-19.465 13.185-8.97-13.247 20.743-14.054c-7.416-12.43-16.15-24.057-26.12-34.803l-16.85 16.854-11.314-11.313 16.85-16.85c-10.44-9.69-21.72-18.203-33.756-25.48l-14.216 20.987-13.247-8.973 13.404-19.788c-4.96-2.49-10.027-4.8-15.206-6.9a208.605 208.605 0 0 0-22.725-7.717l-7.5 23.39-15.236-4.884 7.115-22.192a207.708 207.708 0 0 0-26.904-3.412c.11-5.373.438-10.695.984-15.953a225.56 225.56 0 0 1 30.827 4.067l7.517-23.454 15.237 4.886-7.16 22.327a222.766 222.766 0 0 1 42.09 16.494l13.45-19.853 13.248 8.973-12.7 18.748a223.996 223.996 0 0 1 36.1 27.41l17.082-17.08 11.314 11.313-17.083 17.083a223.794 223.794 0 0 1 28.044 37.15l18.998-12.868 8.973 13.248-20.182 13.67a222.582 222.582 0 0 1 16.232 42.058l22.92-7.348 4.884 15.236-24.122 7.734a225.322 225.322 0 0 1 3.854 29.727c-5.26.547-10.582.874-15.957.984zm151.02-171.32l-8.528 26.603-15.236-4.885 8.174-25.493a222.824 222.824 0 0 1-41.218-16.117l-15.335 22.64-13.248-8.972 14.563-21.498a223.98 223.98 0 0 1-36.644-27.746l-19.206 19.204-11.312-11.314 19.202-19.203c-10.38-11.135-19.427-23.062-27.114-35.59l-21.248 14.393-8.974-13.248 22.335-15.127a222.717 222.717 0 0 1-16.384-41.24l-24.92 7.99-4.884-15.237 25.95-8.32a225.707 225.707 0 0 1-4.52-35.338 190.975 190.975 0 0 1 15.753-1.284c.506 10.744 1.858 21.335 3.97 31.808l19.745-6.36 4.907 15.213-20.79 6.66a208.37 208.37 0 0 0 7.334 21.347 207.833 207.833 0 0 0 7.174 15.73l17.315-11.728 8.973 13.245-18.477 12.516c7.21 11.847 15.62 22.958 25.175 33.255l14.73-14.73 11.313 11.312-14.732 14.73c10.602 9.837 22.062 18.464 34.302 25.814l12.352-18.234 13.248 8.973-11.512 16.993a207.246 207.246 0 0 0 14.635 6.608 208.012 208.012 0 0 0 22.422 7.632l6.484-20.22 15.233 4.885L415.864 260c10.116 1.984 20.286 3.31 30.626 3.824a191.86 191.86 0 0 1-1.284 15.768 226.123 226.123 0 0 1-34.245-4.3z"/></svg>
|
Before Width: | Height: | Size: 2.2 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M400 224v-96c0-35.2-28.8-64-64-64H176c-35.2 0-64 28.8-64 64v96H32l52.5 194.3c4.7 17 20.4 29.7 39.1 29.7h264.7c18.7 0 34.4-12.5 39.3-29.5L480 224h-80zm59 16h.1l-12.9 48H368v-48h91zM70.2 304H144v64H87.5l-17.3-64zm89.8 0h88v64h-88v-64zm192-16h-88v-48h88v48zm-104 0h-88v-48h88v48zm0 96v48h-88v-48h88zm16 0h88v48h-88v-48zm0-16v-64h88v64h-88zm104-64h73.9l-17.2 64H368v-64zM128 128c0-12.8 5-24.8 14.1-33.9C151.2 85 163.2 80 176 80h160c12.8 0 24.8 5 33.9 14.1 9.1 9.1 14.1 21.1 14.1 33.9v96H128v-96zm16 112v48H65.9l-13-48H144zm-44 174.1L91.8 384H144v48h-20.4c-11 0-20.7-7.3-23.6-17.9zm312.3.1c-3.1 10.5-12.9 17.8-23.9 17.8H368v-48h52.4l-8.1 30.2z"/></svg>
|
Before Width: | Height: | Size: 718 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M400 224v-96c0-35.2-28.8-64-64-64H176c-35.2 0-64 28.8-64 64v96H32l52.5 194.3c4.7 17 20.4 29.7 39.1 29.7h264.7c18.7 0 34.4-12.5 39.3-29.5L480 224h-80zm-272-96c0-12.8 5-24.8 14.1-33.9C151.2 85 163.2 80 176 80h160c12.8 0 24.8 5 33.9 14.1 9.1 9.1 14.1 21.1 14.1 33.9v96H128v-96zm313.9 176H368v64h56.7l-4.3 16H368v48h-16v-48h-88v48h-16v-48h-88v48h-16v-48H91.8l-4.3-16H144v-64H70.2l-4.3-16H144v-48h16v48h88v-48h16v48h88v-48h16v48h78.2l-4.3 16z"/><path d="M264 304h88v64h-88zM160 304h88v64h-88z"/></svg>
|
Before Width: | Height: | Size: 567 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M256 48C141.137 48 48 141.136 48 256s93.137 208 208 208c114.87 0 208-93.138 208-208S370.87 48 256 48zm190.664 208l-.002.145c-22.315-1.72-43.99-6.972-64.62-15.7a206.906 206.906 0 0 1-49.48-29.633 527.032 527.032 0 0 0 52.825-94.715c37.658 34.853 61.277 84.67 61.277 139.903zm-74.058-150.74c-.28.677-.55 1.355-.835 2.03-13.907 32.882-31.06 63.955-51.285 92.986a215.41 215.41 0 0 1-4.563-4.413c-19.107-19.107-34.107-41.354-44.583-66.12-8.698-20.563-13.934-42.163-15.672-64.4.11 0 .22-.005.332-.005 43.884 0 84.347 14.91 116.606 39.923zm-132.93-39.216c4.43 58.126 31.043 110.04 71.39 147.312a513.394 513.394 0 0 1-30.32 36.965c-47.553-50.03-104.814-90.745-168.766-119.13 31.636-36.457 76.853-60.815 127.695-65.146zm41.01 207.796c36.23 40.67 65.48 86.438 87.186 136.453-25.4 18.467-55.51 30.83-88.162 34.898-2.272-47.815-19.52-91.706-47.18-127.07a531.537 531.537 0 0 0 48.157-44.28zm-18.647-3.8a518.7 518.7 0 0 1-39.78 35.87c-38.736-42.886-93.83-70.707-155.45-73.636 4.07-32.646 16.433-62.75 34.897-88.146 59.195 25.688 112.445 61.947 158.332 107.833a523.63 523.63 0 0 1 9.81 10.09 524.704 524.704 0 0 1-7.81 7.99zM65.507 248.23c25.238 1.145 49.436 6.797 71.45 16.11 24.767 10.475 47.013 25.475 66.12 44.582a212.54 212.54 0 0 1 6.584 6.895c-31.414 23.915-65.427 44.05-101.708 60.182-26.632-32.795-42.618-74.563-42.618-120 0-2.604.068-5.19.172-7.77zm53.56 140.296a527.776 527.776 0 0 0 100.913-60.52 206.935 206.935 0 0 1 27.68 47.036c9.615 22.73 15.014 46.724 16.115 71.45-2.58.104-5.17.172-7.775.172-53.683 0-102.25-22.31-136.933-58.138zM380.81 400.02c-22.49-50.67-52.72-97.14-89.19-137.908a530.62 530.62 0 0 0 31.555-38.336c34.17 27.342 76.52 44.885 122.8 48.363-4.29 50.918-28.664 96.207-65.165 127.88z"/></svg>
|
Before Width: | Height: | Size: 1.8 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M256 48C141.137 48 48 141.136 48 256s93.137 208 208 208c114.87 0 208-93.138 208-208S370.87 48 256 48zm124.797 352.032a191.72 191.72 0 0 1-12.942 10.272c-21.704-50.015-50.938-95.795-87.168-136.465a530.98 530.98 0 0 1-48.156 44.28c27.66 35.363 44.917 79.253 47.19 127.068a191.17 191.17 0 0 1-15.944 1.303c-1.103-24.726-6.5-48.72-16.114-71.45a206.935 206.935 0 0 0-27.68-47.036 527.798 527.798 0 0 1-100.91 60.526A192.37 192.37 0 0 1 107.957 376c36.28-16.133 70.29-36.27 101.705-60.185a212.54 212.54 0 0 0-6.584-6.895c-19.107-19.107-41.354-34.107-66.12-44.583-22.015-9.312-46.212-14.964-71.45-16.108.217-5.38.648-10.704 1.303-15.96 61.62 2.93 116.714 30.753 155.45 73.638a518.323 518.323 0 0 0 39.78-35.87 529.307 529.307 0 0 0 7.81-7.988c-3.222-3.4-6.488-6.767-9.81-10.09-45.888-45.886-99.138-82.145-158.333-107.832a191.982 191.982 0 0 1 10.272-12.94c63.95 28.388 121.21 69.102 168.766 119.133a513.127 513.127 0 0 0 30.32-36.964c-40.348-37.27-66.957-89.188-71.39-147.312 5.274-.45 10.605-.692 15.99-.702 1.74 22.238 6.975 43.838 15.672 64.4 10.476 24.768 25.476 47.014 44.583 66.12 1.5 1.5 3.026 2.966 4.563 4.414 20.226-29.03 37.38-60.104 51.287-92.987.285-.675.555-1.354.835-2.03 4.42 3.427 8.68 7.043 12.78 10.836a527.127 527.127 0 0 1-52.823 94.716 206.91 206.91 0 0 0 49.48 29.635c20.63 8.727 42.304 13.978 64.62 15.698a191.785 191.785 0 0 1-.69 15.99c-46.277-3.478-88.63-21.017-122.8-48.358a530.62 530.62 0 0 1-31.556 38.336c36.475 40.77 66.69 87.247 89.18 137.92z"/></svg>
|
Before Width: | Height: | Size: 1.5 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M384 144H80c-17.6 0-32 14.4-32 32v160c0 17.6 14.4 32 32 32h304c17.6 0 32-14.4 32-32V176c0-17.6-14.4-32-32-32zm16 192c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V176c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16v160z"/><path d="M370 176H94c-8.8 0-14 5.2-14 14v132c0 8.8 5.2 14 14 14h276c8.8 0 14-5.2 14-14V190c0-8.8-5.2-14-14-14zM218.8 308l8.4-43H200l45.2-61-8.4 43H264l-45.2 61zM432 200.6v110.8c19.1-11.1 32-31.7 32-55.4s-12.9-44.3-32-55.4z"/></svg>
|
Before Width: | Height: | Size: 514 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M384 144H80c-17.6 0-32 14.4-32 32v160c0 17.6 14.4 32 32 32h304c17.6 0 32-14.4 32-32V176c0-17.6-14.4-32-32-32zm16 192c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V176c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16v160zM432 200.6v110.8c19.1-11.1 32-31.7 32-55.4s-12.9-44.3-32-55.4z"/></svg>
|
Before Width: | Height: | Size: 351 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M384 144H80c-17.6 0-32 14.4-32 32v160c0 17.6 14.4 32 32 32h304c17.6 0 32-14.4 32-32V176c0-17.6-14.4-32-32-32zm16 192c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V176c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16v160z"/><path d="M370 176H94c-8.8 0-14 5.2-14 14v132c0 8.8 5.2 14 14 14h276c8.8 0 14-5.2 14-14V190c0-8.8-5.2-14-14-14zM432 200.6v110.8c19.1-11.1 32-31.7 32-55.4s-12.9-44.3-32-55.4z"/></svg>
|
Before Width: | Height: | Size: 464 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M445.2 48H128.4C74.1 48 64 75.9 64 88.2c30.3 4.2 32 4.2 32 36.2v275.5c0 35.3 28.8 64 64.2 64H368c35.4 0 63-29.2 63-64.5V89.2c2-17.5 12.5-31.6 13.6-33.3 1.2-1.9 3.4-4.4 3.4-5.5 0-1.2-.3-2.4-2.8-2.4zM415 89.3v310.2c0 13-4.7 24.4-13.7 33.7-9 9.3-20.5 14.8-33.2 14.8h-208c-26.4 0-48.1-21.9-48.1-48.5v-275c0-16.7.3-30.8-8.3-40.4-4.3-4.8-10.6-6.3-17.3-8.2 5.7-5 17.7-12 42.1-12h293.6c0 .1-7.1 6.4-7.1 25.4z"/><path d="M383 176v208c0 10.2-1.8 18-5.5 21.9-5.7 5.8-13.8 10.2-20.1 10.2h-187c-8.8 0-15.4-2.7-19.5-7.9-4.4-5.4-6.9-14.3-6.9-25.1V176h239m16-16H128v223c0 28.3 13.7 49 42.4 49h187c11.4 0 23.4-6.7 31.5-15 8.1-8.4 10.1-21.3 10.1-33V160z"/></svg>
|
Before Width: | Height: | Size: 715 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M170.4 416h187c6.3 0 14.4-4.3 20.1-10.2 3.8-3.9 5.5-11.6 5.5-21.9V176H144v207c0 10.8 2.6 19.7 6.9 25.1 4.1 5.2 10.7 7.9 19.5 7.9z"/><path d="M445.2 48H128.5C74.1 48 64 75.9 64 88.2c30.3 4.2 32 4.2 32 36.2v275.5c0 35.3 28.9 64 64.2 64H368c35.4 0 63-29.2 63-64.5V89.2c2-17.5 12.5-31.6 13.6-33.3 1.2-1.9 3.4-4.4 3.4-5.5 0-1.2-.3-2.4-2.8-2.4zM399 384c0 11.7-1.9 24.6-10.1 33-8.1 8.3-20.2 15-31.5 15h-187c-28.7 0-42.4-20.7-42.4-49V160h271v224z"/></svg>
|
Before Width: | Height: | Size: 518 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M383.7 118.3c0-20.8-17.2-38.3-38.1-38.3l-10.5-.7c-6-27-32-47.3-59.1-47.3s-41.1 11.6-51.7 28.9c-8.5-9.8-21.1-15.4-35.2-15.4-18.3 0-34.1 11.5-41.7 26.5H123c-25 0-43 19.6-43 45.4v4c0 28.8 16 20.9 16 39.8V268c0 13.4-11.2 19.3-11.2 35.2 0 8.8 8 16.8 16.8 16.8H112V144h272s-.3-4.9-.3-25.7zm-16.1 9.7H111.2h-10.8c-3 0-4.4-3.8-4.4-6.6v-4c0-8.9 3.4-16.4 8.2-21.9 4.6-5.3 11.4-7.5 18.8-7.5h34.5l4.3-9.6c5-10.5 15.4-17.2 27.3-17.2 9 0 18.5 5.1 26.2 11.1l10.7 9.3 8-10c11.3-15 26.4-23.8 42.1-23.8 10.3 0 20 3.4 28 9.9 7.8 6.3 13.3 15.1 15.4 24.8l2.6 11.8s9.4-.4 23.5 1.6 22.1 10.4 22.1 22.4l-.1 9.7z"/><circle cx="288" cy="224" r="20"/><circle cx="256" cy="272" r="16"/><circle cx="276" cy="352" r="12"/><path d="M96 464h304v16H96zM416 208h-48v-48H128v272l-16 16h272l-16-16v-64h48c8.8 0 16-7.2 16-16V224c0-8.8-7.2-16-16-16zm-64 224H144V176h208v256zm64-80h-48V224h48v128z"/></svg>
|
Before Width: | Height: | Size: 938 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M112 320V144h272s-.3-4.9-.3-25.7S366.5 80 345.6 80l-10.5-.7c-6-27-32-47.3-59.1-47.3s-41.1 11.6-51.7 28.9c-8.5-9.8-21.1-15.4-35.2-15.4-18.3 0-34.1 11.5-41.7 26.5H123c-25 0-43 19.6-43 45.4v4c0 28.8 16 20.9 16 39.8V268c0 13.4-11.2 19.3-11.2 35.2 0 8.8 8 16.8 16.8 16.8H112z"/><path d="M416 208h-48v-48H128v272l-32 32v16h304v-16l-32-32v-64h48c8.8 0 16-7.2 16-16V224c0-8.8-7.2-16-16-16zm-128-4c11 0 20 9 20 20s-9 20-20 20-20-9-20-20 9-20 20-20zm0 148c0 6.6-5.4 12-12 12s-12-5.4-12-12 5.4-12 12-12 12 5.4 12 12zm-32-96c8.8 0 16 7.2 16 16s-7.2 16-16 16-16-7.2-16-16 7.2-16 16-16zm160 96h-48V224h48v128z"/></svg>
|
Before Width: | Height: | Size: 675 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M125.3 261.3c-51.3 0-93.3 42-93.3 93.3C32 406 74 448 125.3 448s93.3-42 93.3-93.3c.1-51.4-41.9-93.4-93.3-93.4zm54.6 148c-14.7 14.7-34 22.7-54.6 22.7s-39.9-8.1-54.6-22.7S48 375.2 48 354.7c0-20.6 8.1-39.9 22.7-54.6 14.7-14.7 34-22.7 54.6-22.7s39.9 8.1 54.6 22.7c14.7 14.7 22.7 34 22.7 54.6.1 20.5-8 39.9-22.7 54.6zM319.8 127.8c17.8 0 32-14.2 32-32S337.8 64 320 64s-32.2 14-32.2 31.8 14.3 32 32 32zM386.7 261.3c-51.3 0-93.3 42-93.3 93.3s42 93.3 93.3 93.3 93.3-42 93.3-93.3-42-93.3-93.3-93.3zm54.6 148c-14.7 14.7-34 22.7-54.6 22.7s-39.9-8.1-54.6-22.7c-14.7-14.7-22.7-34-22.7-54.6s8.1-39.9 22.7-54.6c14.7-14.7 34-22.7 54.6-22.7s39.9 8.1 54.6 22.7c14.7 14.7 22.7 34 22.7 54.6 0 20.5-8.1 39.9-22.7 54.6z"/><path d="M368 192h-48l-29.5-60.1c-5.6-9.3-15.9-15.9-27.1-15.9-8.4 0-16.8 3.7-22.4 9.3l-71.7 69.1c-5.6 5.6-9.3 14-9.3 22.4 0 17.4 12.6 23.6 18.5 27.1C224 270.1 240 273 240 286.1V352c0 8.8 7.2 16 16 16s16-7.2 16-16v-90c0-13.2-30.4-24-48.3-38l48.9-51.5c18.7 28.5 27.3 51.5 38 51.5H368c8.8 0 16-7.2 16-16s-7.2-16-16-16z"/></svg>
|
Before Width: | Height: | Size: 1.1 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M286 256l98-87L255.8 32H240v180l-89.4-77-22.6 25 112 96-112 96 22.6 25.8L240 299v181h15.8l.2-.4L384 344l-98-88zm51.8 88.5L272 415V287.2l65.8 57.3zM272 225.6V97.1l65.8 71.2-65.8 57.3z"/></svg>
|
Before Width: | Height: | Size: 262 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 447.8c-29.6 0-69.9-6.7-96-15.8 0 0-35 22.5-80 32 32.3 0 53.3-9 80-16 23 9 66.7 15.8 96 15.8 29.3 0 74-5.8 96-15.8 26.7 7 47 16 80 16-43.8-9.5-80-32-80-32-26.1 9.1-66.4 15.8-96 15.8zM445.5 263l-30.7-14.1-23-121.9v-.1C386.3 100.3 374.4 80 352 80h-34.6l-8.2-32H202.5l-8.1 32H160c-22.9 0-35.1 20.7-39.8 47l-23 121.9L66.5 263c-6.2 2.9-10.5 9.1-10.5 16.4 0 2.4.5 4.6 1.3 6.7L112 432c27.5 0 56.7-19 56.7-19 19.9 10 60.8 18.8 87.3 18.8s67.4-8.8 87.3-18.8c0 0 29.2 19 56.7 19l54.7-145.9c.8-2.1 1.3-4.3 1.3-6.7 0-7.3-4.3-13.5-10.5-16.4zM214.9 64h81.8l4.1 16h-90l4.1-16zm-79 65.9C139.7 108.9 147 96 160 96h192c12.8 0 19.7 12.8 24.1 34.1L397 240.7 360.6 224h.2c8.9 0 16.8-4.6 15.1-16l-15.1-80c-3-11-7.2-16-16.1-16H167.4c-8.9 0-13.6 5.3-16.1 16l-15.1 80c-1.3 8 6.2 16 15.1 16h.2L115 240.7l20.9-110.8zM256 176l-69.7 32h-33.8l14.5-76.6c.4-1.6.8-2.7 1.1-3.4h175.8c.3.7.8 1.9 1.3 3.7l14.4 76.3h-33.8L256 176zm-88.3 218.6l-7.7 5c-5.7 3.7-21.2 12-36.7 15.2L72 279.4c0-1.1.8-1.6 1.1-1.8L248 195.7v219.8c-24-1.5-56.2-8.8-72.1-16.8l-8.2-4.1zm221 20.2c-15.5-3.2-31-11.5-36.7-15.2l-7.7-5-8.2 4.1c-15.9 8-48.2 15.4-72.1 16.8V195.7l174.9 81.9c.3.2 1.1.7 1.1 1.8l-51.3 135.4z"/><ellipse cx="300" cy="266" rx="12" ry="22"/><ellipse cx="212" cy="266" rx="12" ry="22"/></svg>
|
Before Width: | Height: | Size: 1.3 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M352 432c-26.1 9.1-66.4 15.8-96 15.8-29.6 0-69.9-6.7-96-15.8 0 0-35 22.5-80 32 32.3 0 53.3-9 80-16 23 9 66.7 15.8 96 15.8 29.3 0 74-5.8 96-15.8 26.7 7 47 16 80 16-43.8-9.5-80-32-80-32zM445.5 263L256 176 66.5 263c-6.2 2.9-10.5 9.1-10.5 16.4 0 2.4.5 4.6 1.3 6.7L112 432c27.5 0 56.7-19 56.7-19 18 9 53.1 17.1 79.3 18.6 2.8.2 5.5.2 8 .2s5.2-.1 8-.2c26.2-1.5 61.3-9.5 79.3-18.6 0 0 29.2 19 56.7 19l54.7-145.9c.8-2.1 1.3-4.3 1.3-6.7 0-7.3-4.3-13.5-10.5-16.4zM212 288c-6.6 0-12-9.8-12-22s5.4-22 12-22 12 9.8 12 22-5.4 22-12 22zm88 0c-6.6 0-12-9.8-12-22s5.4-22 12-22 12 9.8 12 22-5.4 22-12 22z"/><path d="M391.9 127v-.1C386.3 100.3 374.4 80 352 80h-34.6l-8.2-32H202.5l-8.1 32H160c-22.9 0-35.1 20.7-39.8 47l-19.7 104.4 34.2-15.7 16.6-87.7c2.5-10.7 7.3-16 16.1-16h177.1c8.9 0 13.1 5 16.1 16l16.6 87.7 34.3 15.7L391.9 127z"/></svg>
|
Before Width: | Height: | Size: 891 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M256 47.96c17.645 0 32 14.35 32 31.99s-14.355 31.99-32 31.99-32-14.35-32-31.99 14.355-31.99 32-31.99m0-15.996c-26.51 0-48 21.483-48 47.986 0 26.502 21.49 47.985 48 47.985s48-21.483 48-47.985c0-26.503-21.49-47.986-48-47.986zM424 144H88c-13.255 0-24 10.747-24 24s10.745 24 24 24h100.45c5.55 0 13.198 4.295 17.217 14.708 4.65 12.055 2.37 33.33-.54 51.444l-3.922 21.26c-.02.104-.205.1-.205.203l-32.23 172.238c-2.302 13.05 6.488 25.494 19.54 27.797a24.52 24.52 0 0 0 4.22.367c11.356 0 20.916-8.19 22.97-19.836L236 340.243v.166S243.25 309 255.452 309h1.096C269 309 274 340.408 274 340.408v-.082l21.483 119.895c2.052 11.643 12.33 19.816 23.763 19.816 1.387 0 2.855-.12 4.268-.368 13.053-2.303 21.82-14.76 19.52-27.81l-32.35-172.252c-.002-.008.01-.02.01-.027-.02-.105-.033-.218-.053-.323l-3.77-21.41c-2.91-18.12-5.188-39.084-.538-51.138C310.352 196.294 318.5 192 323.55 192H424c13.255 0 24-10.747 24-24s-10.745-24-24-24zM88 176.113c-4.41 0-8-3.646-8-8.057 0-4.41 3.59-8.057 8-8.057h336c4.41 0 8 3.59 8 8s-3.59 8-8 8H322.5c-15.538 0-27.438 14.737-30.982 23.92-4.846 12.558-5.004 31.943-.388 60.69l-.01.103.007.11 3.367 19.138.562 3.242 32.252 171.628c.5 2.834-.62 4.96-1.332 5.977-.713 1.017-2.335 2.8-5.18 3.3a8.324 8.324 0 0 1-1.426.127c-3.893 0-7.207-2.64-7.883-6.472L290.255 338h-.015c-.27-2-1.828-10.05-5.022-18.77-2.278-6.218-4.844-11.035-7.844-15.006-7.09-9.388-15.24-11.224-20.826-11.224h-1.096c-5.47 0-13.503 1.73-20.71 10.938-3.05 3.896-5.73 8.67-8.19 14.802-3.628 9.037-5.505 17.654-5.708 18.613l-.11.37-20.728 119.9c-.693 3.885-3.75 6.595-7.44 6.595-.46 0-.933-.043-1.404-.127-2.84-.5-4.455-2.274-5.165-3.287a7.96 7.96 0 0 1-1.323-5.975l32.257-171.562.005-.02.174-.926 3.774-21.33.022-.125.02-.126c4.63-28.83 4.528-48.3-.33-60.892-3.544-9.18-13.577-23.737-31.76-23.737"/></svg>
|
Before Width: | Height: | Size: 1.8 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><circle cx="256" cy="79.838" r="48"/><path d="M424 144H88c-13.255 0-24 10.745-24 24s10.745 24 24 24h98.45c5.58 1 13.198 3.837 17.217 14.252 4.65 12.056 2.37 33.606-.54 51.727l-3.774 21.394c-.02.104-.04.207-.058.31l-.004.02-30.374 172.27c-2.303 13.052 6.414 25.5 19.467 27.802 13.055 2.3 25.333-6.416 27.634-19.47L237 340.347v.167S243.25 308 255.452 308h1.096C269 308 275 340.515 275 340.515v-.083l20.983 119.913c2.3 13.055 14.663 21.75 27.718 19.448 13.054-2.303 21.73-14.762 19.426-27.814L312.73 279.702c-.002-.008-.013-.02-.015-.027-.02-.104-.044-.217-.063-.322l-3.777-21.414c-2.91-18.12-5.19-39.63-.54-51.688C312.354 195.838 319.97 193 325.548 192H424c13.255 0 24-10.745 24-24s-10.745-24-24-24z"/></svg>
|
Before Width: | Height: | Size: 793 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M255 352.1l.1.8.2.9 15 75 .1.5.1.5c.4 1.4.6 2.8.6 4.2 0 9.6-8.3 14-16 14-4.7 0-8.9-1.5-11.8-4.2-2.8-2.5-4.2-5.8-4.2-9.8 0-1.2.1-2.3.4-3.5v-.4l15.5-78m0-16.1c-7.6 0-14 5.4-15.6 12.5L223.8 427c-.5 2.3-.8 4.6-.8 7 0 17.7 14.3 30 32 30s32-12.3 32-30c0-2.9-.4-5.7-1.1-8.4l-15-75c-.7-8.2-7.5-14.6-15.9-14.6zM333 365.1l41.3 30.1.7.5.7.4c.3.2 1.1.9 1.7 1.4.4.4.9.7 1.3 1.1.4.3 1.1 1.7 1.3 3.8.1 2.8-.8 5.6-2.4 7.2-1.4 1.4-3.8 2.3-6.4 2.3-2.6 0-4.3-.9-4.8-1.4-.2-.3-.5-.6-.7-.9-.5-.5-1.1-1.2-1.2-1.5l-.3-.4-.3-.4-30.9-42.2m-17.1-29c-3 0-5.9 1.2-8.3 3.6-4.1 4.1-4.7 10.4-1.7 15.4l45 61.8c.9 1.5 2.2 2.8 3.4 4.2 4 4.6 10.3 7 16.9 7 6.4 0 13-2.3 17.7-7 9.6-9.6 9.4-27 0-34.7-1.7-1.4-3.3-2.9-5.1-3.9L324.2 339c-2.8-2-5.6-2.9-8.3-2.9zM178.9 365.2l-30.6 42-.3.4-.3.4c-.3.5-.7 1-1.2 1.5-1.6 1.6-3.7 2.5-6 2.5s-4.4-.9-6-2.5c-3.3-3.3-3.3-8.7 0-12 .5-.5 1.1-1 1.8-1.4l.7-.4.7-.5 41.2-30m16.7-29.2c-2.8 0-5.5.9-7.7 2.8l-59.6 43.4c-1.8 1.1-3.6 2.4-5.1 3.9-9.6 9.6-9.6 25.1 0 34.7 4.8 4.8 11 7.2 17.3 7.2 6.3 0 12.5-2.4 17.3-7.2 1.3-1.3 2.4-2.7 3.4-4.2l45-61.6c3-5 2.5-11.2-1.7-15.3-2.5-2.5-5.7-3.7-8.9-3.7zM279.3 68c9.3 3.4 20.5 9 30.8 16.6 14.9 10.9 32.6 29.2 32.6 54 0 14.1-2.4 24.7-7.9 34.3-6.5 11.6-18 22.6-35.2 33.8-7.3 4.8-15.6 9.4-24.4 14.4-29.8 16.8-66 37.1-84.7 75.5-2.9-2.2-5.9-5-8.9-8.2-13.5-14.9-18.6-34-15.2-56.7 3.8-24.8 26.2-45.7 49.9-67.8 28.2-25.9 59.4-54.9 63-95.9m-16.6-20c12 80.8-101.7 113-112 181.3-10.3 68.3 48 90.7 48 90.7 16.3-56.6 72.4-75.6 109.7-99.8 40.7-26.4 50.3-51.3 50.3-81.5 0-57.6-72.3-90.7-96-90.7zM355.7 196.1c-3.3 6.3-7.3 12.2-12.5 17.9 0 0 1.4 11.1 2 20.4s-.7 17.1-1.7 20c-6.5 19-15.1 32.1-26.4 39.8-9.8 6.7-22 9.8-38.5 9.8-6.4 0-16.4-3.9-24.2-10.9s-11.1-11.2-11.1-11.2c-4.1 3.5-7.5 6.5-11.1 10.5 11.3 16.4 31.3 27.7 46.3 27.7 36 0 64-13.5 80-60.4 5.3-14.9 2.2-49.4-2.8-63.6z"/><path d="M187.1 77.9c-1.5 0-2.9.1-4.3.3 2.3 28.6-30 44-32 64.8-1.2 12.6 5.5 25 11 28.8 3.8-4.8 10.7-11.9 10.7-11.9-4.5-3.7-6.7-12.7-5.5-16.8s6-9.9 10.6-15.5c6.7-8.2 15.2-18.5 19.1-31.6 1.3.6 2.6 1.2 3.8 2 2.9 1.7 6.8 3.9 9.7 7.4s5.8 6.9 8.4 11.5c0 0 6.3-7.9 8.8-12.6-9.6-18.1-26.9-26.4-40.3-26.4zM137.7 335.2l-60.5 12.6c-5.8 1.2-11.6-2.3-12.9-7.9-1.3-5.6 2.4-11.1 8.3-12.3.3-.1.7-.1 1-.2l61.5-7.3c4.4-.5 8.4 2.5 9 6.7.4 3.9-2.4 7.5-6.4 8.4zM374.3 335.2l60.5 12.6c5.8 1.2 11.6-2.3 12.9-7.9 1.3-5.6-2.4-11.1-8.3-12.3-.3-.1-.7-.1-1-.2l-61.5-7.3c-4.4-.5-8.4 2.5-9 6.7-.4 3.9 2.4 7.5 6.4 8.4z"/></svg>
|
Before Width: | Height: | Size: 2.4 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M270.9 350.6c-.7-8.2-7.6-14.6-15.9-14.6-7.6 0-14 5.4-15.6 12.5L223.8 427c-.5 2.3-.8 4.6-.8 7 0 17.7 14.3 30 32 30s32-12.3 32-30c0-2.9-.4-5.7-1.1-8.4l-15-75zM305.9 355zM388.9 386.3c-1.7-1.4-3.3-2.9-5.1-3.9l-59.6-43.5c-5.8-3.8-12-3.7-16.5.9-4.1 4.1-4.7 10.4-1.7 15.4l45 61.8c.9 1.5 2.2 2.8 3.4 4.2 7.8 9.1 25.1 9.6 34.6 0 9.4-9.8 9.3-27.2-.1-34.9zM372.5 335zM435.4 320h-59.5c-3.9 0-7.4 2.2-8.1 6.2-.6 3.6 1.3 7.1 4.7 8.8h.1l57.7 17.8c8.3 1.9 17.7-5.5 17.7-14.8 0-11.8-4.8-18-12.6-18zM139.2 335zM139.2 335c3.3-1.6 5.3-5.2 4.7-8.8-.7-4-3.9-6.2-8.1-6.2H76.3c-7.6 0-12.3 8.3-12.3 17.6s9.1 17.1 17.4 15.2l57.7-17.8h.1zM187.9 338.8l-59.6 43.4c-1.8 1.1-3.6 2.4-5.1 3.9-9.6 9.6-9.6 25.1 0 34.6 9.6 9.6 25.1 9.6 34.6 0 1.3-1.3 2.4-2.7 3.4-4.2l45-61.6c3-5 2.5-11.2-1.7-15.3-4.6-4.5-11.8-4.8-16.6-.8zM358.7 138.7c0-57.6-72.4-90.7-96-90.7 12 80.8-101.7 113-112 181.3s48 90.7 48 90.7c16.3-56.6 72.4-75.6 109.7-99.8 40.7-26.4 50.3-51.3 50.3-81.5zM358.7 259.6c5-14.7 1.9-49.3-3-63.4-9 17.5-26.3 32.4-47.2 46-8.6 5.6-20.9 10.8-29.8 15.9-18.7 10.5-34 20.6-46.3 34.4 11.3 16.4 31.3 27.7 46.3 27.7 36-.2 64-13.7 80-60.6z"/><path d="M161.8 171.9c11.7-15.1 24.9-23.8 38.2-36.2 13.4-12.5 22.1-21.2 27.5-31.3-10.7-20.1-30.8-28.1-44.7-26.1 2.3 28.6-30 44-32 64.8-1.3 12.6 5.4 25 11 28.8z"/></svg>
|
Before Width: | Height: | Size: 1.3 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M347.62 64c-40.94 0-79.12 14-91.577 44.495C242.5 78 205.408 64 164.466 64 109.266 64 64 89.98 64 143v283h22.14c12.86-26.334 44.238-42 78.325-42 40.224 0 73.877 27.528 81.617 64h19.714c7.74-36.472 41.495-64 81.722-64 34.085 0 61.15 11.666 78.43 42H448V143c0-53.02-45.177-79-100.38-79zM248 410.926C230 385.056 199.27 368 164.5 368S100 378.055 81 403.926l-1 .537V141c3-41.825 40.09-61 84.293-61 45.162 0 82.145 18.708 83.363 61.808-.017.73.016 1.46.016 2.192l.328 13.103v253.823zM432 148v255.926C414 378.056 382.27 368 347.5 368S282 385.055 264 410.926V144c0-44.112 37.66-64 83.587-64C391.79 80 429 91.175 432 133v15z"/></svg>
|
Before Width: | Height: | Size: 719 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path d="M164.466 64C109.266 64 64 89.98 64 143v283H86.14c12.86-26.334 44.24-42 78.326-42 40.224 0 73.877 27.528 81.616 64H248V95.346C230.76 73.95 198.98 64 164.466 64zM347.62 64c-34.33 0-66.712 9.85-83.62 31.01V448h1.797c7.74-36.472 41.495-64 81.722-64 34.084 0 61.148 11.666 78.428 42H448V143c0-53.02-45.177-79-100.38-79z"/></svg>
|
Before Width: | Height: | Size: 419 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M128 48v416l128-96.4L384 464V48H128zm240 384l-112-84.3L144 432V64h224v368z"/></svg>
|
Before Width: | Height: | Size: 154 B |