Home Assistant Git Exporter
This commit is contained in:
root
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
var e="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function o(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}export{e as c,o as g};
|
||||
@@ -0,0 +1 @@
|
||||
const o=o=>void 0!==o.mozHasAudio?o.mozHasAudio:void 0===o.audioTracks||Boolean(o.audioTracks?.length);export{o as m};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
import{dI as r,d8 as t,cL as n,l as a}from"./card-555679fd.js";const e=async(e,s,i,l)=>{if(!i.sign)return i.endpoint;let c;try{c=await r(s,i.endpoint,l)}catch(r){return t(r),null}return c?c.replace(/^http/i,"ws"):(n(e,a("error.failed_sign")),null)};export{e as g};
|
||||
@@ -0,0 +1 @@
|
||||
const e=1e4;export{e as C};
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
import{bS as e,d as n,bT as t}from"./card-555679fd.js";class r{getEngineType(){return e.Generic}async initializeCamera(e,n,t){return t}generateDefaultEventQuery(e,n,t){return null}generateDefaultRecordingQuery(e,n,t){return null}generateDefaultRecordingSegmentsQuery(e,n,t){return null}async getEvents(e,n,t,r){return null}async getRecordings(e,n,t,r){return null}async getRecordingSegments(e,n,t,r){return null}generateMediaFromEvents(e,n,t,r){return null}generateMediaFromRecordings(e,n,t,r){return null}async getMediaDownloadPath(e,n,t){return null}async favoriteMedia(e,n,t,r){}getQueryResultMaxAge(e){return null}async getMediaSeekTime(e,n,t,r,a){return null}async getMediaMetadata(e,n,t,r){return null}getCameraMetadata(e,r){return{title:r.title??n(e,r.camera_entity)??n(e,r.webrtc_card?.entity)??r.id??"",icon:r?.icon??t(e,r.camera_entity)??"mdi:video"}}getCameraCapabilities(e){return{canFavoriteEvents:!1,canFavoriteRecordings:!1,canSeek:!1,supportsClips:!1,supportsRecordings:!1,supportsSnapshots:!1,supportsTimeline:!1}}getMediaCapabilities(e){return null}getCameraEndpoints(e,n){return null}}export{r as GenericCameraManagerEngine};
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
import"./card-555679fd.js";
|
||||
Binary file not shown.
File diff suppressed because one or more lines are too long
@@ -0,0 +1,33 @@
|
||||
import{di as e,cL as t,y as i,dj as s,dk as o,dl as r,dm as a,bj as n,dn as d,bk as l,bn as h}from"./card-555679fd.js";import{m as u}from"./audio-557099cb.js";import{h as c,s as v,M as y}from"./lazyload-c2d6254a.js";
|
||||
/**
|
||||
* @license
|
||||
* Copyright 2017 Google LLC
|
||||
* SPDX-License-Identifier: BSD-3-Clause
|
||||
*/const p=({finisher:e,descriptor:t})=>(i,s)=>{var o;if(void 0===s){const s=null!==(o=i.originalKey)&&void 0!==o?o:i.key,r=null!=t?{kind:"method",placement:"prototype",key:s,descriptor:t(i.key)}:{...i,key:s};return null!=e&&(r.finisher=function(t){e(t,s)}),r}{const o=i.constructor;void 0!==t&&Object.defineProperty(i,s,t(s)),null==e||e(o,s)}}
|
||||
/**
|
||||
* @license
|
||||
* Copyright 2017 Google LLC
|
||||
* SPDX-License-Identifier: BSD-3-Clause
|
||||
*/;function m(e,t){return p({descriptor:i=>{const s={get(){var t,i;return null!==(i=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(e))&&void 0!==i?i:null},enumerable:!0,configurable:!0};if(t){const t="symbol"==typeof i?Symbol():"__"+i;s.get=function(){var i,s;return void 0===this[t]&&(this[t]=null!==(s=null===(i=this.renderRoot)||void 0===i?void 0:i.querySelector(e))&&void 0!==s?s:null),this[t]}}return s}})}var _="img, video {\n object-fit: var(--frigate-card-media-layout-fit, contain);\n object-position: var(--frigate-card-media-layout-position-x, 50%) var(--frigate-card-media-layout-position-y, 50%);\n}";customElements.whenDefined("ha-hls-player").then((()=>{let p=class extends(customElements.get("ha-hls-player")){async play(){return this._video?.play()}async pause(){this._video?.pause()}async mute(){this._video&&(this._video.muted=!0)}async unmute(){this._video&&(this._video.muted=!1)}isMuted(){return this._video?.muted??!0}async seek(e){this._video&&(c(this._video),this._video.currentTime=e)}async setControls(e){this._video&&v(this._video,e??this.controls)}isPaused(){return this._video?.paused??!0}async getScreenshotURL(){return this._video?e(this._video):null}render(){if(this._error){if(this._errorIsFatal)return t(this,this._error);console.error(this._error)}return i`
|
||||
<video
|
||||
id="video"
|
||||
?autoplay=${this.autoPlay}
|
||||
.muted=${this.muted}
|
||||
?playsinline=${this.playsInline}
|
||||
?controls=${this.controls}
|
||||
@loadedmetadata=${()=>{this.controls&&c(this._video,y)}}
|
||||
@loadeddata=${e=>{s(this,e,{player:this,capabilities:{supportsPause:!0,hasAudio:u(this._video)}})}}
|
||||
@volumechange=${()=>o(this)}
|
||||
@play=${()=>r(this)}
|
||||
@pause=${()=>a(this)}
|
||||
></video>
|
||||
`}static get styles(){return[super.styles,n(_),d`
|
||||
:host {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
`]}};l([m("#video")],p.prototype,"_video",void 0),p=l([h("frigate-card-ha-hls-player")],p)}));export{_ as c,m as i};
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
import{bY as t,dg as o,b_ as e,dh as n}from"./card-555679fd.js";function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}function s(s,u){if(t(2,arguments),!u||"object"!==r(u))return new Date(NaN);var a=u.years?e(u.years):0,y=u.months?e(u.months):0,f=u.weeks?e(u.weeks):0,c=u.days?e(u.days):0,i=u.hours?e(u.hours):0,m=u.minutes?e(u.minutes):0,b=u.seconds?e(u.seconds):0,p=function(o,r){t(2,arguments);var s=e(r);return n(o,-s)}(s,y+12*a),d=function(n,r){t(2,arguments);var s=e(r);return o(n,-s)}(p,c+7*f),l=1e3*(b+60*(m+60*i));return new Date(d.getTime()-l)}export{s};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,127 @@
|
||||
import{cH as e,cI as i,cJ as t,cK as a,cL as r,l as s,cM as o,s as n,cN as d,y as l,bj as h,bk as c,bl as g,cO as u,bm as m,bn as v,cP as p,bQ as f,cQ as _,cR as C,cS as b,cT as $,cU as y,cV as w,o as P}from"./card-555679fd.js";import{L as M,A as S,i as k,w as x,a as L,p as I}from"./lazyload-c2d6254a.js";import{u as z}from"./media-layout-8e0c974f.js";
|
||||
/**
|
||||
* @license
|
||||
* Copyright 2021 Google LLC
|
||||
* SPDX-License-Identifier: BSD-3-Clause
|
||||
*/const E=e(class extends i{constructor(){super(...arguments),this.key=t}render(e,i){return this.key=e,i}update(e,[i,t]){return i!==this.key&&(a(e),this.key=i),t}});const R="frigate-card-live-provider",O=(e,i,t)=>{if(!t?.camera_entity)return r(e,s("error.no_live_camera"),{context:t}),null;const a=i.states[t.camera_entity];return a?"unavailable"===a.state?(o(e,s("error.live_camera_unavailable"),"info",{icon:"mdi:connection",context:t}),null):a:(r(e,s("error.live_camera_not_found"),{context:t}),null)};let V=class extends n{constructor(){super(),this._inBackground=!1,this._lastMediaLoadedInfo=null,this._messageReceivedPostRender=!1,this._renderKey=0,this._intersectionObserver=new IntersectionObserver(this._intersectionHandler.bind(this))}_intersectionHandler(e){this._inBackground=!e.some((e=>e.isIntersecting)),this._inBackground||this._messageReceivedPostRender||!this._lastMediaLoadedInfo||d(this._lastMediaLoadedInfo.source,this._lastMediaLoadedInfo.mediaLoadedInfo),this._messageReceivedPostRender&&!this._inBackground&&this.requestUpdate()}shouldUpdate(e){return!this._inBackground||!this._messageReceivedPostRender}connectedCallback(){this._intersectionObserver.observe(this),super.connectedCallback()}disconnectedCallback(){super.disconnectedCallback(),this._intersectionObserver.disconnect()}render(){if(!(this.hass&&this.liveConfig&&this.cameraManager&&this.view))return;const e=l`${E(this._renderKey,l`
|
||||
<frigate-card-live-carousel
|
||||
.hass=${this.hass}
|
||||
.view=${this.view}
|
||||
.liveConfig=${this.liveConfig}
|
||||
.inBackground=${this._inBackground}
|
||||
.conditionControllerEpoch=${this.conditionControllerEpoch}
|
||||
.liveOverrides=${this.liveOverrides}
|
||||
.cardWideConfig=${this.cardWideConfig}
|
||||
.cameraManager=${this.cameraManager}
|
||||
.microphoneStream=${this.microphoneStream}
|
||||
@frigate-card:message=${e=>{this._renderKey++,this._messageReceivedPostRender=!0,this._inBackground&&e.stopPropagation()}}
|
||||
@frigate-card:media:loaded=${e=>{this._lastMediaLoadedInfo={source:e.composedPath()[0],mediaLoadedInfo:e.detail},this._inBackground&&e.stopPropagation()}}
|
||||
@frigate-card:view:change=${e=>{this._inBackground&&e.stopPropagation()}}
|
||||
>
|
||||
</frigate-card-live-carousel>
|
||||
`)}`;return this._messageReceivedPostRender=!1,e}static get styles(){return h(":host {\n width: 100%;\n height: 100%;\n display: block;\n}")}};c([g({attribute:!1})],V.prototype,"conditionControllerEpoch",void 0),c([g({attribute:!1})],V.prototype,"hass",void 0),c([g({attribute:!1})],V.prototype,"view",void 0),c([g({attribute:!1})],V.prototype,"liveConfig",void 0),c([g({attribute:!1,hasChanged:u})],V.prototype,"liveOverrides",void 0),c([g({attribute:!1})],V.prototype,"cameraManager",void 0),c([g({attribute:!1})],V.prototype,"cardWideConfig",void 0),c([g({attribute:!1})],V.prototype,"microphoneStream",void 0),c([m()],V.prototype,"_inBackground",void 0),V=c([v("frigate-card-live")],V);let j=class extends n{constructor(){super(...arguments),this._cameraToSlide={},this._refMediaCarousel=p()}updated(e){super.updated(e),e.has("inBackground")&&this.updateComplete.then((async()=>{const e=this._refMediaCarousel.value;e&&(await e.updateComplete,this.inBackground?(e.autoPause(),e.autoMute()):(e.autoPlay(),e.autoUnmute()))}))}_getTransitionEffect(){return this.liveConfig?.transition_effect??f.live.transition_effect}_getSelectedCameraIndex(){const e=this.cameraManager?.getStore().getVisibleCameraIDs();return e&&this.view?Math.max(0,Array.from(e).indexOf(this.view.camera)):0}_getOptions(){return{draggable:this.liveConfig?.draggable,loop:!0}}_getPlugins(){const e=this.cameraManager?.getStore().getVisibleCameraIDs();return[...e&&e.size>1?[_({forceWheelAxis:"y"})]:[],M({...this.liveConfig?.lazy_load&&{lazyLoadCallback:(e,i)=>this._lazyloadOrUnloadSlide("load",e,i)},lazyUnloadCondition:this.liveConfig?.lazy_unload,lazyUnloadCallback:(e,i)=>this._lazyloadOrUnloadSlide("unload",e,i)}),S({playerSelector:R,...this.liveConfig?.auto_play&&{autoPlayCondition:this.liveConfig.auto_play},...this.liveConfig?.auto_pause&&{autoPauseCondition:this.liveConfig.auto_pause},...this.liveConfig?.auto_mute&&{autoMuteCondition:this.liveConfig.auto_mute},...this.liveConfig?.auto_unmute&&{autoUnmuteCondition:this.liveConfig.auto_unmute}})]}_getLazyLoadCount(){return!1===this.liveConfig?.lazy_load?null:0}_getSlides(){const e=this.cameraManager?.getStore().getVisibleCameras();if(!e)return[[],{}];const i=[],t={};for(const[a,r]of e){const e=this.view?.context?.live?.overrides?.get(a)??a,s=a===e?r:this.cameraManager?.getStore().getCameraConfig(e),o=s?this._renderLive(e,s,i.length):null;o&&(t[a]=i.length,i.push(o))}return[i,t]}_setViewHandler(e){const i=this.cameraManager?.getStore().getVisibleCameras();i&&e.detail.index!==this._getSelectedCameraIndex()&&this._setViewCameraID(Array.from(i.keys())[e.detail.index])}_setViewCameraID(e){e&&this.view?.evolve({camera:e,query:null,queryResults:null}).mergeInContext({thumbnails:{fetch:!1}}).dispatchChangeEvent(this)}_lazyloadOrUnloadSlide(e,i,t){t instanceof HTMLSlotElement&&(t=t.assignedElements({flatten:!0})[0]);const a=t?.querySelector(R);a&&(a.disabled="load"!==e)}_renderLive(e,i,t){if(!(this.liveConfig&&this.hass&&this.cameraManager&&this.conditionControllerEpoch))return;const a=C(this.conditionControllerEpoch.controller,this.liveConfig,this.liveOverrides,{camera:e}),r=this.cameraManager.getCameraMetadata(this.hass,e);return l`
|
||||
<div class="embla__slide">
|
||||
<frigate-card-live-provider
|
||||
?disabled=${this.liveConfig.lazy_load}
|
||||
.microphoneStream=${this.view?.camera===e?this.microphoneStream:void 0}
|
||||
.cameraConfig=${i}
|
||||
.cameraEndpoints=${k([this.cameraManager,e],(()=>this.cameraManager?.getCameraEndpoints(e)??void 0))}
|
||||
.label=${r?.title??""}
|
||||
.liveConfig=${a}
|
||||
.hass=${this.hass}
|
||||
.cardWideConfig=${this.cardWideConfig}
|
||||
@frigate-card:media:loaded=${e=>{x(t,e)}}
|
||||
@frigate-card:media:unloaded=${e=>{L(t,e)}}
|
||||
>
|
||||
</frigate-card-live-provider>
|
||||
</div>
|
||||
`}_getCameraIDsOfNeighbors(){const e=this.cameraManager?.getStore().getVisibleCameras();if(!e||!this.view||!this.hass)return[null,null];const i=Array.from(e.keys()),t=i.indexOf(this.view.camera);return t<0||e.size<=1?[null,null]:[i[t>0?t-1:e.size-1],i[t+1<e.size?t+1:0]]}render(){if(!(this.liveConfig&&this.view&&this.hass&&this.cameraManager))return;const[e,i]=this._getSlides();if(this._cameraToSlide=i,!e.length)return;const[t,a]=this._getCameraIDsOfNeighbors(),r=e=>this.view?.context?.live?.overrides?.get(e)??e,o=t?this.cameraManager.getCameraMetadata(this.hass,r(t)):null,n=this.cameraManager.getCameraMetadata(this.hass,r(this.view.camera)),d=a?this.cameraManager.getCameraMetadata(this.hass,r(a)):null;return l`
|
||||
<frigate-card-media-carousel
|
||||
${b(this._refMediaCarousel)}
|
||||
.carouselOptions=${k([this.cameraManager,this.liveConfig],this._getOptions.bind(this))}
|
||||
.carouselPlugins=${k([this.cameraManager,this.liveConfig],this._getPlugins.bind(this))}
|
||||
.label="${n?`${s("common.live")}: ${n.title}`:""}"
|
||||
.logo="${n?.engineLogo}"
|
||||
.titlePopupConfig=${this.liveConfig.controls.title}
|
||||
.selected=${this._getSelectedCameraIndex()}
|
||||
transitionEffect=${this._getTransitionEffect()}
|
||||
@frigate-card:media-carousel:select=${this._setViewHandler.bind(this)}
|
||||
@frigate-card:carousel:settle=${()=>{$(this,{thumbnails:{fetch:!0}})}}
|
||||
>
|
||||
<frigate-card-next-previous-control
|
||||
slot="previous"
|
||||
.hass=${this.hass}
|
||||
.direction=${"previous"}
|
||||
.controlConfig=${this.liveConfig.controls.next_previous}
|
||||
.label=${o?.title??""}
|
||||
.icon=${o?.icon}
|
||||
?disabled=${null===t}
|
||||
@click=${e=>{this._setViewCameraID(t),y(e)}}
|
||||
>
|
||||
</frigate-card-next-previous-control>
|
||||
${e}
|
||||
<frigate-card-next-previous-control
|
||||
slot="next"
|
||||
.hass=${this.hass}
|
||||
.direction=${"next"}
|
||||
.controlConfig=${this.liveConfig.controls.next_previous}
|
||||
.label=${d?.title??""}
|
||||
.icon=${d?.icon}
|
||||
?disabled=${null===a}
|
||||
@click=${e=>{this._setViewCameraID(a),y(e)}}
|
||||
>
|
||||
</frigate-card-next-previous-control>
|
||||
</frigate-card-media-carousel>
|
||||
`}static get styles(){return h(".embla__slide {\n height: 100%;\n flex: 0 0 100%;\n}")}};c([g({attribute:!1})],j.prototype,"hass",void 0),c([g({attribute:!1})],j.prototype,"view",void 0),c([g({attribute:!1})],j.prototype,"liveConfig",void 0),c([g({attribute:!1,hasChanged:u})],j.prototype,"liveOverrides",void 0),c([g({attribute:!1})],j.prototype,"inBackground",void 0),c([g({attribute:!1})],j.prototype,"conditionControllerEpoch",void 0),c([g({attribute:!1})],j.prototype,"cardWideConfig",void 0),c([g({attribute:!1})],j.prototype,"cameraManager",void 0),c([g({attribute:!1})],j.prototype,"microphoneStream",void 0),j=c([v("frigate-card-live-carousel")],j);let B=class extends n{constructor(){super(...arguments),this.disabled=!1,this.label="",this._isVideoMediaLoaded=!1,this._refProvider=p(),this._importPromises=[]}async play(){await this.updateComplete,await(this._refProvider.value?.updateComplete),await I(this,this._refProvider.value)}async pause(){await this.updateComplete,await(this._refProvider.value?.updateComplete),await(this._refProvider.value?.pause())}async mute(){await this.updateComplete,await(this._refProvider.value?.updateComplete),await(this._refProvider.value?.mute())}async unmute(){await this.updateComplete,await(this._refProvider.value?.updateComplete),await(this._refProvider.value?.unmute())}isMuted(){return this._refProvider.value?.isMuted()??!0}async seek(e){await this.updateComplete,await(this._refProvider.value?.updateComplete),await(this._refProvider.value?.seek(e))}async setControls(e){await this.updateComplete,await(this._refProvider.value?.updateComplete),await(this._refProvider.value?.setControls(e))}isPaused(){return this._refProvider.value?.isPaused()??!0}async getScreenshotURL(){return await this.updateComplete,await(this._refProvider.value?.updateComplete),await(this._refProvider.value?.getScreenshotURL())??null}_getResolvedProvider(){return"auto"===this.cameraConfig?.live_provider?this.cameraConfig?.webrtc_card?.entity||this.cameraConfig?.webrtc_card?.url?"webrtc-card":this.cameraConfig?.camera_entity?"low"===this.cardWideConfig?.performance?.profile?"image":"ha":this.cameraConfig?.frigate.camera_name?"jsmpeg":f.cameras.live_provider:this.cameraConfig?.live_provider||"image"}_shouldShowImageDuringLoading(){return!!this.cameraConfig?.camera_entity&&!!this.hass&&!!this.liveConfig?.show_image_during_load}disconnectedCallback(){this._isVideoMediaLoaded=!1}_videoMediaShowHandler(){this._isVideoMediaLoaded=!0}willUpdate(e){if(e.has("disabled")&&this.disabled&&(this._isVideoMediaLoaded=!1,w(this)),e.has("liveConfig")&&(z(this,this.liveConfig?.layout),this.liveConfig?.show_image_during_load&&this._importPromises.push(import("./live-image-c8850fc4.js")),this.liveConfig?.zoomable&&this._importPromises.push(import("./zoomer-1857311a.js"))),e.has("cameraConfig")){const e=this._getResolvedProvider();"jsmpeg"===e?this._importPromises.push(import("./live-jsmpeg-9c767737.js")):"ha"===e?this._importPromises.push(import("./live-ha-df63bfc8.js")):"webrtc-card"===e?this._importPromises.push(import("./live-webrtc-card-dfc8f852.js")):"image"===e?this._importPromises.push(import("./live-image-c8850fc4.js")):"go2rtc"===e&&this._importPromises.push(import("./live-go2rtc-0795a62f.js"))}}async getUpdateComplete(){const e=await super.getUpdateComplete();return await Promise.all(this._importPromises),this._importPromises=[],e}_useZoomIfRequired(e){return this.liveConfig?.zoomable?l` <frigate-card-zoomer
|
||||
@frigate-card:zoom:zoomed=${()=>this.setControls(!1)}
|
||||
@frigate-card:zoom:unzoomed=${()=>this.setControls()}
|
||||
>
|
||||
${e}
|
||||
</frigate-card-zoomer>`:e}render(){if(this.disabled||!this.hass||!this.liveConfig||!this.cameraConfig)return;this.title=this.label,this.ariaLabel=this.label;const e=this._getResolvedProvider(),i=!this._isVideoMediaLoaded&&this._shouldShowImageDuringLoading(),t={hidden:i};return this._useZoomIfRequired(l`
|
||||
${i||"image"===e?l` <frigate-card-live-image
|
||||
${b(this._refProvider)}
|
||||
.hass=${this.hass}
|
||||
.cameraConfig=${this.cameraConfig}
|
||||
@frigate-card:media:loaded=${i=>{"image"===e?this._videoMediaShowHandler():i.stopPropagation()}}
|
||||
>
|
||||
</frigate-card-live-image>`:l``}
|
||||
${"ha"===e?l` <frigate-card-live-ha
|
||||
${b(this._refProvider)}
|
||||
class=${P(t)}
|
||||
.hass=${this.hass}
|
||||
.cameraConfig=${this.cameraConfig}
|
||||
?controls=${this.liveConfig.controls.builtin}
|
||||
@frigate-card:media:loaded=${this._videoMediaShowHandler.bind(this)}
|
||||
>
|
||||
</frigate-card-live-ha>`:"go2rtc"===e?l`<frigate-card-live-go2rtc
|
||||
${b(this._refProvider)}
|
||||
class=${P(t)}
|
||||
.hass=${this.hass}
|
||||
.cameraConfig=${this.cameraConfig}
|
||||
.cameraEndpoints=${this.cameraEndpoints}
|
||||
.microphoneStream=${this.microphoneStream}
|
||||
.microphoneConfig=${this.liveConfig.microphone}
|
||||
?controls=${this.liveConfig.controls.builtin}
|
||||
@frigate-card:media:loaded=${this._videoMediaShowHandler.bind(this)}
|
||||
>
|
||||
</frigate-card-live-webrtc-card>`:"webrtc-card"===e?l`<frigate-card-live-webrtc-card
|
||||
${b(this._refProvider)}
|
||||
class=${P(t)}
|
||||
.hass=${this.hass}
|
||||
.cameraConfig=${this.cameraConfig}
|
||||
.cameraEndpoints=${this.cameraEndpoints}
|
||||
.cardWideConfig=${this.cardWideConfig}
|
||||
?controls=${this.liveConfig.controls.builtin}
|
||||
@frigate-card:media:loaded=${this._videoMediaShowHandler.bind(this)}
|
||||
>
|
||||
</frigate-card-live-webrtc-card>`:"jsmpeg"===e?l` <frigate-card-live-jsmpeg
|
||||
${b(this._refProvider)}
|
||||
class=${P(t)}
|
||||
.hass=${this.hass}
|
||||
.cameraConfig=${this.cameraConfig}
|
||||
.cameraEndpoints=${this.cameraEndpoints}
|
||||
.cardWideConfig=${this.cardWideConfig}
|
||||
@frigate-card:media:loaded=${this._videoMediaShowHandler.bind(this)}
|
||||
>
|
||||
</frigate-card-live-jsmpeg>`:l``}
|
||||
`)}static get styles(){return h(":host {\n display: block;\n height: 100%;\n width: 100;\n}\n\n.hidden {\n display: none;\n}")}};c([g({attribute:!1})],B.prototype,"hass",void 0),c([g({attribute:!1})],B.prototype,"cameraConfig",void 0),c([g({attribute:!1})],B.prototype,"cameraEndpoints",void 0),c([g({attribute:!1})],B.prototype,"liveConfig",void 0),c([g({attribute:!0,type:Boolean})],B.prototype,"disabled",void 0),c([g({attribute:!1})],B.prototype,"label",void 0),c([g({attribute:!1})],B.prototype,"cardWideConfig",void 0),c([g({attribute:!1})],B.prototype,"microphoneStream",void 0),c([m()],B.prototype,"_isVideoMediaLoaded",void 0),B=c([v(R)],B);export{V as FrigateCardLive,j as FrigateCardLiveCarousel,B as FrigateCardLiveProvider,O as getStateObjOrDispatchError};
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,61 @@
|
||||
import{di as e,cL as t,y as s,dj as a,dk as r,dl as i,dm as h,bj as o,dn as l,bk as n,bn as d,s as u,cP as c,cS as y,bl as p}from"./card-555679fd.js";import{getStateObjOrDispatchError as m}from"./live-e0c9196c.js";import{c as _,i as v}from"./ha-hls-player-aef987da.js";import{m as f}from"./audio-557099cb.js";import{s as $,h as g,M as b}from"./lazyload-c2d6254a.js";import"./media-layout-8e0c974f.js";customElements.whenDefined("ha-web-rtc-player").then((()=>{let u=class extends(customElements.get("ha-web-rtc-player")){async play(){return this._video?.play()}async pause(){this._video?.pause()}async mute(){this._video&&(this._video.muted=!0)}async unmute(){this._video&&(this._video.muted=!1)}isMuted(){return this._video?.muted??!0}async seek(e){this._video&&(this._video.currentTime=e)}async setControls(e){this._video&&$(this._video,e??this.controls)}isPaused(){return this._video?.paused??!0}async getScreenshotURL(){return this._video?e(this._video):null}render(){return this._error?t(this,`${this._error} (${this.entityid})`):s`
|
||||
<video
|
||||
id="remote-stream"
|
||||
?autoplay=${this.autoPlay}
|
||||
.muted=${this.muted}
|
||||
?playsinline=${this.playsInline}
|
||||
?controls=${this.controls}
|
||||
@loadedmetadata=${()=>{this.controls&&g(this._video,b)}}
|
||||
@loadeddata=${e=>{a(this,e,{player:this,capabilities:{supportsPause:!0,hasAudio:f(this._video)}})}}
|
||||
@volumechange=${()=>r(this)}
|
||||
@play=${()=>i(this)}
|
||||
@pause=${()=>h(this)}
|
||||
></video>
|
||||
`}static get styles(){return[super.styles,o(_),l`
|
||||
:host {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
`]}};n([v("#remote-stream")],u.prototype,"_video",void 0),u=n([d("frigate-card-ha-web-rtc-player")],u)})),customElements.whenDefined("ha-camera-stream").then((()=>{let e=class extends(customElements.get("ha-camera-stream")){async play(){return this._player?.play()}async pause(){this._player?.pause()}async mute(){this._player?.mute()}async unmute(){this._player?.unmute()}isMuted(){return this._player?.isMuted()??!0}async seek(e){this._player?.seek(e)}async setControls(e){this._player&&this._player.setControls(e??this.controls)}isPaused(){return this._player?.isPaused()??!0}async getScreenshotURL(){return this._player?await this._player.getScreenshotURL():null}render(){return this.stateObj?this._shouldRenderMJPEG?s`
|
||||
<img
|
||||
@load=${e=>{a(this,e,{player:this})}}
|
||||
.src=${void 0===this._connected||this._connected?(e=this.stateObj,`/api/camera_proxy_stream/${e.entity_id}?token=${e.attributes.access_token}`):""}
|
||||
/>
|
||||
`:"hls"===this.stateObj.attributes.frontend_stream_type?this._url?s` <frigate-card-ha-hls-player
|
||||
id="player"
|
||||
?autoplay=${!1}
|
||||
playsinline
|
||||
.allowExoPlayer=${this.allowExoPlayer}
|
||||
.muted=${this.muted}
|
||||
.controls=${this.controls}
|
||||
.hass=${this.hass}
|
||||
.url=${this._url}
|
||||
></frigate-card-ha-hls-player>`:s``:"web_rtc"===this.stateObj.attributes.frontend_stream_type?s`<frigate-card-ha-web-rtc-player
|
||||
id="player"
|
||||
?autoplay=${!1}
|
||||
playsinline
|
||||
.muted=${this.muted}
|
||||
.controls=${this.controls}
|
||||
.hass=${this.hass}
|
||||
.entityid=${this.stateObj.entity_id}
|
||||
></frigate-card-ha-web-rtc-player>`:void 0:s``;var e}static get styles(){return[super.styles,o(_),l`
|
||||
:host {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
`]}};n([v("#player")],e.prototype,"_player",void 0),e=n([d("frigate-card-ha-camera-stream")],e)}));let w=class extends u{constructor(){super(...arguments),this.controls=!0,this._playerRef=c()}async play(){return this._playerRef.value?.play()}async pause(){this._playerRef.value?.pause()}async mute(){this._playerRef.value?.mute()}async unmute(){this._playerRef.value?.unmute()}isMuted(){return this._playerRef.value?.isMuted()??!0}async seek(e){this._playerRef.value?.seek(e)}async setControls(e){this._playerRef.value?.setControls(e??this.controls)}isPaused(){return this._playerRef.value?.isPaused()??!0}async getScreenshotURL(){return await(this._playerRef.value?.getScreenshotURL())??null}render(){if(!this.hass)return;const e=m(this,this.hass,this.cameraConfig);return e?s` <frigate-card-ha-camera-stream
|
||||
${y(this._playerRef)}
|
||||
.hass=${this.hass}
|
||||
.stateObj=${e}
|
||||
.controls=${this.controls}
|
||||
.muted=${!0}
|
||||
>
|
||||
</frigate-card-ha-camera-stream>`:void 0}static get styles(){return o(":host {\n width: 100%;\n height: 100%;\n display: block;\n --video-max-height: none;\n}")}};n([p({attribute:!1})],w.prototype,"hass",void 0),n([p({attribute:!1})],w.prototype,"cameraConfig",void 0),n([p({attribute:!0,type:Boolean})],w.prototype,"controls",void 0),w=n([d("frigate-card-live-ha")],w);export{w as FrigateCardLiveHA};
|
||||
@@ -0,0 +1,7 @@
|
||||
import{s as e,cP as a,y as s,cS as t,bj as i,bk as r,bl as m,bn as o}from"./card-555679fd.js";import"./image-0b99ab11.js";import{getStateObjOrDispatchError as n}from"./live-e0c9196c.js";import"./media-layout-8e0c974f.js";import"./lazyload-c2d6254a.js";let u=class extends e{constructor(){super(...arguments),this._refImage=a()}async play(){await(this._refImage.value?.play())}async pause(){await(this._refImage.value?.pause())}async mute(){await(this._refImage.value?.mute())}async unmute(){await(this._refImage.value?.unmute())}isMuted(){return!!this._refImage.value?.isMuted()}async seek(e){await(this._refImage.value?.seek(e))}async setControls(e){await(this._refImage.value?.setControls(e))}isPaused(){return this._refImage.value?.isPaused()??!0}async getScreenshotURL(){return await(this._refImage.value?.getScreenshotURL())??null}render(){if(this.hass&&this.cameraConfig)return n(this,this.hass,this.cameraConfig),s` <frigate-card-image
|
||||
${t(this._refImage)}
|
||||
.imageConfig=${{mode:this.cameraConfig.image.url?"url":"camera",refresh_seconds:this.cameraConfig.image.refresh_seconds,url:this.cameraConfig.image.url,zoomable:!1}}
|
||||
.hass=${this.hass}
|
||||
.cameraConfig=${this.cameraConfig}
|
||||
>
|
||||
</frigate-card-image>`}static get styles(){return i(":host {\n width: 100%;\n height: 100%;\n display: block;\n}")}};r([m({attribute:!1})],u.prototype,"hass",void 0),r([m({attribute:!1})],u.prototype,"cameraConfig",void 0),u=r([o("frigate-card-live-image")],u);export{u as FrigateCardLiveImage};
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
import{s as t,dJ as e,di as a,cZ as r,dj as s,dl as n,dm as o,dk as i,bj as c,bk as d,bl as l,bn as u,db as h,l as p,cL as b,bX as y,y as g}from"./card-555679fd.js";import{m}from"./audio-557099cb.js";import{s as w,h as _,M as f}from"./lazyload-c2d6254a.js";let C=class extends t{constructor(){super(...arguments),this.controls=!1,this._webrtcTask=new e(this,this._getWebRTCCardElement,(()=>[1]))}async play(){return this._getPlayer()?.play()}async pause(){this._getPlayer()?.pause()}async mute(){const t=this._getPlayer();t&&(t.muted=!0)}async unmute(){const t=this._getPlayer();t&&(t.muted=!1)}isMuted(){return this._getPlayer()?.muted??!0}async seek(t){const e=this._getPlayer();e&&(e.currentTime=t)}async setControls(t){const e=this._getPlayer();e&&w(e,t??this.controls)}isPaused(){return this._getPlayer()?.paused??!0}async getScreenshotURL(){const t=this._getPlayer();return t?a(t):null}connectedCallback(){super.connectedCallback(),this.requestUpdate()}_getPlayer(){const t=this.renderRoot?.querySelector("#webrtc");return t?.video??null}async _getWebRTCCardElement(){return await customElements.whenDefined("webrtc-camera"),customElements.get("webrtc-camera")}_createWebRTC(){const t=this._webrtcTask.value;if(t&&this.hass&&this.cameraConfig){const e=new t,a={...this.cameraConfig.webrtc_card};return a.url||a.entity||!this.cameraEndpoints?.webrtcCard||(a.url=this.cameraEndpoints.webrtcCard.endpoint),e.setConfig(a),e.hass=this.hass,e}return null}render(){return r(this,this._webrtcTask,(()=>{let t;try{t=this._createWebRTC()}catch(t){return b(this,t instanceof y?t.message:p("error.webrtc_card_reported_error")+": "+t.message,{context:t.context})}return t&&(t.id="webrtc"),g`${t}`}),{inProgressFunc:()=>h({message:p("error.webrtc_card_waiting"),cardWideConfig:this.cardWideConfig})})}updated(){this.updateComplete.then((()=>{const t=this._getPlayer();t&&(w(t,this.controls),t.onloadeddata=()=>{this.controls&&_(t,f),s(this,t,{player:this,capabilities:{supportsPause:!0,hasAudio:m(t)}})},t.onplay=()=>n(this),t.onpause=()=>o(this),t.onvolumechange=()=>i(this))}))}static get styles(){return c(":host {\n width: 100%;\n height: 100%;\n display: block;\n}\n\n/* Don't drop shadow or have radius for nested webrtc card */\n#webrtc ha-card {\n border-radius: 0px;\n margin: 0px;\n box-shadow: none;\n}\n\nha-card,\ndiv.fix-safari,\n#video {\n background: unset;\n background-color: unset;\n}\n\n#webrtc #video {\n object-fit: var(--frigate-card-media-layout-fit, contain);\n object-position: var(--frigate-card-media-layout-position-x, 50%) var(--frigate-card-media-layout-position-y, 50%);\n}")}};d([l({attribute:!1})],C.prototype,"cameraConfig",void 0),d([l({attribute:!1})],C.prototype,"cameraEndpoints",void 0),d([l({attribute:!1})],C.prototype,"cardWideConfig",void 0),d([l({attribute:!0,type:Boolean})],C.prototype,"controls",void 0),C=d([u("frigate-card-live-webrtc-card")],C);export{C as FrigateCardLiveWebRTCCard};
|
||||
@@ -0,0 +1 @@
|
||||
var e;!function(e){e.MP4="mp4",e.HLS="hls"}(e||(e={}));class t{constructor(e,t){this._mediaType=e,this._cameraID=t}getContentType(){return"snapshot"===this._mediaType?"image":"video"}getCameraID(){return this._cameraID}getMediaType(){return this._mediaType}getVideoContentType(){return null}getID(){return null}getStartTime(){return null}getEndTime(){return null}getUsableEndTime(){return this.getEndTime()??(this.inProgress()?new Date:this.getStartTime())}inProgress(){return null}getContentID(){return null}getTitle(){return null}getThumbnail(){return null}isFavorite(){return null}includesTime(e){const t=this.getStartTime(),r=this.getUsableEndTime();return!!t&&!!r&&e>=t&&e<=r}setFavorite(e){}getWhere(){return null}}export{t as V,e as a};
|
||||
@@ -0,0 +1 @@
|
||||
const t=(t,o)=>{void 0!==o?.fit?t.style.setProperty("--frigate-card-media-layout-fit",o.fit):t.style.removeProperty("--frigate-card-media-layout-fit");for(const e of["x","y"])void 0!==o?.position?.[e]?t.style.setProperty(`--frigate-card-media-layout-position-${e}`,`${o.position[e]}%`):t.style.removeProperty(`--frigate-card-media-layout-position-${e}`)};export{t as u};
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
import{c1 as o}from"./card-555679fd.js";function t(t,n){return n="function"==typeof n?n:void 0,t&&t.length?o(t,void 0,n):[]}export{t as u};
|
||||
@@ -0,0 +1,104 @@
|
||||
import{s as e,d9 as i,da as t,db as a,y as s,bj as r,bk as o,bl as d,bn as l,cP as n,bQ as h,cQ as u,cM as v,l as c,cS as g,cU as f,cO as p,di as m,c5 as w,d7 as y,d8 as C,de as _,ck as b,cl as $,dj as M,dk as P,dl as R,dm as x}from"./card-555679fd.js";import{L as q,A as V,i as S,w as I,p as T,h as F,s as k,M as z}from"./lazyload-c2d6254a.js";import"./ha-hls-player-aef987da.js";import{m as W}from"./audio-557099cb.js";import{u as j}from"./media-layout-8e0c974f.js";import{a as E}from"./media-b0eb3f2a.js";let D=class extends e{render(){if(this.hass&&this.view&&this.viewerConfig&&this.cameraManager&&this.cardWideConfig){if(!this.view.queryResults?.hasResults()){const e=this.view.getDefaultMediaType();if(!e)return;return"recordings"===e?i(this,this.hass,this.cameraManager,this.cardWideConfig,this.view,{targetView:"recording",select:"latest"}):t(this,this.hass,this.cameraManager,this.cardWideConfig,this.view,{targetView:"media",mediaType:e,select:"latest"}),a({cardWideConfig:this.cardWideConfig})}return s`
|
||||
<frigate-card-viewer-carousel
|
||||
.hass=${this.hass}
|
||||
.view=${this.view}
|
||||
.viewerConfig=${this.viewerConfig}
|
||||
.resolvedMediaCache=${this.resolvedMediaCache}
|
||||
.cameraManager=${this.cameraManager}
|
||||
.cardWideConfig=${this.cardWideConfig}
|
||||
>
|
||||
</frigate-card-viewer-carousel>
|
||||
`}}static get styles(){return r(":host {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n gap: 5px;\n}\n\nfrigate-card-viewer-carousel {\n flex: 1;\n min-height: 0;\n}")}};o([d({attribute:!1})],D.prototype,"hass",void 0),o([d({attribute:!1})],D.prototype,"view",void 0),o([d({attribute:!1})],D.prototype,"viewerConfig",void 0),o([d({attribute:!1})],D.prototype,"resolvedMediaCache",void 0),o([d({attribute:!1})],D.prototype,"cameraManager",void 0),o([d({attribute:!1})],D.prototype,"cardWideConfig",void 0),D=o([l("frigate-card-viewer")],D);const H="frigate-card-viewer-provider";let L=class extends e{constructor(){super(...arguments),this._refMediaCarousel=n()}updated(e){if(super.updated(e),e.has("view")){const i=e.get("view");this.view?.context?.mediaViewer!==i?.context?.mediaViewer&&this._seekHandler()}}_getTransitionEffect(){return this.viewerConfig?.transition_effect??h.media_viewer.transition_effect}_getPlayer(e){return e||(e=this._refMediaCarousel.value?.frigateCardCarousel()?.getCarouselSelected()?.element),e?.querySelector(H)??null}_getPlugins(){return[...this.view?.queryResults?.getResultsCount()?[u({forceWheelAxis:"y"})]:[],q({...this.viewerConfig?.lazy_load&&{lazyLoadCallback:(e,i)=>this._lazyloadSlide(i)}}),V({playerSelector:H,...this.viewerConfig?.auto_play&&{autoPlayCondition:this.viewerConfig.auto_play},...this.viewerConfig?.auto_pause&&{autoPauseCondition:this.viewerConfig.auto_pause},...this.viewerConfig?.auto_mute&&{autoMuteCondition:this.viewerConfig.auto_mute},...this.viewerConfig?.auto_unmute&&{autoUnmuteCondition:this.viewerConfig.auto_unmute}})]}_getMediaNeighbors(){const e=this.view?.queryResults?.getSelectedIndex()??null,i=this.view?.queryResults?.getResultsCount()??0;if(!this.view||!this.view.queryResults||null===e)return[null,null];return[e>0?this.view.queryResults.getResult(e-1):null,e+1<i?this.view.queryResults.getResult(e+1):null]}_setViewHandler(e){this._setViewSelectedIndex(e.detail.index)}_setViewSelectedIndex(e){if(!this.view?.queryResults)return;const i=this.view.queryResults.getSelectedIndex();if(null===i||i===e)return;const t=this.view?.queryResults?.clone().selectResult(e);if(!t)return;const a=t.getSelectedResult()?.getCameraID();this.view?.evolve({queryResults:t,...a&&{camera:a}}).dispatchChangeEvent(this)}_lazyloadSlide(e){e instanceof HTMLSlotElement&&(e=e.assignedElements({flatten:!0})[0]);const i=e?.querySelector("frigate-card-viewer-provider");i&&(i.disabled=!1)}_getSlides(){if(!this.view||!this.view.queryResults)return[];const e=[];for(let i=0;i<this.view.queryResults.getResultsCount();++i){const t=this.view.queryResults.getResult(i);if(t){const a=this._renderMediaItem(t,i);a&&(e[i]=a)}}return e}willUpdate(e){e.has("viewerConfig")&&j(this,this.viewerConfig?.layout)}render(){const e=this.view?.queryResults?.getResultsCount()??0;if(!e)return v(this,c("common.no_media"),"info",{icon:"mdi:multimedia"});const i=this.view?.queryResults?.getSelectedResult()??this.view?.queryResults?.getResult(e-1);if(!(this.hass&&this.cameraManager&&i&&this.view&&this.view.queryResults))return;const[t,a]=this._getMediaNeighbors(),r=e=>{const i=this.view?.queryResults?.getSelectedIndex()??null;if(!this.view||!this.view?.queryResults||null===i)return;const t="previous"===e?i-1:i+1;t>=0&&t<this.view.queryResults.getResultsCount()&&this._setViewSelectedIndex(t)},o=this.cameraManager.getCameraMetadata(this.hass,i.getCameraID());return s` <frigate-card-media-carousel
|
||||
${g(this._refMediaCarousel)}
|
||||
.carouselOptions=${S([this.viewerConfig],(()=>({draggable:this.viewerConfig?.draggable??!0})))}
|
||||
.carouselPlugins=${S([this.viewerConfig,this.view.queryResults.getResults()],this._getPlugins.bind(this))}
|
||||
.label=${i.getTitle()??void 0}
|
||||
.logo=${o?.engineLogo}
|
||||
.titlePopupConfig=${this.viewerConfig?.controls.title}
|
||||
.selected=${this.view?.queryResults?.getSelectedIndex()??0}
|
||||
transitionEffect=${this._getTransitionEffect()}
|
||||
@frigate-card:media-carousel:select=${this._setViewHandler.bind(this)}
|
||||
@frigate-card:media:loaded=${this._seekHandler.bind(this)}
|
||||
>
|
||||
<frigate-card-next-previous-control
|
||||
slot="previous"
|
||||
.hass=${this.hass}
|
||||
.direction=${"previous"}
|
||||
.controlConfig=${this.viewerConfig?.controls.next_previous}
|
||||
.thumbnail=${t?.getThumbnail()??void 0}
|
||||
.label=${t?.getTitle()??""}
|
||||
?disabled=${!t}
|
||||
@click=${e=>{r("previous"),f(e)}}
|
||||
></frigate-card-next-previous-control>
|
||||
${S(this.view?.queryResults?.getResults(),(()=>this._getSlides()))}
|
||||
<frigate-card-next-previous-control
|
||||
slot="next"
|
||||
.hass=${this.hass}
|
||||
.direction=${"next"}
|
||||
.controlConfig=${this.viewerConfig?.controls.next_previous}
|
||||
.thumbnail=${a?.getThumbnail()??void 0}
|
||||
.label=${a?.getTitle()??""}
|
||||
?disabled=${!a}
|
||||
@click=${e=>{r("next"),f(e)}}
|
||||
></frigate-card-next-previous-control>
|
||||
</frigate-card-media-carousel>`}async _seekHandler(){const e=this.view?.context?.mediaViewer?.seek,i=this.view?.queryResults?.getSelectedResult();if(!this.hass||!i||!e)return;const t=await(this.cameraManager?.getMediaSeekTime(this.hass,i,e))??null,a=this._getPlayer();a&&null!==t&&a.seek(t)}_renderMediaItem(e,i){return this.hass&&this.view&&this.viewerConfig?s` <div class="embla__slide">
|
||||
<frigate-card-viewer-provider
|
||||
.hass=${this.hass}
|
||||
.view=${this.view}
|
||||
.media=${e}
|
||||
.viewerConfig=${this.viewerConfig}
|
||||
.resolvedMediaCache=${this.resolvedMediaCache}
|
||||
.cameraManager=${this.cameraManager}
|
||||
.disabled=${this.viewerConfig.lazy_load}
|
||||
.cardWideConfig=${this.cardWideConfig}
|
||||
@frigate-card:media:loaded=${e=>{I(i,e)}}
|
||||
></frigate-card-viewer-provider>
|
||||
</div>`:null}static get styles(){return r(".embla__slide {\n height: 100%;\n flex: 0 0 100%;\n}")}};o([d({attribute:!1})],L.prototype,"hass",void 0),o([d({attribute:!1})],L.prototype,"view",void 0),o([d({attribute:!1,hasChanged:p})],L.prototype,"viewerConfig",void 0),o([d({attribute:!1})],L.prototype,"resolvedMediaCache",void 0),o([d({attribute:!1})],L.prototype,"cardWideConfig",void 0),o([d({attribute:!1})],L.prototype,"cameraManager",void 0),L=o([l("frigate-card-viewer-carousel")],L);let U=class extends e{constructor(){super(...arguments),this.disabled=!1,this._refFrigateCardMediaPlayer=n(),this._refVideoProvider=n(),this._refImageProvider=n()}async play(){await T(this,this._refFrigateCardMediaPlayer.value??this._refVideoProvider.value)}async pause(){(this._refFrigateCardMediaPlayer.value||this._refVideoProvider.value)?.pause()}async mute(){this._refFrigateCardMediaPlayer.value?this._refFrigateCardMediaPlayer.value?.mute():this._refVideoProvider.value&&(this._refVideoProvider.value.muted=!0)}async unmute(){this._refFrigateCardMediaPlayer.value?this._refFrigateCardMediaPlayer.value?.mute():this._refVideoProvider.value&&(this._refVideoProvider.value.muted=!1)}isMuted(){return this._refFrigateCardMediaPlayer.value?this._refFrigateCardMediaPlayer.value?.isMuted()??!0:!this._refVideoProvider.value||this._refVideoProvider.value.muted}async seek(e){if(this._refFrigateCardMediaPlayer.value)return this._refFrigateCardMediaPlayer.value.seek(e);this._refVideoProvider.value&&(F(this._refVideoProvider.value),this._refVideoProvider.value.currentTime=e)}async setControls(e){if(this._refFrigateCardMediaPlayer.value)return this._refFrigateCardMediaPlayer.value.setControls(e);this._refVideoProvider.value&&k(this._refVideoProvider.value,e??this.viewerConfig?.controls.builtin??!0)}isPaused(){return this._refFrigateCardMediaPlayer.value?this._refFrigateCardMediaPlayer.value.isPaused():!this._refVideoProvider.value||this._refVideoProvider.value.paused}async getScreenshotURL(){return this._refFrigateCardMediaPlayer.value?await this._refFrigateCardMediaPlayer.value.getScreenshotURL():this._refVideoProvider.value?m(this._refVideoProvider.value):this._refImageProvider.value?this._refImageProvider.value.src:null}async _dispatchRelatedClipView(){if(!(this.hass&&this.view&&this.cameraManager&&this.media&&w.isEvent(this.media)&&y.areEventQueries(this.view.query)))return;const e=this.view.query.clone();e.convertToClipsQueries();const i=e.getQueries();if(!i)return;let t;try{t=await this.cameraManager.executeMediaQueries(this.hass,i)}catch(e){return void C(e)}if(!t)return;const a=new _(t);a.selectResultIfFound((e=>e.getID()===this.media?.getID())),a.hasSelectedResult()&&this.view.evolve({view:"media",query:e,queryResults:a}).dispatchChangeEvent(this)}willUpdate(e){const i=this.media?this.media.getContentID():null;!((e.has("disabled")||e.has("media")||e.has("viewerConfig")||e.has("resolvedMediaCache")||e.has("hass"))&&this.hass&&i)||this.resolvedMediaCache?.has(i)||this.viewerConfig?.lazy_load&&this.disabled||b(this.hass,i,this.resolvedMediaCache).then((()=>{this.requestUpdate()})),e.has("viewerConfig")&&this.viewerConfig?.zoomable&&import("./zoomer-1857311a.js")}_useZoomIfRequired(e){return this.viewerConfig?.zoomable?s` <frigate-card-zoomer
|
||||
@frigate-card:zoom:zoomed=${()=>this.setControls(!1)}
|
||||
@frigate-card:zoom:unzoomed=${()=>this.setControls()}
|
||||
>
|
||||
${e}
|
||||
</frigate-card-zoomer>`:e}render(){if(this.disabled||!this.media||!this.hass||!this.view||!this.viewerConfig)return;const e=this.media.getContentID(),i=e?this.resolvedMediaCache?.get(e):null;return i?this._useZoomIfRequired(s`
|
||||
${w.isVideo(this.media)?this.media.getVideoContentType()===E.HLS?s`<frigate-card-ha-hls-player
|
||||
${g(this._refFrigateCardMediaPlayer)}
|
||||
allow-exoplayer
|
||||
aria-label="${this.media.getTitle()??""}"
|
||||
?autoplay=${!1}
|
||||
controls
|
||||
muted
|
||||
playsinline
|
||||
title="${this.media.getTitle()??""}"
|
||||
url=${$(this.hass,i?.url)??""}
|
||||
.hass=${this.hass}
|
||||
?controls=${this.viewerConfig.controls.builtin}
|
||||
>
|
||||
</frigate-card-ha-hls-player>`:s`
|
||||
<video
|
||||
${g(this._refVideoProvider)}
|
||||
aria-label="${this.media.getTitle()??""}"
|
||||
title="${this.media.getTitle()??""}"
|
||||
muted
|
||||
playsinline
|
||||
crossorigin="anonymous"
|
||||
?autoplay=${!1}
|
||||
?controls=${this.viewerConfig.controls.builtin}
|
||||
@loadedmetadata=${e=>{e.target&&this.viewerConfig?.controls.builtin&&F(e.target,z)}}
|
||||
@loadeddata=${e=>{M(this,e,{player:this,capabilities:{supportsPause:!0,hasAudio:W(e.target)}})}}
|
||||
@volumechange=${()=>P(this)}
|
||||
@play=${()=>R(this)}
|
||||
@pause=${()=>x(this)}
|
||||
>
|
||||
<source
|
||||
src=${$(this.hass,i?.url)??""}
|
||||
type="video/mp4"
|
||||
/>
|
||||
</video>
|
||||
`:s`<img
|
||||
${g(this._refImageProvider)}
|
||||
aria-label="${this.media.getTitle()??""}"
|
||||
src="${$(this.hass,i?.url)??""}"
|
||||
title="${this.media.getTitle()??""}"
|
||||
@click=${()=>{this.viewerConfig?.snapshot_click_plays_clip&&this._dispatchRelatedClipView()}}
|
||||
@load=${e=>{M(this,e,{player:this})}}
|
||||
/>`}
|
||||
`):a({cardWideConfig:this.cardWideConfig})}static get styles(){return r(":host {\n display: block;\n width: 100%;\n height: 100%;\n}\n\nimg,\nvideo,\nfrigate-card-ha-hls-player {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: var(--frigate-card-media-layout-fit, contain);\n object-position: var(--frigate-card-media-layout-position-x, 50%) var(--frigate-card-media-layout-position-y, 50%);\n}\n\nfrigate-card-progress-indicator {\n padding: 30px;\n box-sizing: border-box;\n}")}};o([d({attribute:!1})],U.prototype,"hass",void 0),o([d({attribute:!1})],U.prototype,"view",void 0),o([d({attribute:!1})],U.prototype,"media",void 0),o([d({attribute:!1})],U.prototype,"viewerConfig",void 0),o([d({attribute:!1})],U.prototype,"resolvedMediaCache",void 0),o([d({attribute:!1})],U.prototype,"disabled",void 0),o([d({attribute:!1})],U.prototype,"cameraManager",void 0),o([d({attribute:!1})],U.prototype,"cardWideConfig",void 0),U=o([l(H)],U);export{D as FrigateCardViewer,L as FrigateCardViewerCarousel,U as FrigateCardViewerProvider};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,24 @@
|
||||
import nodeResolve from "@rollup/plugin-node-resolve";
|
||||
import json from "@rollup/plugin-json";
|
||||
import typescript from "rollup-plugin-typescript2";
|
||||
import terser from "@rollup/plugin-terser";
|
||||
import babel from "@rollup/plugin-babel";
|
||||
|
||||
const dev = process.env.ROLLUP_WATCH;
|
||||
|
||||
export default {
|
||||
input: "src/main.ts",
|
||||
output: {
|
||||
file: "auto-entities.js",
|
||||
format: "es",
|
||||
},
|
||||
plugins: [
|
||||
nodeResolve(),
|
||||
json(),
|
||||
typescript(),
|
||||
babel({
|
||||
exclude: "node_modules/**",
|
||||
}),
|
||||
!dev && terser({ format: { comments: false } }),
|
||||
],
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,26 @@
|
||||
import nodeResolve from "@rollup/plugin-node-resolve";
|
||||
import json from "@rollup/plugin-json";
|
||||
import commonjs from "@rollup/plugin-commonjs";
|
||||
import typescript from "rollup-plugin-typescript2";
|
||||
import { terser } from "rollup-plugin-terser";
|
||||
import babel from "@rollup/plugin-babel";
|
||||
|
||||
const dev = process.env.ROLLUP_WATCH;
|
||||
|
||||
export default {
|
||||
input: "src/main.ts",
|
||||
output: {
|
||||
file: "layout-card.js",
|
||||
format: "es",
|
||||
},
|
||||
plugins: [
|
||||
nodeResolve(),
|
||||
commonjs(),
|
||||
json(),
|
||||
typescript(),
|
||||
babel({
|
||||
exclude: "node_modules/**",
|
||||
}),
|
||||
!dev && terser({ format: { comments: false } }),
|
||||
],
|
||||
};
|
||||
@@ -0,0 +1,65 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" />
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05" />
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode />
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="cloudy-day-3">
|
||||
<g transform="translate(20,10)">
|
||||
<g transform="translate(0,16)">
|
||||
<g class="am-weather-sun">
|
||||
<g>
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(45)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(90)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(135)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(180)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(225)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(270)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(315)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2"
|
||||
transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
</g>
|
||||
<circle cx="0" cy="0" fill="orange" r="5" stroke="orange" stroke-width="2" />
|
||||
</g>
|
||||
<g class="am-weather-cloud-2">
|
||||
<path
|
||||
d="M47.7,35.4c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z"
|
||||
fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2"
|
||||
transform="translate(-20,-11)" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.5 KiB |
@@ -0,0 +1,354 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg66"
|
||||
sodipodi:docname="cloudy-day-3.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata70">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1554"
|
||||
inkscape:window-height="778"
|
||||
id="namedview68"
|
||||
showgrid="false"
|
||||
inkscape:zoom="4.9790903"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="406"
|
||||
inkscape:window-y="1169"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="cloudy-day-3"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="cloudy-day-3">
|
||||
<g
|
||||
transform="matrix(1.1138015,0,0,1.1138015,22.47942,10.859436)"
|
||||
id="g63">
|
||||
<g
|
||||
transform="translate(0,16)"
|
||||
id="g57">
|
||||
<g
|
||||
class="am-weather-sun"
|
||||
id="g53">
|
||||
<g
|
||||
id="g23">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line21" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(45)"
|
||||
id="g27">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line25" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(90)"
|
||||
id="g31">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line29" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(135)"
|
||||
id="g35">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line33" />
|
||||
</g>
|
||||
<g
|
||||
transform="scale(-1)"
|
||||
id="g39">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line37" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-135)"
|
||||
id="g43">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line41" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-90)"
|
||||
id="g47">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line45" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-45)"
|
||||
id="g51">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line49" />
|
||||
</g>
|
||||
</g>
|
||||
<circle
|
||||
cx="0"
|
||||
cy="0"
|
||||
fill="#ffa500"
|
||||
r="5"
|
||||
stroke="#ffa500"
|
||||
stroke-width="2"
|
||||
id="circle55" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-cloud-2"
|
||||
id="g61">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path59" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 9.4 KiB |
+41
@@ -0,0 +1,41 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="cloudy-night-3">
|
||||
<g transform="translate(20,10)">
|
||||
<g transform="translate(16,4), scale(0.8)">
|
||||
<g class="am-weather-moon-star-1">
|
||||
<polygon fill="orange" points="3.3,1.5 4,2.7 5.2,3.3 4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7" stroke="none" stroke-miterlimit="10"/>
|
||||
</g>
|
||||
<g class="am-weather-moon-star-2">
|
||||
<polygon fill="orange" points="3.3,1.5 4,2.7 5.2,3.3 4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7" stroke="none" stroke-miterlimit="10" transform="translate(20,10)"/>
|
||||
</g>
|
||||
<g class="am-weather-moon">
|
||||
<path d="M14.5,13.2c0-3.7,2-6.9,5-8.7 c-1.5-0.9-3.2-1.3-5-1.3c-5.5,0-10,4.5-10,10s4.5,10,10,10c1.8,0,3.5-0.5,5-1.3C16.5,20.2,14.5,16.9,14.5,13.2z" fill="orange" stroke="orange" stroke-linejoin="round" stroke-width="2"/>
|
||||
</g>
|
||||
</g>
|
||||
<g class="am-weather-cloud-2">
|
||||
<path d="M47.7,35.4 c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
@@ -0,0 +1,296 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg42"
|
||||
sodipodi:docname="cloudy-night-3.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata46">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1646"
|
||||
inkscape:window-height="831"
|
||||
id="namedview44"
|
||||
showgrid="false"
|
||||
inkscape:zoom="5.9340752"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="38.74073"
|
||||
inkscape:window-x="1690"
|
||||
inkscape:window-y="326"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="cloudy-night-3"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="cloudy-night-3">
|
||||
<g
|
||||
transform="matrix(1.131333,0,0,1.131333,13.428035,8.7170683)"
|
||||
id="g39">
|
||||
<g
|
||||
transform="matrix(0.8,0,0,0.8,16,4)"
|
||||
id="g33">
|
||||
<g
|
||||
class="am-weather-moon-star-1"
|
||||
id="g23">
|
||||
<polygon
|
||||
fill="#ffa500"
|
||||
points="4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 3.3,1.5 4,2.7 5.2,3.3 "
|
||||
stroke="none"
|
||||
stroke-miterlimit="10"
|
||||
id="polygon21" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-moon-star-2"
|
||||
id="g27">
|
||||
<polygon
|
||||
fill="#ffa500"
|
||||
points="4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 3.3,1.5 4,2.7 5.2,3.3 "
|
||||
stroke="none"
|
||||
stroke-miterlimit="10"
|
||||
transform="translate(20,10)"
|
||||
id="polygon25" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-moon"
|
||||
id="g31">
|
||||
<path
|
||||
d="m 14.5,13.2 c 0,-3.7 2,-6.9 5,-8.7 -1.5,-0.9 -3.2,-1.3 -5,-1.3 -5.5,0 -10,4.5 -10,10 0,5.5 4.5,10 10,10 1.8,0 3.5,-0.5 5,-1.3 -3,-1.7 -5,-5 -5,-8.7 z"
|
||||
fill="#ffa500"
|
||||
stroke="#ffa500"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
id="path29" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-cloud-2"
|
||||
id="g37">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path35" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.4 KiB |
@@ -0,0 +1,33 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="cloudy">
|
||||
<g transform="translate(20,10)">
|
||||
<g class="am-weather-cloud-1">
|
||||
<path d="M47.7,35.4 c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#91C0F8" stroke="white" stroke-linejoin="round" stroke-width="1.2" transform="translate(-10,-8), scale(0.6)"/>
|
||||
</g>
|
||||
<g class="am-weather-cloud-2">
|
||||
<path d="M47.7,35.4 c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@@ -0,0 +1,582 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg32"
|
||||
sodipodi:docname="cloudy.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata36">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1324"
|
||||
inkscape:window-height="642"
|
||||
id="namedview34"
|
||||
showgrid="false"
|
||||
inkscape:zoom="2.911648"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="cloudy"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(10px,0px);
|
||||
-moz-transform: translate(10px,0px);
|
||||
-ms-transform: translate(10px,0px);
|
||||
transform: translate(10px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(-1.2px) translateY(2px);
|
||||
-moz-transform: translateX(-1.2px) translateY(2px);
|
||||
-ms-transform: translateX(-1.2px) translateY(2px);
|
||||
transform: translateX(-1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(1.4px) translateY(4px);
|
||||
-moz-transform: translateX(1.4px) translateY(4px);
|
||||
-ms-transform: translateX(1.4px) translateY(4px);
|
||||
transform: translateX(1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(-1.6px) translateY(6px);
|
||||
-moz-transform: translateX(-1.6px) translateY(6px);
|
||||
-ms-transform: translateX(-1.6px) translateY(6px);
|
||||
transform: translateX(-1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes am-weather-snow-reverse {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(1.2px) translateY(2px);
|
||||
-moz-transform: translateX(1.2px) translateY(2px);
|
||||
-ms-transform: translateX(1.2px) translateY(2px);
|
||||
transform: translateX(1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(-1.4px) translateY(4px);
|
||||
-moz-transform: translateX(-1.4px) translateY(4px);
|
||||
-ms-transform: translateX(-1.4px) translateY(4px);
|
||||
transform: translateX(-1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(1.6px) translateY(6px);
|
||||
-moz-transform: translateX(1.6px) translateY(6px);
|
||||
-ms-transform: translateX(1.6px) translateY(6px);
|
||||
transform: translateX(1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-2 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
-ms-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-3 {
|
||||
-webkit-animation-name: am-weather-snow-reverse;
|
||||
-moz-animation-name: am-weather-snow-reverse;
|
||||
-ms-animation-name: am-weather-snow-reverse;
|
||||
animation-name: am-weather-snow-reverse;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** EASING
|
||||
*/
|
||||
.am-weather-easing-ease-in-out {
|
||||
-webkit-animation-timing-function: ease-in-out;
|
||||
-moz-animation-timing-function: ease-in-out;
|
||||
-ms-animation-timing-function: ease-in-out;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="cloudy">
|
||||
<g
|
||||
transform="matrix(1.3569207,0,0,1.3569207,15.823384,5.083028)"
|
||||
id="g29">
|
||||
<g
|
||||
class="am-weather-cloud-1"
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="matrix(0.6,0,0,0.6,-10,-8)"
|
||||
id="path21" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-cloud-2"
|
||||
id="g27">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path25" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 17 KiB |
@@ -0,0 +1,54 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="day">
|
||||
<g transform="translate(32,32)">
|
||||
<g class="am-weather-sun am-weather-sun-shiny am-weather-easing-ease-in-out">
|
||||
<g>
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(45)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(90)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(135)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(180)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(225)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(270)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
<g transform="rotate(315)">
|
||||
<line fill="none" stroke="orange" stroke-linecap="round" stroke-width="2" transform="translate(0,9)" x1="0" x2="0" y1="0" y2="3" />
|
||||
</g>
|
||||
</g>
|
||||
<circle cx="0" cy="0" fill="orange" r="5" stroke="orange" stroke-width="2"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
@@ -0,0 +1,689 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg60"
|
||||
sodipodi:docname="day.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata64">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1629"
|
||||
inkscape:window-height="830"
|
||||
id="namedview62"
|
||||
showgrid="false"
|
||||
inkscape:zoom="5.9152817"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="day"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(10px,0px);
|
||||
-moz-transform: translate(10px,0px);
|
||||
-ms-transform: translate(10px,0px);
|
||||
transform: translate(10px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(-1.2px) translateY(2px);
|
||||
-moz-transform: translateX(-1.2px) translateY(2px);
|
||||
-ms-transform: translateX(-1.2px) translateY(2px);
|
||||
transform: translateX(-1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(1.4px) translateY(4px);
|
||||
-moz-transform: translateX(1.4px) translateY(4px);
|
||||
-ms-transform: translateX(1.4px) translateY(4px);
|
||||
transform: translateX(1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(-1.6px) translateY(6px);
|
||||
-moz-transform: translateX(-1.6px) translateY(6px);
|
||||
-ms-transform: translateX(-1.6px) translateY(6px);
|
||||
transform: translateX(-1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes am-weather-snow-reverse {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(1.2px) translateY(2px);
|
||||
-moz-transform: translateX(1.2px) translateY(2px);
|
||||
-ms-transform: translateX(1.2px) translateY(2px);
|
||||
transform: translateX(1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(-1.4px) translateY(4px);
|
||||
-moz-transform: translateX(-1.4px) translateY(4px);
|
||||
-ms-transform: translateX(-1.4px) translateY(4px);
|
||||
transform: translateX(-1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(1.6px) translateY(6px);
|
||||
-moz-transform: translateX(1.6px) translateY(6px);
|
||||
-ms-transform: translateX(1.6px) translateY(6px);
|
||||
transform: translateX(1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-2 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
-ms-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-3 {
|
||||
-webkit-animation-name: am-weather-snow-reverse;
|
||||
-moz-animation-name: am-weather-snow-reverse;
|
||||
-ms-animation-name: am-weather-snow-reverse;
|
||||
animation-name: am-weather-snow-reverse;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** EASING
|
||||
*/
|
||||
.am-weather-easing-ease-in-out {
|
||||
-webkit-animation-timing-function: ease-in-out;
|
||||
-moz-animation-timing-function: ease-in-out;
|
||||
-ms-animation-timing-function: ease-in-out;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="day">
|
||||
<g
|
||||
transform="matrix(1.6076923,0,0,1.6076923,31.9,31.9)"
|
||||
id="g57">
|
||||
<g
|
||||
class="am-weather-sun am-weather-sun-shiny am-weather-easing-ease-in-out"
|
||||
id="g53">
|
||||
<g
|
||||
id="g23">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line21" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(45)"
|
||||
id="g27">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line25" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(90)"
|
||||
id="g31">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line29" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(135)"
|
||||
id="g35">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line33" />
|
||||
</g>
|
||||
<g
|
||||
transform="scale(-1)"
|
||||
id="g39">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line37" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-135)"
|
||||
id="g43">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line41" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-90)"
|
||||
id="g47">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line45" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-45)"
|
||||
id="g51">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line49" />
|
||||
</g>
|
||||
</g>
|
||||
<circle
|
||||
cx="0"
|
||||
cy="0"
|
||||
fill="#ffa500"
|
||||
r="5"
|
||||
stroke="#ffa500"
|
||||
stroke-width="2"
|
||||
id="circle55" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 19 KiB |
@@ -0,0 +1,94 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" width="64" height="64" viewbox="0 0 64 64"
|
||||
id="svg36" sodipodi:docname="rainy-71.svg" inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10"
|
||||
gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2"
|
||||
inkscape:window-width="1558" inkscape:window-height="1295" id="namedview38" showgrid="false"
|
||||
inkscape:zoom="11.998142" inkscape:cx="32" inkscape:cy="32" inkscape:window-x="77" inkscape:window-y="751"
|
||||
inkscape:window-maximized="0" inkscape:current-layer="rainy-7" inkscape:document-rotation="0" />
|
||||
<defs id="defs19">
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur2" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset4" />
|
||||
<feComponentTransfer id="feComponentTransfer8">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge14">
|
||||
<feMergeNode id="feMergeNode10" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="rainy-7">
|
||||
<g style="shape-rendering:geometricPrecision;text-rendering:geometricPrecision" id="g896"
|
||||
transform="translate(-0.5364177,-3.1502922)">
|
||||
<g id="erwehhtipo1o2_to" transform="translate(24.458777,19.932756)">
|
||||
<line id="erwehhtipo1o2" x1="19.523592" y1="23.932756" x2="29.393963" y2="23.932756"
|
||||
transform="translate(-24.458777,-23.932756)" fill="none" stroke="#90bff7" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o3_to" transform="translate(19.143962,23.72905)">
|
||||
<line id="erwehhtipo1o3" x1="14.208777" y1="27.72905" x2="24.079147" y2="27.72905"
|
||||
transform="translate(-19.143962,-27.72905)" fill="none" stroke="#90bff7" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o4_to" transform="translate(30.532851,27.525349)">
|
||||
<line id="erwehhtipo1o4" x1="11.930999" y1="31.525349" x2="49.134705" y2="31.525349"
|
||||
transform="translate(-30.532851,-31.525349)" fill="none" stroke="#90bff7" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o5_to" transform="translate(43.819889,31.321644)">
|
||||
<line id="erwehhtipo1o5" x1="36.986557" y1="35.321644" x2="50.653221" y2="35.321644"
|
||||
transform="translate(-43.819889,-35.321644)" fill="none" stroke="#569fed" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o6_to" transform="translate(21.421741,31.321644)">
|
||||
<line id="erwehhtipo1o6" x1="11.930999" y1="35.321644" x2="30.912481" y2="35.321644"
|
||||
transform="translate(-21.421741,-35.321644)" fill="none" stroke="#90bff7" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o7_to" transform="translate(40.403223,35.117912)">
|
||||
<line id="erwehhtipo1o7" x1="30.153221" y1="39.117912" x2="49.893963" y2="39.117912"
|
||||
transform="translate(-40.023592,-39.117912)" fill="none" stroke="#569fed" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o8_to" transform="translate(32,38.914207)">
|
||||
<line id="erwehhtipo1o8" x1="18.764334" y1="42.914207" x2="46.856926" y2="42.914207"
|
||||
transform="translate(-32.81063,-42.914207)" fill="none" stroke="#569fed" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o9_to" transform="translate(32.810629,42.710506)">
|
||||
<line id="erwehhtipo1o9" x1="26.356926" y1="46.710506" x2="39.264332" y2="46.710506"
|
||||
transform="translate(-32.810629,-46.710506)" fill="none" stroke="#569fed" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o10_to" transform="translate(19.143962,35.117912)">
|
||||
<line id="erwehhtipo1o10" x1="13.449517" y1="39.117912" x2="24.838408" y2="39.117912"
|
||||
transform="translate(-19.143962,-39.117912)" fill="none" stroke="#569fed" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o11_to" transform="translate(31.292111,23.72905)">
|
||||
<line id="erwehhtipo1o11" x1="28.634703" y1="27.72905" x2="33.94952" y2="27.72905"
|
||||
transform="translate(-31.292111,-27.72905)" fill="none" stroke="#90bff7" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g id="erwehhtipo1o12_to" transform="translate(44.199518,23.72905)">
|
||||
<line id="erwehhtipo1o12" x1="41.54211" y1="27.72905" x2="46.856926" y2="27.72905"
|
||||
transform="translate(-44.199518,-27.72905)" fill="none" stroke="#569fed" stroke-width="3"
|
||||
stroke-linecap="round" stroke-miterlimit="10" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.0 KiB |
@@ -0,0 +1,327 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg36"
|
||||
sodipodi:docname="rainy-71.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1558"
|
||||
inkscape:window-height="1295"
|
||||
id="namedview38"
|
||||
showgrid="false"
|
||||
inkscape:zoom="11.998142"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="77"
|
||||
inkscape:window-y="751"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="rainy-7"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="rainy-7">
|
||||
<g
|
||||
style="shape-rendering:geometricPrecision;text-rendering:geometricPrecision"
|
||||
id="g896"
|
||||
transform="translate(-0.5364177,-3.1502922)">
|
||||
<g
|
||||
id="erwehhtipo1o2_to"
|
||||
transform="translate(24.458777,19.932756)">
|
||||
<line
|
||||
id="erwehhtipo1o2"
|
||||
x1="19.523592"
|
||||
y1="23.932756"
|
||||
x2="29.393963"
|
||||
y2="23.932756"
|
||||
transform="translate(-24.458777,-23.932756)"
|
||||
fill="none"
|
||||
stroke="#90bff7"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o3_to"
|
||||
transform="translate(19.143962,23.72905)">
|
||||
<line
|
||||
id="erwehhtipo1o3"
|
||||
x1="14.208777"
|
||||
y1="27.72905"
|
||||
x2="24.079147"
|
||||
y2="27.72905"
|
||||
transform="translate(-19.143962,-27.72905)"
|
||||
fill="none"
|
||||
stroke="#90bff7"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o4_to"
|
||||
transform="translate(30.532851,27.525349)">
|
||||
<line
|
||||
id="erwehhtipo1o4"
|
||||
x1="11.930999"
|
||||
y1="31.525349"
|
||||
x2="49.134705"
|
||||
y2="31.525349"
|
||||
transform="translate(-30.532851,-31.525349)"
|
||||
fill="none"
|
||||
stroke="#90bff7"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o5_to"
|
||||
transform="translate(43.819889,31.321644)">
|
||||
<line
|
||||
id="erwehhtipo1o5"
|
||||
x1="36.986557"
|
||||
y1="35.321644"
|
||||
x2="50.653221"
|
||||
y2="35.321644"
|
||||
transform="translate(-43.819889,-35.321644)"
|
||||
fill="none"
|
||||
stroke="#569fed"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o6_to"
|
||||
transform="translate(21.421741,31.321644)">
|
||||
<line
|
||||
id="erwehhtipo1o6"
|
||||
x1="11.930999"
|
||||
y1="35.321644"
|
||||
x2="30.912481"
|
||||
y2="35.321644"
|
||||
transform="translate(-21.421741,-35.321644)"
|
||||
fill="none"
|
||||
stroke="#90bff7"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o7_to"
|
||||
transform="translate(40.403223,35.117912)">
|
||||
<line
|
||||
id="erwehhtipo1o7"
|
||||
x1="30.153221"
|
||||
y1="39.117912"
|
||||
x2="49.893963"
|
||||
y2="39.117912"
|
||||
transform="translate(-40.023592,-39.117912)"
|
||||
fill="none"
|
||||
stroke="#569fed"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o8_to"
|
||||
transform="translate(32,38.914207)">
|
||||
<line
|
||||
id="erwehhtipo1o8"
|
||||
x1="18.764334"
|
||||
y1="42.914207"
|
||||
x2="46.856926"
|
||||
y2="42.914207"
|
||||
transform="translate(-32.81063,-42.914207)"
|
||||
fill="none"
|
||||
stroke="#569fed"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o9_to"
|
||||
transform="translate(32.810629,42.710506)">
|
||||
<line
|
||||
id="erwehhtipo1o9"
|
||||
x1="26.356926"
|
||||
y1="46.710506"
|
||||
x2="39.264332"
|
||||
y2="46.710506"
|
||||
transform="translate(-32.810629,-46.710506)"
|
||||
fill="none"
|
||||
stroke="#569fed"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o10_to"
|
||||
transform="translate(19.143962,35.117912)">
|
||||
<line
|
||||
id="erwehhtipo1o10"
|
||||
x1="13.449517"
|
||||
y1="39.117912"
|
||||
x2="24.838408"
|
||||
y2="39.117912"
|
||||
transform="translate(-19.143962,-39.117912)"
|
||||
fill="none"
|
||||
stroke="#569fed"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o11_to"
|
||||
transform="translate(31.292111,23.72905)">
|
||||
<line
|
||||
id="erwehhtipo1o11"
|
||||
x1="28.634703"
|
||||
y1="27.72905"
|
||||
x2="33.94952"
|
||||
y2="27.72905"
|
||||
transform="translate(-31.292111,-27.72905)"
|
||||
fill="none"
|
||||
stroke="#90bff7"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
<g
|
||||
id="erwehhtipo1o12_to"
|
||||
transform="translate(44.199518,23.72905)">
|
||||
<line
|
||||
id="erwehhtipo1o12"
|
||||
x1="41.54211"
|
||||
y1="27.72905"
|
||||
x2="46.856926"
|
||||
y2="27.72905"
|
||||
transform="translate(-44.199518,-27.72905)"
|
||||
fill="none"
|
||||
stroke="#569fed"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
stroke-miterlimit="10" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<style
|
||||
id="style2"><![CDATA[#erwehhtipo1o2_to {animation: erwehhtipo1o2_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o2_to__to { 0% {transform: translate(24.458777px,23.932756px)} 25% {transform: translate(26px,23.930000px)} 50% {transform: translate(24.458777px,23.932756px)} 75% {transform: translate(22.460000px,23.932756px)} 100% {transform: translate(24.458777px,23.932756px)} }#erwehhtipo1o3_to {animation: erwehhtipo1o3_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o3_to__to { 0% {transform: translate(19.143962px,27.729050px)} 25% {transform: translate(17px,27.729050px)} 50% {transform: translate(19.143962px,27.729050px)} 75% {transform: translate(21.140000px,27.729050px)} 100% {transform: translate(19.143962px,27.729050px)} }#erwehhtipo1o4_to {animation: erwehhtipo1o4_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o4_to__to { 0% {transform: translate(30.532851px,31.525349px)} 25% {transform: translate(32.530000px,31.530000px)} 50% {transform: translate(30.532851px,31.525349px)} 75% {transform: translate(28.530000px,31.525349px)} 100% {transform: translate(30.532853px,31.525349px)} }#erwehhtipo1o5_to {animation: erwehhtipo1o5_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o5_to__to { 0% {transform: translate(43.819889px,35.321644px)} 25% {transform: translate(41.020000px,35.321644px)} 50% {transform: translate(43.819889px,35.321644px)} 75% {transform: translate(45.820000px,35.321644px)} 100% {transform: translate(43.819891px,35.321644px)} }#erwehhtipo1o6_to {animation: erwehhtipo1o6_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o6_to__to { 0% {transform: translate(21.421741px,35.321644px)} 25% {transform: translate(19px,35.321644px)} 50% {transform: translate(21.421741px,35.321644px)} 75% {transform: translate(23.420000px,35.321644px)} 100% {transform: translate(21.421742px,35.321644px)} }#erwehhtipo1o7_to {animation: erwehhtipo1o7_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o7_to__to { 0% {transform: translate(40.403223px,39.117912px)} 25% {transform: translate(42.020000px,39.117912px)} 50% {transform: translate(40.023592px,39.117912px)} 75% {transform: translate(38.020000px,39.117912px)} 100% {transform: translate(40.023593px,39.117912px)} }#erwehhtipo1o8_to {animation: erwehhtipo1o8_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o8_to__to { 0% {transform: translate(32px,42.914207px)} 25% {transform: translate(30px,42.914207px)} 50% {transform: translate(32px,42.914207px)} 75% {transform: translate(34px,42.914207px)} 100% {transform: translate(32.000001px,42.914207px)} }#erwehhtipo1o9_to {animation: erwehhtipo1o9_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o9_to__to { 0% {transform: translate(32.810629px,46.710506px)} 25% {transform: translate(34px,46.710506px)} 50% {transform: translate(32.810000px,46.710506px)} 75% {transform: translate(30.810000px,46.710506px)} 100% {transform: translate(32.810001px,46.710506px)} }#erwehhtipo1o10_to {animation: erwehhtipo1o10_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o10_to__to { 0% {transform: translate(19.143962px,39.117912px)} 25% {transform: translate(21.140000px,39.117912px)} 50% {transform: translate(19.143962px,39.117912px)} 75% {transform: translate(17.140000px,39.117912px)} 100% {transform: translate(19.143964px,39.117912px)} }#erwehhtipo1o11_to {animation: erwehhtipo1o11_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o11_to__to { 0% {transform: translate(31.292111px,27.729050px)} 25% {transform: translate(29px,27.729050px)} 50% {transform: translate(31.292111px,27.729050px)} 75% {transform: translate(33.290000px,27.729050px)} 100% {transform: translate(31.292111px,27.729050px)} }#erwehhtipo1o12_to {animation: erwehhtipo1o12_to__to 8000ms linear infinite normal forwards}@keyframes erwehhtipo1o12_to__to { 0% {transform: translate(44.199518px,27.729050px)} 25% {transform: translate(42px,27.729050px)} 50% {transform: translate(44.199518px,27.729050px)} 75% {transform: translate(46.200000px,27.729050px)} 100% {transform: translate(44.199520px,27.729050px)} }]]></style>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 13 KiB |
+62
@@ -0,0 +1,62 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" width="64" height="64" viewbox="0 0 64 64"
|
||||
id="svg36" sodipodi:docname="lightning-rainy.svg" inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10"
|
||||
gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2"
|
||||
inkscape:window-width="1622" inkscape:window-height="1109" id="namedview38" showgrid="false"
|
||||
inkscape:zoom="9.6286108" inkscape:cx="32" inkscape:cy="32" inkscape:window-x="1971" inkscape:window-y="104"
|
||||
inkscape:window-maximized="0" inkscape:current-layer="g33-4" inkscape:document-rotation="0" />
|
||||
<defs id="defs19">
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur2" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset4" />
|
||||
<feComponentTransfer id="feComponentTransfer8">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge14">
|
||||
<feMergeNode id="feMergeNode10" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="thunder">
|
||||
<g transform="translate(20,10)" id="g33">
|
||||
<g class="am-weather-cloud-1" id="g23" transform="matrix(1.061729,0,0,1.061729,-1.2222195,-5.9437076)">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8" stroke="#ffffff" stroke-linejoin="round" stroke-width="1.2"
|
||||
transform="matrix(0.6,0,0,0.6,-15,-6)" id="path21" />
|
||||
</g>
|
||||
<g id="g27" transform="matrix(1.061729,0,0,1.061729,-1.2222195,-5.9437076)">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee" stroke="#ffffff" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"
|
||||
id="path25" />
|
||||
</g>
|
||||
<g transform="matrix(1.2740748,0,0,1.2740748,-10.777781,23.784704)" id="g31">
|
||||
<polygon class="am-weather-stroke" fill="#ffa500" stroke="#ffffff" stroke-width="1"
|
||||
points="11.1,6.9 14.3,-2.9 20.5,-2.9 16.4,4.3 20.3,4.3 11.5,14.6 14.9,6.9 " id="polygon29" />
|
||||
</g>
|
||||
<g transform="rotate(10,-199.38609,85.237485)" id="g33-4">
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91c0f8" stroke-dasharray="4.24692, 4.24692"
|
||||
stroke-linecap="round" stroke-width="2.12346" x1="-11.655619" x2="-11.655619" y1="-1.4159311"
|
||||
y2="7.0779023" id="line27" />
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91c0f8" stroke-dasharray="4.24692, 4.24692"
|
||||
stroke-linecap="round" stroke-width="2.12346" x1="5.2030058" x2="5.2030058" y1="-3.9525981" y2="4.541234"
|
||||
id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,442 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg36"
|
||||
sodipodi:docname="lightning-rainy.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1622"
|
||||
inkscape:window-height="1109"
|
||||
id="namedview38"
|
||||
showgrid="false"
|
||||
inkscape:zoom="9.6286108"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="1971"
|
||||
inkscape:window-y="104"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="g33-4"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(10px,0px);
|
||||
-moz-transform: translate(10px,0px);
|
||||
-ms-transform: translate(10px,0px);
|
||||
transform: translate(10px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** STROKE
|
||||
*/
|
||||
@keyframes am-weather-stroke {
|
||||
0% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
2% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
4% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
6% {
|
||||
-webkit-transform: translate(0.5px,0.4px);
|
||||
-moz-transform: translate(0.5px,0.4px);
|
||||
-ms-transform: translate(0.5px,0.4px);
|
||||
transform: translate(0.5px,0.4px);
|
||||
}
|
||||
|
||||
8% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
10% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
12% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
14% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
16% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
18% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
20% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
22% {
|
||||
-webkit-transform: translate(1px,0.0px);
|
||||
-moz-transform: translate(1px,0.0px);
|
||||
-ms-transform: translate(1px,0.0px);
|
||||
transform: translate(1px,0.0px);
|
||||
}
|
||||
|
||||
24% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
26% {
|
||||
-webkit-transform: translate(-1px,0.0px);
|
||||
-moz-transform: translate(-1px,0.0px);
|
||||
-ms-transform: translate(-1px,0.0px);
|
||||
transform: translate(-1px,0.0px);
|
||||
|
||||
}
|
||||
|
||||
28% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
40% {
|
||||
fill: orange;
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
65% {
|
||||
fill: white;
|
||||
-webkit-transform: translate(-1px,5.0px);
|
||||
-moz-transform: translate(-1px,5.0px);
|
||||
-ms-transform: translate(-1px,5.0px);
|
||||
transform: translate(-1px,5.0px);
|
||||
}
|
||||
61% {
|
||||
fill: orange;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-stroke {
|
||||
-webkit-animation-name: am-weather-stroke;
|
||||
-moz-animation-name: am-weather-stroke;
|
||||
animation-name: am-weather-stroke;
|
||||
-webkit-animation-duration: 1.11s;
|
||||
-moz-animation-duration: 1.11s;
|
||||
animation-duration: 1.11s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="thunder">
|
||||
<g
|
||||
transform="translate(20,10)"
|
||||
id="g33">
|
||||
<g
|
||||
class="am-weather-cloud-1"
|
||||
id="g23"
|
||||
transform="matrix(1.061729,0,0,1.061729,-1.2222195,-5.9437076)">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="matrix(0.6,0,0,0.6,-10,-6)"
|
||||
id="path21" />
|
||||
</g>
|
||||
<g
|
||||
id="g27"
|
||||
transform="matrix(1.061729,0,0,1.061729,-1.2222195,-5.9437076)">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path25" />
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(1.2740748,0,0,1.2740748,-10.777781,23.784704)"
|
||||
id="g31">
|
||||
<polygon
|
||||
class="am-weather-stroke"
|
||||
fill="#ffa500"
|
||||
stroke="#ffffff"
|
||||
stroke-width="1"
|
||||
points="11.1,6.9 14.3,-2.9 20.5,-2.9 16.4,4.3 20.3,4.3 11.5,14.6 14.9,6.9 "
|
||||
id="polygon29" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(10,-199.38609,85.237485)"
|
||||
id="g33-4">
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4.24692, 4.24692"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2.12346"
|
||||
x1="-11.655619"
|
||||
x2="-11.655619"
|
||||
y1="-1.4159311"
|
||||
y2="7.0779023"
|
||||
id="line27" />
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4.24692, 4.24692"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2.12346"
|
||||
x1="5.2030058"
|
||||
x2="5.2030058"
|
||||
y1="-3.9525981"
|
||||
y2="4.541234"
|
||||
id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 13 KiB |
@@ -0,0 +1,36 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="night">
|
||||
<g transform="translate(20,20)">
|
||||
<g class="am-weather-moon-star-1">
|
||||
<polygon fill="orange" points="3.3,1.5 4,2.7 5.2,3.3 4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7" stroke="none" stroke-miterlimit="10"/>
|
||||
</g>
|
||||
<g class="am-weather-moon-star-2">
|
||||
<polygon fill="orange" points="3.3,1.5 4,2.7 5.2,3.3 4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7" stroke="none" stroke-miterlimit="10" transform="translate(20,10)"/>
|
||||
</g>
|
||||
<g class="am-weather-moon">
|
||||
<path d="M14.5,13.2c0-3.7,2-6.9,5-8.7 c-1.5-0.9-3.2-1.3-5-1.3c-5.5,0-10,4.5-10,10s4.5,10,10,10c1.8,0,3.5-0.5,5-1.3C16.5,20.2,14.5,16.9,14.5,13.2z" fill="orange" stroke="orange" stroke-linejoin="round" stroke-width="2"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
@@ -0,0 +1,590 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg36"
|
||||
sodipodi:docname="night.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1847"
|
||||
inkscape:window-height="1102"
|
||||
id="namedview38"
|
||||
showgrid="false"
|
||||
inkscape:zoom="10.639491"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="1509"
|
||||
inkscape:window-y="252"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="night"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(10px,0px);
|
||||
-moz-transform: translate(10px,0px);
|
||||
-ms-transform: translate(10px,0px);
|
||||
transform: translate(10px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(-1.2px) translateY(2px);
|
||||
-moz-transform: translateX(-1.2px) translateY(2px);
|
||||
-ms-transform: translateX(-1.2px) translateY(2px);
|
||||
transform: translateX(-1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(1.4px) translateY(4px);
|
||||
-moz-transform: translateX(1.4px) translateY(4px);
|
||||
-ms-transform: translateX(1.4px) translateY(4px);
|
||||
transform: translateX(1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(-1.6px) translateY(6px);
|
||||
-moz-transform: translateX(-1.6px) translateY(6px);
|
||||
-ms-transform: translateX(-1.6px) translateY(6px);
|
||||
transform: translateX(-1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes am-weather-snow-reverse {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(1.2px) translateY(2px);
|
||||
-moz-transform: translateX(1.2px) translateY(2px);
|
||||
-ms-transform: translateX(1.2px) translateY(2px);
|
||||
transform: translateX(1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(-1.4px) translateY(4px);
|
||||
-moz-transform: translateX(-1.4px) translateY(4px);
|
||||
-ms-transform: translateX(-1.4px) translateY(4px);
|
||||
transform: translateX(-1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(1.6px) translateY(6px);
|
||||
-moz-transform: translateX(1.6px) translateY(6px);
|
||||
-ms-transform: translateX(1.6px) translateY(6px);
|
||||
transform: translateX(1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-2 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
-ms-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-3 {
|
||||
-webkit-animation-name: am-weather-snow-reverse;
|
||||
-moz-animation-name: am-weather-snow-reverse;
|
||||
-ms-animation-name: am-weather-snow-reverse;
|
||||
animation-name: am-weather-snow-reverse;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** EASING
|
||||
*/
|
||||
.am-weather-easing-ease-in-out {
|
||||
-webkit-animation-timing-function: ease-in-out;
|
||||
-moz-animation-timing-function: ease-in-out;
|
||||
-ms-animation-timing-function: ease-in-out;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="night">
|
||||
<g
|
||||
transform="matrix(1.7637131,0,0,1.7637131,7.6363987,9.0123566)"
|
||||
id="g33">
|
||||
<g
|
||||
class="am-weather-moon-star-1"
|
||||
id="g23">
|
||||
<polygon
|
||||
fill="#ffa500"
|
||||
points="3.3,1.5 4,2.7 5.2,3.3 4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 "
|
||||
stroke="none"
|
||||
stroke-miterlimit="10"
|
||||
id="polygon21" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-moon-star-2"
|
||||
id="g27">
|
||||
<polygon
|
||||
fill="#ffa500"
|
||||
points="3.3,1.5 4,2.7 5.2,3.3 4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 "
|
||||
stroke="none"
|
||||
stroke-miterlimit="10"
|
||||
transform="translate(20,10)"
|
||||
id="polygon25" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-moon"
|
||||
id="g31">
|
||||
<path
|
||||
d="m 14.5,13.2 c 0,-3.7 2,-6.9 5,-8.7 -1.5,-0.9 -3.2,-1.3 -5,-1.3 -5.5,0 -10,4.5 -10,10 0,5.5 4.5,10 10,10 1.8,0 3.5,-0.5 5,-1.3 -3,-1.7 -5,-5 -5,-8.7 z"
|
||||
fill="#ffa500"
|
||||
stroke="#ffa500"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
id="path29" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 17 KiB |
@@ -0,0 +1,34 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="rainy-5">
|
||||
<g transform="translate(20,10)">
|
||||
<g>
|
||||
<path d="M47.7,35.4c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"/>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(34,46), rotate(10)">
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91C0F8" stroke-dasharray="4,7" stroke-linecap="round" stroke-width="2" transform="translate(-6,1)" x1="0" x2="0" y1="0" y2="8" />
|
||||
<line class="am-weather-rain-2" fill="none" stroke="#91C0F8" stroke-dasharray="4,7" stroke-linecap="round" stroke-width="2" transform="translate(0,-1)" x1="0" x2="0" y1="0" y2="8" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
@@ -0,0 +1,188 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg34"
|
||||
sodipodi:docname="rainy-5.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata38">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1541"
|
||||
inkscape:window-height="1067"
|
||||
id="namedview36"
|
||||
showgrid="false"
|
||||
inkscape:zoom="11.202953"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="rainy-5"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="rainy-5">
|
||||
<g
|
||||
transform="matrix(1.2322612,0,0,1.2322612,16.545175,-1.1993859)"
|
||||
id="g25">
|
||||
<g
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path21" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(1.2135403,0.2139799,-0.2139799,1.2135403,33.796831,43.162016)"
|
||||
id="g31">
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4, 7"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(-6,1)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line27" />
|
||||
<line
|
||||
class="am-weather-rain-2"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4, 7"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,-1)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line29" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.2 KiB |
@@ -0,0 +1,35 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="rainy-6">
|
||||
<g transform="translate(20,10)">
|
||||
<g>
|
||||
<path d="M47.7,35.4c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"/>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(31,46), rotate(10)">
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91C0F8" stroke-dasharray="4,4" stroke-linecap="round" stroke-width="2" transform="translate(-4,1)" x1="0" x2="0" y1="0" y2="8" />
|
||||
<line class="am-weather-rain-2" fill="none" stroke="#91C0F8" stroke-dasharray="4,4" stroke-linecap="round" stroke-width="2" transform="translate(0,-1)" x1="0" x2="0" y1="0" y2="8" />
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91C0F8" stroke-dasharray="4,4" stroke-linecap="round" stroke-width="2" transform="translate(4,0)" x1="0" x2="0" y1="0" y2="8" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
@@ -0,0 +1,201 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg36"
|
||||
sodipodi:docname="rainy-6.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1889"
|
||||
inkscape:window-height="1134"
|
||||
id="namedview38"
|
||||
showgrid="false"
|
||||
inkscape:zoom="13.001339"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="rainy-6"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="rainy-6">
|
||||
<g
|
||||
transform="matrix(1.2055471,0,0,1.2055471,16.424962,-0.93491626)"
|
||||
id="g25">
|
||||
<g
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path21" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(1.1872321,0.20934105,-0.20934105,1.1872321,29.68598,42.464779)"
|
||||
id="g33">
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4, 4"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(-4,1)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line27" />
|
||||
<line
|
||||
class="am-weather-rain-2"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4, 4"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,-1)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line29" />
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4, 4"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(4)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.5 KiB |
@@ -0,0 +1,35 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="rainy-7">
|
||||
<g transform="translate(20,10)">
|
||||
<g>
|
||||
<path d="M47.7,35.4c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"/>
|
||||
</g>
|
||||
</g>
|
||||
<g transform="translate(31,46), rotate(10)">
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91C0F8" stroke-dasharray="0.1,7" stroke-linecap="round" stroke-width="3" transform="translate(-5,1)" x1="0" x2="0" y1="0" y2="8" />
|
||||
<line class="am-weather-rain-2" fill="none" stroke="#91C0F8" stroke-dasharray="0.1,7" stroke-linecap="round" stroke-width="3" transform="translate(0,-1)" x1="0" x2="0" y1="0" y2="8" />
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91C0F8" stroke-dasharray="0.1,7" stroke-linecap="round" stroke-width="3" transform="translate(5,0)" x1="0" x2="0" y1="0" y2="8" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
@@ -0,0 +1,201 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg36"
|
||||
sodipodi:docname="rainy-7.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1558"
|
||||
inkscape:window-height="1295"
|
||||
id="namedview38"
|
||||
showgrid="false"
|
||||
inkscape:zoom="13.524221"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="rainy-7"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="rainy-7">
|
||||
<g
|
||||
transform="matrix(1.1755159,0,0,1.1755159,16.289822,-0.63760738)"
|
||||
id="g25">
|
||||
<g
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path21" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(1.1576571,0.20412619,-0.20412619,1.1576571,29.220497,41.680964)"
|
||||
id="g33">
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="0.1, 7"
|
||||
stroke-linecap="round"
|
||||
stroke-width="3"
|
||||
transform="translate(-5,1)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line27" />
|
||||
<line
|
||||
class="am-weather-rain-2"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="0.1, 7"
|
||||
stroke-linecap="round"
|
||||
stroke-width="3"
|
||||
transform="translate(0,-1)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line29" />
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="0.1, 7"
|
||||
stroke-linecap="round"
|
||||
stroke-width="3"
|
||||
transform="translate(5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="8"
|
||||
id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.5 KiB |
@@ -0,0 +1,54 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
|
||||
<feOffset dx="0" dy="4" result="offsetblur"/>
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05"/>
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="snowy-6">
|
||||
<g transform="translate(20,10)">
|
||||
<g class="am-weather-cloud-2">
|
||||
<path d="M47.7,35.4c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z" fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"/>
|
||||
</g>
|
||||
<g class="am-weather-snow-1">
|
||||
<g transform="translate(3,28)">
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1.2" transform="translate(0,9), rotate(0)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(45)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(90)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(135)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
</g>
|
||||
</g>
|
||||
<g class="am-weather-snow-2">
|
||||
<g transform="translate(11,28)">
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1.2" transform="translate(0,9), rotate(0)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(45)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(90)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(135)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
</g>
|
||||
</g>
|
||||
<g class="am-weather-snow-3">
|
||||
<g transform="translate(20,28)">
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1.2" transform="translate(0,9), rotate(0)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(45)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(90)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
<line fill="none" stroke="#57A0EE" stroke-linecap="round" stroke-width="1" transform="translate(0,9), rotate(135)" x1="0" x2="0" y1="-2.5" y2="2.5" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.6 KiB |
@@ -0,0 +1,430 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg64"
|
||||
sodipodi:docname="snowy-6.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata68">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1556"
|
||||
inkscape:window-height="1086"
|
||||
id="namedview66"
|
||||
showgrid="false"
|
||||
inkscape:zoom="10.083293"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="1843"
|
||||
inkscape:window-y="250"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="snowy-6"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(-1.2px) translateY(2px);
|
||||
-moz-transform: translateX(-1.2px) translateY(2px);
|
||||
-ms-transform: translateX(-1.2px) translateY(2px);
|
||||
transform: translateX(-1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(1.4px) translateY(4px);
|
||||
-moz-transform: translateX(1.4px) translateY(4px);
|
||||
-ms-transform: translateX(1.4px) translateY(4px);
|
||||
transform: translateX(1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(-1.6px) translateY(6px);
|
||||
-moz-transform: translateX(-1.6px) translateY(6px);
|
||||
-ms-transform: translateX(-1.6px) translateY(6px);
|
||||
transform: translateX(-1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes am-weather-snow-reverse {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(1.2px) translateY(2px);
|
||||
-moz-transform: translateX(1.2px) translateY(2px);
|
||||
-ms-transform: translateX(1.2px) translateY(2px);
|
||||
transform: translateX(1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(-1.4px) translateY(4px);
|
||||
-moz-transform: translateX(-1.4px) translateY(4px);
|
||||
-ms-transform: translateX(-1.4px) translateY(4px);
|
||||
transform: translateX(-1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(1.6px) translateY(6px);
|
||||
-moz-transform: translateX(1.6px) translateY(6px);
|
||||
-ms-transform: translateX(1.6px) translateY(6px);
|
||||
transform: translateX(1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-2 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
-ms-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-3 {
|
||||
-webkit-animation-name: am-weather-snow-reverse;
|
||||
-moz-animation-name: am-weather-snow-reverse;
|
||||
-ms-animation-name: am-weather-snow-reverse;
|
||||
animation-name: am-weather-snow-reverse;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="snowy-6">
|
||||
<g
|
||||
transform="matrix(1.2195122,0,0,1.2195122,16.487805,-1.0731708)"
|
||||
id="g61">
|
||||
<g
|
||||
class="am-weather-cloud-2"
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path21" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-snow-1"
|
||||
id="g35">
|
||||
<g
|
||||
transform="translate(3,28)"
|
||||
id="g33">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line25" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(45,-10.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line27" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(90,-4.5,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line29" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(135,-1.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-snow-2"
|
||||
id="g47">
|
||||
<g
|
||||
transform="translate(11,28)"
|
||||
id="g45">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line37" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(45,-10.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line39" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(90,-4.5,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line41" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(135,-1.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line43" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-snow-3"
|
||||
id="g59">
|
||||
<g
|
||||
transform="translate(20,28)"
|
||||
id="g57">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line49" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(45,-10.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line51" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(90,-4.5,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line53" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(135,-1.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line55" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 12 KiB |
@@ -0,0 +1,62 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" width="64" height="64" viewbox="0 0 64 64"
|
||||
id="svg40" sodipodi:docname="snowy-rainy.svg" inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata id="metadata44">
|
||||
<rdf:RDF>
|
||||
<cc:Work rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10"
|
||||
gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2"
|
||||
inkscape:window-width="1348" inkscape:window-height="893" id="namedview42" showgrid="false"
|
||||
inkscape:zoom="4.8250399" inkscape:cx="32" inkscape:cy="32" inkscape:window-x="1074" inkscape:window-y="74"
|
||||
inkscape:window-maximized="0" inkscape:current-layer="snowy-4" inkscape:document-rotation="0" />
|
||||
<defs id="defs19">
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur2" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset4" />
|
||||
<feComponentTransfer id="feComponentTransfer8">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge14">
|
||||
<feMergeNode id="feMergeNode10" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="snowy-4">
|
||||
<g transform="matrix(1.2101111,0,0,1.2101111,16.4455,-0.98009986)" id="g37">
|
||||
<g id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee" stroke="#ffffff" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"
|
||||
id="path21" />
|
||||
</g>
|
||||
<g class="am-weather-snow-1" id="g35">
|
||||
<g transform="translate(11,28)" id="g33">
|
||||
<line fill="none" stroke="#57a0ee" stroke-linecap="round" stroke-width="1.2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="-2.5" y2="2.5" id="line25" />
|
||||
<line fill="none" stroke="#57a0ee" stroke-linecap="round" stroke-width="1"
|
||||
transform="rotate(45,-10.863961,4.5)" x1="0" x2="0" y1="-2.5" y2="2.5" id="line27" />
|
||||
<line fill="none" stroke="#57a0ee" stroke-linecap="round" stroke-width="1"
|
||||
transform="rotate(90,-4.5,4.5)" x1="0" x2="0" y1="-2.5" y2="2.5" id="line29" />
|
||||
<line fill="none" stroke="#57a0ee" stroke-linecap="round" stroke-width="1"
|
||||
transform="rotate(135,-1.863961,4.5)" x1="0" x2="0" y1="-2.5" y2="2.5" id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91c0f8" stroke-dasharray="4.84044, 4.84044"
|
||||
stroke-linecap="round" stroke-width="2.42022" x1="20.420971" x2="18.739901" y1="42.776844" y2="52.310658"
|
||||
id="line27-8" />
|
||||
<line class="am-weather-rain-1" fill="none" stroke="#91c0f8" stroke-dasharray="4.84044, 4.84044"
|
||||
stroke-linecap="round" stroke-width="2.42022" x1="39.845806" x2="38.164742" y1="43.266186" y2="52.799999"
|
||||
id="line31-1" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.8 KiB |
@@ -0,0 +1,289 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg40"
|
||||
sodipodi:docname="snowy-rainy.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata44">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1348"
|
||||
inkscape:window-height="893"
|
||||
id="namedview42"
|
||||
showgrid="false"
|
||||
inkscape:zoom="4.8250399"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="1074"
|
||||
inkscape:window-y="74"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="snowy-4"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translate(0.0px,0);
|
||||
-moz-transform: translate(0.0px,0);
|
||||
-ms-transform: translate(0.0px,0);
|
||||
transform: translate(0.0px,0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translate(-1.2px,2px);
|
||||
-moz-transform: translate(-1.2px,2px);
|
||||
-ms-transform: translate(-1.2px,2px);
|
||||
transform: translate(-1.2px,2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translate(1.4px,4px);
|
||||
-moz-transform: translate(1.4px,4px);
|
||||
-ms-transform: translate(1.4px,4px);
|
||||
transform: translate(1.4px,4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-1.6px,6px);
|
||||
-moz-transform: translate(-1.6px,6px);
|
||||
-ms-transform: translate(-1.6px,6px);
|
||||
transform: translate(-1.6px,6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="snowy-4">
|
||||
<g
|
||||
transform="matrix(1.2101111,0,0,1.2101111,16.4455,-0.98009986)"
|
||||
id="g37">
|
||||
<g
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path21" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-snow-1"
|
||||
id="g35">
|
||||
<g
|
||||
transform="translate(11,28)"
|
||||
id="g33">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line25" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(45,-10.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line27" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(90,-4.5,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line29" />
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1"
|
||||
transform="rotate(135,-1.863961,4.5)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="-2.5"
|
||||
y2="2.5"
|
||||
id="line31" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4.84044, 4.84044"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2.42022"
|
||||
x1="20.420971"
|
||||
x2="18.739901"
|
||||
y1="42.776844"
|
||||
y2="52.310658"
|
||||
id="line27-8" />
|
||||
<line
|
||||
class="am-weather-rain-1"
|
||||
fill="none"
|
||||
stroke="#91c0f8"
|
||||
stroke-dasharray="4.84044, 4.84044"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2.42022"
|
||||
x1="39.845806"
|
||||
x2="38.164742"
|
||||
y1="43.266186"
|
||||
y2="52.799999"
|
||||
id="line31-1" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.9 KiB |
@@ -0,0 +1,38 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- (c) ammap.com | SVG weather icons -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"
|
||||
viewbox="0 0 64 64">
|
||||
<defs>
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" />
|
||||
<feComponentTransfer>
|
||||
<feFuncA type="linear" slope="0.05" />
|
||||
</feComponentTransfer>
|
||||
<feMerge>
|
||||
<feMergeNode />
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="thunder">
|
||||
<g transform="translate(20,10)">
|
||||
<g class="am-weather-cloud-1">
|
||||
<path
|
||||
d="M47.7,35.4 c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z"
|
||||
fill="#91C0F8" stroke="white" stroke-linejoin="round" stroke-width="1.2"
|
||||
transform="translate(-15,-6), scale(0.6)" />
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
d="M47.7,35.4 c0-4.6-3.7-8.2-8.2-8.2c-1,0-1.9,0.2-2.8,0.5c-0.3-3.4-3.1-6.2-6.6-6.2c-3.7,0-6.7,3-6.7,6.7c0,0.8,0.2,1.6,0.4,2.3 c-0.3-0.1-0.7-0.1-1-0.1c-3.7,0-6.7,3-6.7,6.7c0,3.6,2.9,6.6,6.5,6.7l17.2,0C44.2,43.3,47.7,39.8,47.7,35.4z"
|
||||
fill="#57A0EE" stroke="#FFFFFF" stroke-linejoin="round" stroke-width="1.2"
|
||||
transform="translate(-20,-11)" />
|
||||
</g>
|
||||
<g transform="translate(-9,28), scale(1.2)">
|
||||
<polygon class="am-weather-stroke" fill="orange" stroke="white" stroke-width="1"
|
||||
points="14.3,-2.9 20.5,-2.9 16.4,4.3 20.3,4.3 11.5,14.6 14.9,6.9 11.1,6.9" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1,357 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg36"
|
||||
sodipodi:docname="thunder.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata40">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1646"
|
||||
inkscape:window-height="1167"
|
||||
id="namedview38"
|
||||
showgrid="false"
|
||||
inkscape:zoom="13.936293"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="thunder"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(10px,0px);
|
||||
-moz-transform: translate(10px,0px);
|
||||
-ms-transform: translate(10px,0px);
|
||||
transform: translate(10px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** STROKE
|
||||
*/
|
||||
@keyframes am-weather-stroke {
|
||||
0% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
2% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
4% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
6% {
|
||||
-webkit-transform: translate(0.5px,0.4px);
|
||||
-moz-transform: translate(0.5px,0.4px);
|
||||
-ms-transform: translate(0.5px,0.4px);
|
||||
transform: translate(0.5px,0.4px);
|
||||
}
|
||||
|
||||
8% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
10% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
12% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
14% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
16% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
18% {
|
||||
-webkit-transform: translate(0.3px,0.0px);
|
||||
-moz-transform: translate(0.3px,0.0px);
|
||||
-ms-transform: translate(0.3px,0.0px);
|
||||
transform: translate(0.3px,0.0px);
|
||||
}
|
||||
|
||||
20% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
22% {
|
||||
-webkit-transform: translate(1px,0.0px);
|
||||
-moz-transform: translate(1px,0.0px);
|
||||
-ms-transform: translate(1px,0.0px);
|
||||
transform: translate(1px,0.0px);
|
||||
}
|
||||
|
||||
24% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
26% {
|
||||
-webkit-transform: translate(-1px,0.0px);
|
||||
-moz-transform: translate(-1px,0.0px);
|
||||
-ms-transform: translate(-1px,0.0px);
|
||||
transform: translate(-1px,0.0px);
|
||||
|
||||
}
|
||||
|
||||
28% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
40% {
|
||||
fill: orange;
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
|
||||
65% {
|
||||
fill: white;
|
||||
-webkit-transform: translate(-1px,5.0px);
|
||||
-moz-transform: translate(-1px,5.0px);
|
||||
-ms-transform: translate(-1px,5.0px);
|
||||
transform: translate(-1px,5.0px);
|
||||
}
|
||||
61% {
|
||||
fill: orange;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0.0px,0.0px);
|
||||
-moz-transform: translate(0.0px,0.0px);
|
||||
-ms-transform: translate(0.0px,0.0px);
|
||||
transform: translate(0.0px,0.0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-stroke {
|
||||
-webkit-animation-name: am-weather-stroke;
|
||||
-moz-animation-name: am-weather-stroke;
|
||||
animation-name: am-weather-stroke;
|
||||
-webkit-animation-duration: 1.11s;
|
||||
-moz-animation-duration: 1.11s;
|
||||
animation-duration: 1.11s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="thunder">
|
||||
<g
|
||||
transform="matrix(1.061729,0,0,1.061729,16.777781,4.0562924)"
|
||||
id="g33">
|
||||
<g
|
||||
class="am-weather-cloud-1"
|
||||
id="g23">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="matrix(0.6,0,0,0.6,-10,-6)"
|
||||
id="path21" />
|
||||
</g>
|
||||
<g
|
||||
id="g27">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#57a0ee"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path25" />
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(1.2,0,0,1.2,-9,28)"
|
||||
id="g31">
|
||||
<polygon
|
||||
class="am-weather-stroke"
|
||||
fill="#ffa500"
|
||||
stroke="#ffffff"
|
||||
stroke-width="1"
|
||||
points="14.9,6.9 11.1,6.9 14.3,-2.9 20.5,-2.9 16.4,4.3 20.3,4.3 11.5,14.6 "
|
||||
id="polygon29" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 10 KiB |
@@ -0,0 +1,84 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" width="64" height="64" viewbox="0 0 64 64"
|
||||
id="svg42" sodipodi:docname="windy-night-modif.svg" inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata id="metadata46">
|
||||
<rdf:RDF>
|
||||
<cc:Work rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10"
|
||||
gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2"
|
||||
inkscape:window-width="1671" inkscape:window-height="1295" id="namedview44" showgrid="false"
|
||||
inkscape:zoom="13.4988" inkscape:cx="32" inkscape:cy="34.384286" inkscape:window-x="171" inkscape:window-y="124"
|
||||
inkscape:window-maximized="0" inkscape:current-layer="svg42" inkscape:document-rotation="0" />
|
||||
<defs id="defs19">
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur2" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset4" />
|
||||
<feComponentTransfer id="feComponentTransfer8">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge14">
|
||||
<feMergeNode id="feMergeNode10" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<filter id="blur-5" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur28" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset30" />
|
||||
<feComponentTransfer id="feComponentTransfer34">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA32" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge40">
|
||||
<feMergeNode id="feMergeNode36" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode38" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="cloudy-night-2">
|
||||
<g transform="matrix(1.1348201,0,0,1.1348201,13.10669,5.0989355)" id="g39">
|
||||
<g transform="matrix(0.8,0,0,0.8,16,4)" id="g33">
|
||||
<g class="am-weather-moon-star-1" id="g23">
|
||||
<polygon fill="#ffa500" points="4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 3.3,1.5 4,2.7 5.2,3.3 " stroke="none"
|
||||
stroke-miterlimit="10" id="polygon21" />
|
||||
</g>
|
||||
<g class="am-weather-moon-star-2" id="g27">
|
||||
<polygon fill="#ffa500" points="4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 3.3,1.5 4,2.7 5.2,3.3 " stroke="none"
|
||||
stroke-miterlimit="10" transform="translate(20,10)" id="polygon25" />
|
||||
</g>
|
||||
<g class="am-weather-moon" id="g31">
|
||||
<path
|
||||
d="m 14.5,13.2 c 0,-3.7 2,-6.9 5,-8.7 -1.5,-0.9 -3.2,-1.3 -5,-1.3 -5.5,0 -10,4.5 -10,10 0,5.5 4.5,10 10,10 1.8,0 3.5,-0.5 5,-1.3 -3,-1.7 -5,-5 -5,-8.7 z"
|
||||
fill="#ffa500" stroke="#ffa500" stroke-linejoin="round" stroke-width="2" id="path29" />
|
||||
</g>
|
||||
</g>
|
||||
<g class="am-weather-cloud-2" id="g37">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8" stroke="#ffffff" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"
|
||||
id="path35" />
|
||||
</g>
|
||||
</g>
|
||||
<g transform="matrix(0.7,0,0,0.7,4.3355856,22.270636)" id="g59">
|
||||
<path class="am-weather-cloud-3" d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#ffffff"
|
||||
stroke-width="5.4" stroke-linecap="round" id="path47" />
|
||||
<path class="am-weather-cloud-2" d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#ffffff"
|
||||
stroke-width="5.4" stroke-linecap="round" id="path49" />
|
||||
<path class="am-weather-cloud-1" d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5" fill="none" stroke="#ffffff"
|
||||
stroke-width="5.4" stroke-linecap="round" id="path51" />
|
||||
<path class="am-weather-cloud-3" d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#57a0ee"
|
||||
stroke-width="3" stroke-linecap="round" id="path53" />
|
||||
<path class="am-weather-cloud-2" d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#57a0ee"
|
||||
stroke-width="3" stroke-linecap="round" id="path55" />
|
||||
<path class="am-weather-cloud-1" d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5" fill="none" stroke="#57a0ee"
|
||||
stroke-width="3" stroke-linecap="round" id="path57" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.2 KiB |
@@ -0,0 +1,847 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg42"
|
||||
sodipodi:docname="windy-night-modif.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata46">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1671"
|
||||
inkscape:window-height="1295"
|
||||
id="namedview44"
|
||||
showgrid="false"
|
||||
inkscape:zoom="13.4988"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="34.384286"
|
||||
inkscape:window-x="171"
|
||||
inkscape:window-y="124"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="svg42"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
]]></style>
|
||||
<filter
|
||||
id="blur-5"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur28" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset30" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer34">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA32" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge40">
|
||||
<feMergeNode
|
||||
id="feMergeNode36" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode38" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style43"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(6px,0px);
|
||||
-moz-transform: translate(6px,0px);
|
||||
-ms-transform: translate(6px,0px);
|
||||
transform: translate(6px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(-1.2px) translateY(2px);
|
||||
-moz-transform: translateX(-1.2px) translateY(2px);
|
||||
-ms-transform: translateX(-1.2px) translateY(2px);
|
||||
transform: translateX(-1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(1.4px) translateY(4px);
|
||||
-moz-transform: translateX(1.4px) translateY(4px);
|
||||
-ms-transform: translateX(1.4px) translateY(4px);
|
||||
transform: translateX(1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(-1.6px) translateY(6px);
|
||||
-moz-transform: translateX(-1.6px) translateY(6px);
|
||||
-ms-transform: translateX(-1.6px) translateY(6px);
|
||||
transform: translateX(-1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes am-weather-snow-reverse {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(1.2px) translateY(2px);
|
||||
-moz-transform: translateX(1.2px) translateY(2px);
|
||||
-ms-transform: translateX(1.2px) translateY(2px);
|
||||
transform: translateX(1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(-1.4px) translateY(4px);
|
||||
-moz-transform: translateX(-1.4px) translateY(4px);
|
||||
-ms-transform: translateX(-1.4px) translateY(4px);
|
||||
transform: translateX(-1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(1.6px) translateY(6px);
|
||||
-moz-transform: translateX(1.6px) translateY(6px);
|
||||
-ms-transform: translateX(1.6px) translateY(6px);
|
||||
transform: translateX(1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-2 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
-ms-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-3 {
|
||||
-webkit-animation-name: am-weather-snow-reverse;
|
||||
-moz-animation-name: am-weather-snow-reverse;
|
||||
-ms-animation-name: am-weather-snow-reverse;
|
||||
animation-name: am-weather-snow-reverse;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** EASING
|
||||
*/
|
||||
.am-weather-easing-ease-in-out {
|
||||
-webkit-animation-timing-function: ease-in-out;
|
||||
-moz-animation-timing-function: ease-in-out;
|
||||
-ms-animation-timing-function: ease-in-out;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="cloudy-night-2">
|
||||
<g
|
||||
transform="matrix(1.1348201,0,0,1.1348201,13.10669,5.0989355)"
|
||||
id="g39">
|
||||
<g
|
||||
transform="matrix(0.8,0,0,0.8,16,4)"
|
||||
id="g33">
|
||||
<g
|
||||
class="am-weather-moon-star-1"
|
||||
id="g23">
|
||||
<polygon
|
||||
fill="#ffa500"
|
||||
points="4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 3.3,1.5 4,2.7 5.2,3.3 "
|
||||
stroke="none"
|
||||
stroke-miterlimit="10"
|
||||
id="polygon21" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-moon-star-2"
|
||||
id="g27">
|
||||
<polygon
|
||||
fill="#ffa500"
|
||||
points="4,4 3.3,5.2 2.7,4 1.5,3.3 2.7,2.7 3.3,1.5 4,2.7 5.2,3.3 "
|
||||
stroke="none"
|
||||
stroke-miterlimit="10"
|
||||
transform="translate(20,10)"
|
||||
id="polygon25" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-moon"
|
||||
id="g31">
|
||||
<path
|
||||
d="m 14.5,13.2 c 0,-3.7 2,-6.9 5,-8.7 -1.5,-0.9 -3.2,-1.3 -5,-1.3 -5.5,0 -10,4.5 -10,10 0,5.5 4.5,10 10,10 1.8,0 3.5,-0.5 5,-1.3 -3,-1.7 -5,-5 -5,-8.7 z"
|
||||
fill="#ffa500"
|
||||
stroke="#ffa500"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
id="path29" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-cloud-2"
|
||||
id="g37">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path35" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(0.7,0,0,0.7,4.3355856,22.270636)"
|
||||
id="g59">
|
||||
<path
|
||||
class="am-weather-cloud-3"
|
||||
d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#ffffff"
|
||||
stroke-width="5.4"
|
||||
stroke-linecap="round"
|
||||
id="path47" />
|
||||
<path
|
||||
class="am-weather-cloud-2"
|
||||
d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#ffffff"
|
||||
stroke-width="5.4"
|
||||
stroke-linecap="round"
|
||||
id="path49" />
|
||||
<path
|
||||
class="am-weather-cloud-1"
|
||||
d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5"
|
||||
fill="none"
|
||||
stroke="#ffffff"
|
||||
stroke-width="5.4"
|
||||
stroke-linecap="round"
|
||||
id="path51" />
|
||||
<path
|
||||
class="am-weather-cloud-3"
|
||||
d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
id="path53" />
|
||||
<path
|
||||
class="am-weather-cloud-2"
|
||||
d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
id="path55" />
|
||||
<path
|
||||
class="am-weather-cloud-1"
|
||||
d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5"
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
id="path57" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 24 KiB |
@@ -0,0 +1,106 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" width="64" height="64" viewbox="0 0 64 64"
|
||||
id="svg66" sodipodi:docname="windy-modif.svg" inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata id="metadata70">
|
||||
<rdf:RDF>
|
||||
<cc:Work rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10"
|
||||
gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2"
|
||||
inkscape:window-width="1383" inkscape:window-height="1278" id="namedview68" showgrid="false"
|
||||
inkscape:zoom="7.1844982" inkscape:cx="32" inkscape:cy="32" inkscape:window-x="260" inkscape:window-y="473"
|
||||
inkscape:window-maximized="0" inkscape:current-layer="svg66" inkscape:document-rotation="0" />
|
||||
<defs id="defs19">
|
||||
<filter id="blur" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur2" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset4" />
|
||||
<feComponentTransfer id="feComponentTransfer8">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge14">
|
||||
<feMergeNode id="feMergeNode10" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<filter id="blur-4" width="200%" height="200%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="3" id="feGaussianBlur40" />
|
||||
<feOffset dx="0" dy="4" result="offsetblur" id="feOffset42" />
|
||||
<feComponentTransfer id="feComponentTransfer46">
|
||||
<feFuncA type="linear" slope="0.05" id="feFuncA44" />
|
||||
</feComponentTransfer>
|
||||
<feMerge id="feMerge52">
|
||||
<feMergeNode id="feMergeNode48" />
|
||||
<feMergeNode in="SourceGraphic" id="feMergeNode50" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g filter="url(#blur)" id="cloudy-day-2">
|
||||
<g transform="matrix(1.0657299,0,0,1.0657299,21.854489,7.8028103)" id="g63">
|
||||
<g transform="translate(0,16)" id="g57">
|
||||
<g class="am-weather-sun" id="g53">
|
||||
<g id="g23">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line21" />
|
||||
</g>
|
||||
<g transform="rotate(45)" id="g27">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line25" />
|
||||
</g>
|
||||
<g transform="rotate(90)" id="g31">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line29" />
|
||||
</g>
|
||||
<g transform="rotate(135)" id="g35">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line33" />
|
||||
</g>
|
||||
<g transform="scale(-1)" id="g39">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line37" />
|
||||
</g>
|
||||
<g transform="rotate(-135)" id="g43">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line41" />
|
||||
</g>
|
||||
<g transform="rotate(-90)" id="g47">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line45" />
|
||||
</g>
|
||||
<g transform="rotate(-45)" id="g51">
|
||||
<line fill="none" stroke="#ffa500" stroke-linecap="round" stroke-width="2" transform="translate(0,9)"
|
||||
x1="0" x2="0" y1="0" y2="3" id="line49" />
|
||||
</g>
|
||||
</g>
|
||||
<circle cx="0" cy="0" fill="#ffa500" r="5" stroke="#ffa500" stroke-width="2" id="circle55" />
|
||||
</g>
|
||||
<g class="am-weather-cloud-2" id="g61">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8" stroke="#ffffff" stroke-linejoin="round" stroke-width="1.2" transform="translate(-20,-11)"
|
||||
id="path59" />
|
||||
</g>
|
||||
</g>
|
||||
<g transform="matrix(0.7,0,0,0.7,17.276856,21.305209)" id="g71">
|
||||
<path class="am-weather-cloud-3" d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#ffffff"
|
||||
stroke-width="5.4" stroke-linecap="round" id="path59-2" />
|
||||
<path class="am-weather-cloud-2" d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#ffffff"
|
||||
stroke-width="5.4" stroke-linecap="round" id="path61" />
|
||||
<path class="am-weather-cloud-1" d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5" fill="none" stroke="#ffffff"
|
||||
stroke-width="5.4" stroke-linecap="round" id="path63" />
|
||||
<path class="am-weather-cloud-3" d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#57a0ee"
|
||||
stroke-width="3" stroke-linecap="round" id="path65" />
|
||||
<path class="am-weather-cloud-2" d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5" fill="none" stroke="#57a0ee"
|
||||
stroke-width="3" stroke-linecap="round" id="path67" />
|
||||
<path class="am-weather-cloud-1" d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5" fill="none" stroke="#57a0ee"
|
||||
stroke-width="3" stroke-linecap="round" id="path69" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.5 KiB |
@@ -0,0 +1,905 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="64"
|
||||
height="64"
|
||||
viewbox="0 0 64 64"
|
||||
id="svg66"
|
||||
sodipodi:docname="windy-modif.svg"
|
||||
inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
|
||||
<metadata
|
||||
id="metadata70">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1383"
|
||||
inkscape:window-height="1278"
|
||||
id="namedview68"
|
||||
showgrid="false"
|
||||
inkscape:zoom="7.1844982"
|
||||
inkscape:cx="32"
|
||||
inkscape:cy="32"
|
||||
inkscape:window-x="260"
|
||||
inkscape:window-y="473"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="svg66"
|
||||
inkscape:document-rotation="0" />
|
||||
<defs
|
||||
id="defs19">
|
||||
<filter
|
||||
id="blur"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur2" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset4" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer8">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA6" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge14">
|
||||
<feMergeNode
|
||||
id="feMergeNode10" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode12" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style17"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
]]></style>
|
||||
<filter
|
||||
id="blur-4"
|
||||
width="200%"
|
||||
height="200%">
|
||||
<feGaussianBlur
|
||||
in="SourceAlpha"
|
||||
stdDeviation="3"
|
||||
id="feGaussianBlur40" />
|
||||
<feOffset
|
||||
dx="0"
|
||||
dy="4"
|
||||
result="offsetblur"
|
||||
id="feOffset42" />
|
||||
<feComponentTransfer
|
||||
id="feComponentTransfer46">
|
||||
<feFuncA
|
||||
type="linear"
|
||||
slope="0.05"
|
||||
id="feFuncA44" />
|
||||
</feComponentTransfer>
|
||||
<feMerge
|
||||
id="feMerge52">
|
||||
<feMergeNode
|
||||
id="feMergeNode48" />
|
||||
<feMergeNode
|
||||
in="SourceGraphic"
|
||||
id="feMergeNode50" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
<style
|
||||
type="text/css"
|
||||
id="style55"><![CDATA[
|
||||
/*
|
||||
** CLOUDS
|
||||
*/
|
||||
@keyframes am-weather-cloud-1 {
|
||||
0% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(6px,0px);
|
||||
-moz-transform: translate(6px,0px);
|
||||
-ms-transform: translate(6px,0px);
|
||||
transform: translate(6px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(-5px,0px);
|
||||
-moz-transform: translate(-5px,0px);
|
||||
-ms-transform: translate(-5px,0px);
|
||||
transform: translate(-5px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-1 {
|
||||
-webkit-animation-name: am-weather-cloud-1;
|
||||
-moz-animation-name: am-weather-cloud-1;
|
||||
animation-name: am-weather-cloud-1;
|
||||
-webkit-animation-duration: 7s;
|
||||
-moz-animation-duration: 7s;
|
||||
animation-duration: 7s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-cloud-2 {
|
||||
0% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: translate(2px,0px);
|
||||
-moz-transform: translate(2px,0px);
|
||||
-ms-transform: translate(2px,0px);
|
||||
transform: translate(2px,0px);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translate(0px,0px);
|
||||
-moz-transform: translate(0px,0px);
|
||||
-ms-transform: translate(0px,0px);
|
||||
transform: translate(0px,0px);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-cloud-2 {
|
||||
-webkit-animation-name: am-weather-cloud-2;
|
||||
-moz-animation-name: am-weather-cloud-2;
|
||||
animation-name: am-weather-cloud-2;
|
||||
-webkit-animation-duration: 3s;
|
||||
-moz-animation-duration: 3s;
|
||||
animation-duration: 3s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** SUN
|
||||
*/
|
||||
@keyframes am-weather-sun {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun {
|
||||
-webkit-animation-name: am-weather-sun;
|
||||
-moz-animation-name: am-weather-sun;
|
||||
-ms-animation-name: am-weather-sun;
|
||||
animation-name: am-weather-sun;
|
||||
-webkit-animation-duration: 9s;
|
||||
-moz-animation-duration: 9s;
|
||||
-ms-animation-duration: 9s;
|
||||
animation-duration: 9s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes am-weather-sun-shiny {
|
||||
0% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
|
||||
50% {
|
||||
stroke-dasharray: 0.1px 10px;
|
||||
stroke-dashoffset: -1px;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dasharray: 3px 10px;
|
||||
stroke-dashoffset: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-sun-shiny line {
|
||||
-webkit-animation-name: am-weather-sun-shiny;
|
||||
-moz-animation-name: am-weather-sun-shiny;
|
||||
-ms-animation-name: am-weather-sun-shiny;
|
||||
animation-name: am-weather-sun-shiny;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
** MOON
|
||||
*/
|
||||
@keyframes am-weather-moon {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(15deg);
|
||||
-moz-transform: rotate(15deg);
|
||||
-ms-transform: rotate(15deg);
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon {
|
||||
-webkit-animation-name: am-weather-moon;
|
||||
-moz-animation-name: am-weather-moon;
|
||||
-ms-animation-name: am-weather-moon;
|
||||
animation-name: am-weather-moon;
|
||||
-webkit-animation-duration: 6s;
|
||||
-moz-animation-duration: 6s;
|
||||
-ms-animation-duration: 6s;
|
||||
animation-duration: 6s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-moz-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
-ms-transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
transform-origin: 12.5px 15.15px 0; /* TODO FF CENTER ISSUE */
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-1 {
|
||||
-webkit-animation-name: am-weather-moon-star-1;
|
||||
-moz-animation-name: am-weather-moon-star-1;
|
||||
-ms-animation-name: am-weather-moon-star-1;
|
||||
animation-name: am-weather-moon-star-1;
|
||||
-webkit-animation-delay: 3s;
|
||||
-moz-animation-delay: 3s;
|
||||
-ms-animation-delay: 3s;
|
||||
animation-delay: 3s;
|
||||
-webkit-animation-duration: 5s;
|
||||
-moz-animation-duration: 5s;
|
||||
-ms-animation-duration: 5s;
|
||||
animation-duration: 5s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
@keyframes am-weather-moon-star-2 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-moon-star-2 {
|
||||
-webkit-animation-name: am-weather-moon-star-2;
|
||||
-moz-animation-name: am-weather-moon-star-2;
|
||||
-ms-animation-name: am-weather-moon-star-2;
|
||||
animation-name: am-weather-moon-star-2;
|
||||
-webkit-animation-delay: 5s;
|
||||
-moz-animation-delay: 5s;
|
||||
-ms-animation-delay: 5s;
|
||||
animation-delay: 5s;
|
||||
-webkit-animation-duration: 4s;
|
||||
-moz-animation-duration: 4s;
|
||||
-ms-animation-duration: 4s;
|
||||
animation-duration: 4s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
-moz-animation-iteration-count: 1;
|
||||
-ms-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
** RAIN
|
||||
*/
|
||||
@keyframes am-weather-rain {
|
||||
0% {
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
stroke-dashoffset: -100;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-rain-1 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-rain-2 {
|
||||
-webkit-animation-name: am-weather-rain;
|
||||
-moz-animation-name: am-weather-rain;
|
||||
-ms-animation-name: am-weather-rain;
|
||||
animation-name: am-weather-rain;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
-moz-animation-delay: 0.25s;
|
||||
-ms-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation-duration: 8s;
|
||||
-moz-animation-duration: 8s;
|
||||
-ms-animation-duration: 8s;
|
||||
animation-duration: 8s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
** SNOW
|
||||
*/
|
||||
@keyframes am-weather-snow {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(-1.2px) translateY(2px);
|
||||
-moz-transform: translateX(-1.2px) translateY(2px);
|
||||
-ms-transform: translateX(-1.2px) translateY(2px);
|
||||
transform: translateX(-1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(1.4px) translateY(4px);
|
||||
-moz-transform: translateX(1.4px) translateY(4px);
|
||||
-ms-transform: translateX(1.4px) translateY(4px);
|
||||
transform: translateX(1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(-1.6px) translateY(6px);
|
||||
-moz-transform: translateX(-1.6px) translateY(6px);
|
||||
-ms-transform: translateX(-1.6px) translateY(6px);
|
||||
transform: translateX(-1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes am-weather-snow-reverse {
|
||||
0% {
|
||||
-webkit-transform: translateX(0) translateY(0);
|
||||
-moz-transform: translateX(0) translateY(0);
|
||||
-ms-transform: translateX(0) translateY(0);
|
||||
transform: translateX(0) translateY(0);
|
||||
}
|
||||
|
||||
33.33% {
|
||||
-webkit-transform: translateX(1.2px) translateY(2px);
|
||||
-moz-transform: translateX(1.2px) translateY(2px);
|
||||
-ms-transform: translateX(1.2px) translateY(2px);
|
||||
transform: translateX(1.2px) translateY(2px);
|
||||
}
|
||||
|
||||
66.66% {
|
||||
-webkit-transform: translateX(-1.4px) translateY(4px);
|
||||
-moz-transform: translateX(-1.4px) translateY(4px);
|
||||
-ms-transform: translateX(-1.4px) translateY(4px);
|
||||
transform: translateX(-1.4px) translateY(4px);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: translateX(1.6px) translateY(6px);
|
||||
-moz-transform: translateX(1.6px) translateY(6px);
|
||||
-ms-transform: translateX(1.6px) translateY(6px);
|
||||
transform: translateX(1.6px) translateY(6px);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.am-weather-snow-1 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-2 {
|
||||
-webkit-animation-name: am-weather-snow;
|
||||
-moz-animation-name: am-weather-snow;
|
||||
-ms-animation-name: am-weather-snow;
|
||||
animation-name: am-weather-snow;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
-ms-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.am-weather-snow-3 {
|
||||
-webkit-animation-name: am-weather-snow-reverse;
|
||||
-moz-animation-name: am-weather-snow-reverse;
|
||||
-ms-animation-name: am-weather-snow-reverse;
|
||||
animation-name: am-weather-snow-reverse;
|
||||
-webkit-animation-duration: 2s;
|
||||
-moz-animation-duration: 2s;
|
||||
-ms-animation-duration: 2s;
|
||||
animation-duration: 2s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
/*
|
||||
** EASING
|
||||
*/
|
||||
.am-weather-easing-ease-in-out {
|
||||
-webkit-animation-timing-function: ease-in-out;
|
||||
-moz-animation-timing-function: ease-in-out;
|
||||
-ms-animation-timing-function: ease-in-out;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
|
||||
]]></style>
|
||||
</defs>
|
||||
<g
|
||||
filter="url(#blur)"
|
||||
id="cloudy-day-2">
|
||||
<g
|
||||
transform="matrix(1.0657299,0,0,1.0657299,21.854489,7.8028103)"
|
||||
id="g63">
|
||||
<g
|
||||
transform="translate(0,16)"
|
||||
id="g57">
|
||||
<g
|
||||
class="am-weather-sun"
|
||||
id="g53">
|
||||
<g
|
||||
id="g23">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line21" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(45)"
|
||||
id="g27">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line25" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(90)"
|
||||
id="g31">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line29" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(135)"
|
||||
id="g35">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line33" />
|
||||
</g>
|
||||
<g
|
||||
transform="scale(-1)"
|
||||
id="g39">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line37" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-135)"
|
||||
id="g43">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line41" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-90)"
|
||||
id="g47">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line45" />
|
||||
</g>
|
||||
<g
|
||||
transform="rotate(-45)"
|
||||
id="g51">
|
||||
<line
|
||||
fill="none"
|
||||
stroke="#ffa500"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
transform="translate(0,9)"
|
||||
x1="0"
|
||||
x2="0"
|
||||
y1="0"
|
||||
y2="3"
|
||||
id="line49" />
|
||||
</g>
|
||||
</g>
|
||||
<circle
|
||||
cx="0"
|
||||
cy="0"
|
||||
fill="#ffa500"
|
||||
r="5"
|
||||
stroke="#ffa500"
|
||||
stroke-width="2"
|
||||
id="circle55" />
|
||||
</g>
|
||||
<g
|
||||
class="am-weather-cloud-2"
|
||||
id="g61">
|
||||
<path
|
||||
d="m 47.7,35.4 c 0,-4.6 -3.7,-8.2 -8.2,-8.2 -1,0 -1.9,0.2 -2.8,0.5 -0.3,-3.4 -3.1,-6.2 -6.6,-6.2 -3.7,0 -6.7,3 -6.7,6.7 0,0.8 0.2,1.6 0.4,2.3 -0.3,-0.1 -0.7,-0.1 -1,-0.1 -3.7,0 -6.7,3 -6.7,6.7 0,3.6 2.9,6.6 6.5,6.7 h 17.2 c 4.4,-0.5 7.9,-4 7.9,-8.4 z"
|
||||
fill="#91c0f8"
|
||||
stroke="#ffffff"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.2"
|
||||
transform="translate(-20,-11)"
|
||||
id="path59" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="matrix(0.7,0,0,0.7,17.276856,21.305209)"
|
||||
id="g71">
|
||||
<path
|
||||
class="am-weather-cloud-3"
|
||||
d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#ffffff"
|
||||
stroke-width="5.4"
|
||||
stroke-linecap="round"
|
||||
id="path59-2" />
|
||||
<path
|
||||
class="am-weather-cloud-2"
|
||||
d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#ffffff"
|
||||
stroke-width="5.4"
|
||||
stroke-linecap="round"
|
||||
id="path61" />
|
||||
<path
|
||||
class="am-weather-cloud-1"
|
||||
d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5"
|
||||
fill="none"
|
||||
stroke="#ffffff"
|
||||
stroke-width="5.4"
|
||||
stroke-linecap="round"
|
||||
id="path63" />
|
||||
<path
|
||||
class="am-weather-cloud-3"
|
||||
d="m 13,26 h 20 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
id="path65" />
|
||||
<path
|
||||
class="am-weather-cloud-2"
|
||||
d="m 10,32 h 35 a 5,5 0 0 0 0,-10 5,5 0 0 0 -5,5"
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
id="path67" />
|
||||
<path
|
||||
class="am-weather-cloud-1"
|
||||
d="m 16,38 h 22 a 5,5 0 0 1 0,10 5,5 0 0 1 -5,-5"
|
||||
fill="none"
|
||||
stroke="#57a0ee"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
id="path69" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 25 KiB |
+325
@@ -0,0 +1,325 @@
|
||||
const fireEvent = (node, type, detail, options) => {
|
||||
options = options || {};
|
||||
detail = detail === null || detail === undefined ? {} : detail;
|
||||
const event = new Event(type, {
|
||||
bubbles: options.bubbles === undefined ? true : options.bubbles,
|
||||
cancelable: Boolean(options.cancelable),
|
||||
composed: options.composed === undefined ? true : options.composed,
|
||||
});
|
||||
event.detail = detail;
|
||||
node.dispatchEvent(event);
|
||||
return event;
|
||||
};
|
||||
|
||||
if (
|
||||
!customElements.get("ha-switch") &&
|
||||
customElements.get("paper-toggle-button")
|
||||
) {
|
||||
customElements.define("ha-switch", customElements.get("paper-toggle-button"));
|
||||
}
|
||||
|
||||
const LitElement = customElements.get("hui-masonry-view")
|
||||
? Object.getPrototypeOf(customElements.get("hui-masonry-view"))
|
||||
: Object.getPrototypeOf(customElements.get("hui-view"));
|
||||
const html = LitElement.prototype.html;
|
||||
const css = LitElement.prototype.css;
|
||||
|
||||
const HELPERS = window.loadCardHelpers();
|
||||
|
||||
const DefaultSensors = new Map([
|
||||
["cloudCoverEntity", "_cloud_cover"],
|
||||
["rainChanceEntity", "_rain_chance"],
|
||||
["freezeChanceEntity", "_freeze_chance"],
|
||||
["snowChanceEntity", "_snow_chance"],
|
||||
["uvEntity", "_uv"],
|
||||
["rainForecastEntity", "_next_rain"],
|
||||
]);
|
||||
|
||||
export class MeteofranceWeatherCardEditor extends LitElement {
|
||||
setConfig(config) {
|
||||
this._config = { ...config };
|
||||
}
|
||||
|
||||
static get properties() {
|
||||
return { hass: {}, _config: {} };
|
||||
}
|
||||
|
||||
get _entity() {
|
||||
return this._config.entity || "";
|
||||
}
|
||||
|
||||
get _name() {
|
||||
return this._config.name || "";
|
||||
}
|
||||
|
||||
get _icons() {
|
||||
return this._config.icons || "";
|
||||
}
|
||||
|
||||
get _current() {
|
||||
return this._config.current !== false;
|
||||
}
|
||||
|
||||
get _details() {
|
||||
return this._config.details !== false;
|
||||
}
|
||||
|
||||
get _forecast() {
|
||||
return this._config.forecast !== false;
|
||||
}
|
||||
|
||||
get _number_of_forecasts() {
|
||||
return this._config.number_of_forecasts || 5;
|
||||
}
|
||||
|
||||
// Météo France
|
||||
// Switches state
|
||||
get _one_hour_forecast() {
|
||||
return this._config.one_hour_forecast !== false;
|
||||
}
|
||||
|
||||
get _alert_forecast() {
|
||||
return this._config.alert_forecast !== false;
|
||||
}
|
||||
|
||||
get _animated_icons() {
|
||||
return this._config.animated_icons !== false;
|
||||
}
|
||||
|
||||
// Config value
|
||||
get _alertEntity() {
|
||||
return this._config.alertEntity || "";
|
||||
}
|
||||
|
||||
get _cloudCoverEntity() {
|
||||
return this._config.cloudCoverEntity || "";
|
||||
}
|
||||
|
||||
get _freezeChanceEntity() {
|
||||
return this._config.freezeChanceEntity || "";
|
||||
}
|
||||
|
||||
get _rainChanceEntity() {
|
||||
return this._config.rainChanceEntity || "";
|
||||
}
|
||||
|
||||
get _rainForecastEntity() {
|
||||
return this._config.rainForecastEntity || "";
|
||||
}
|
||||
|
||||
get _snowChanceEntity() {
|
||||
return this._config.snowChanceEntity || "";
|
||||
}
|
||||
|
||||
get _uvEntity() {
|
||||
return this._config.uvEntity || "";
|
||||
}
|
||||
|
||||
get _detailEntity() {
|
||||
return this._config.detailEntity || "";
|
||||
}
|
||||
|
||||
firstUpdated() {
|
||||
HELPERS.then((help) => {
|
||||
if (help.importMoreInfoControl) {
|
||||
help.importMoreInfoControl("fan");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
if (!this.hass) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
return html`
|
||||
<div class="card-config">
|
||||
<div>
|
||||
<paper-input
|
||||
label="Name"
|
||||
.value="${this._name}"
|
||||
.configValue="${"name"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
${this.renderSensorPicker(
|
||||
"Détail",
|
||||
this._detailEntity,
|
||||
"detailEntity"
|
||||
)}
|
||||
<paper-input
|
||||
label="Icons location"
|
||||
.value="${this._icons}"
|
||||
.configValue="${"icons"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
<!-- Primary weather entity -->
|
||||
${this.renderWeatherPicker("Entity", this._entity, "entity")}
|
||||
<!-- Switches -->
|
||||
<ul class="switches">
|
||||
${this.renderSwitchOption("Show current", this._current, "current")}
|
||||
${this.renderSwitchOption("Show details", this._details, "details")}
|
||||
${this.renderSwitchOption(
|
||||
"Show one hour forecast",
|
||||
this._one_hour_forecast,
|
||||
"one_hour_forecast"
|
||||
)}
|
||||
${this.renderSwitchOption(
|
||||
"Show alert",
|
||||
this._alert_forecast,
|
||||
"alert_forecast"
|
||||
)}
|
||||
${this.renderSwitchOption(
|
||||
"Show forecast",
|
||||
this._forecast,
|
||||
"forecast"
|
||||
)}
|
||||
${this.renderSwitchOption(
|
||||
"Use animated icons",
|
||||
this._animated_icons,
|
||||
"animated_icons"
|
||||
)}
|
||||
</ul>
|
||||
<!-- -->
|
||||
<paper-input
|
||||
label="Number of future forcasts"
|
||||
type="number"
|
||||
min="1"
|
||||
max="8"
|
||||
value=${this._number_of_forecasts}
|
||||
.configValue="${"number_of_forecasts"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
<!-- Meteo France weather entities -->
|
||||
${this.renderSensorPicker(
|
||||
"Risque de pluie",
|
||||
this._rainChanceEntity,
|
||||
"rainChanceEntity"
|
||||
)}
|
||||
${this.renderSensorPicker("UV", this._uvEntity, "uvEntity")}
|
||||
${this.renderSensorPicker(
|
||||
"Couverture nuageuse",
|
||||
this._cloudCoverEntity,
|
||||
"cloudCoverEntity"
|
||||
)}
|
||||
${this.renderSensorPicker(
|
||||
"Risque de gel",
|
||||
this._freezeChanceEntity,
|
||||
"freezeChanceEntity"
|
||||
)}
|
||||
${this.renderSensorPicker(
|
||||
"Risque de neige",
|
||||
this._snowChanceEntity,
|
||||
"snowChanceEntity"
|
||||
)}
|
||||
${this.renderSensorPicker(
|
||||
"Vigilance Météo",
|
||||
this._alertEntity,
|
||||
"alertEntity"
|
||||
)}
|
||||
${this.renderSensorPicker(
|
||||
"Pluie dans l'heure",
|
||||
this._rainForecastEntity,
|
||||
"rainForecastEntity"
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
renderWeatherPicker(label, entity, configAttr) {
|
||||
return this.renderPicker(label, entity, configAttr, "weather");
|
||||
}
|
||||
|
||||
renderSensorPicker(label, entity, configAttr) {
|
||||
return this.renderPicker(label, entity, configAttr, "sensor");
|
||||
}
|
||||
|
||||
renderPicker(label, entity, configAttr, domain) {
|
||||
return html`
|
||||
<ha-entity-picker
|
||||
label="${label}"
|
||||
.hass="${this.hass}"
|
||||
.value="${entity}"
|
||||
.configValue="${configAttr}"
|
||||
.includeDomains="${domain}"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`;
|
||||
}
|
||||
|
||||
renderSwitchOption(label, state, configAttr) {
|
||||
return html`
|
||||
<li class="switch">
|
||||
<ha-switch
|
||||
.checked=${state}
|
||||
.configValue="${configAttr}"
|
||||
@change="${this._valueChanged}"
|
||||
></ha-switch
|
||||
><span>${label}</span>
|
||||
</div>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
_weatherEntityChanged(entityName) {
|
||||
DefaultSensors.forEach((sensorSuffix, configAttribute) => {
|
||||
const entity = "sensor." + entityName + sensorSuffix;
|
||||
if (this.hass.states[entity] !== undefined)
|
||||
this._config = {
|
||||
...this._config,
|
||||
[configAttribute]: entity,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
_valueChanged(ev) {
|
||||
if (!this._config || !this.hass) {
|
||||
return;
|
||||
}
|
||||
const target = ev.target;
|
||||
if (this[`_${target.configValue}`] === target.value) {
|
||||
return;
|
||||
}
|
||||
if (target.configValue) {
|
||||
if (target.value === "") {
|
||||
delete this._config[target.configValue];
|
||||
} else {
|
||||
if (target.configValue === "entity")
|
||||
this._weatherEntityChanged(target.value.split(".")[1]);
|
||||
this._config = {
|
||||
...this._config,
|
||||
[target.configValue]:
|
||||
target.checked !== undefined ? target.checked : target.value,
|
||||
};
|
||||
}
|
||||
}
|
||||
fireEvent(this, "config-changed", { config: this._config });
|
||||
}
|
||||
|
||||
static get styles() {
|
||||
return css`
|
||||
.switches {
|
||||
margin: 8px 0;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
.switch {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 50%;
|
||||
height: 40px;
|
||||
}
|
||||
.switches span {
|
||||
padding: 0 16px;
|
||||
}
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define(
|
||||
"meteofrance-weather-card-editor",
|
||||
MeteofranceWeatherCardEditor
|
||||
);
|
||||
@@ -0,0 +1,978 @@
|
||||
const LitElement = customElements.get("hui-masonry-view")
|
||||
? Object.getPrototypeOf(customElements.get("hui-masonry-view"))
|
||||
: Object.getPrototypeOf(customElements.get("hui-view"));
|
||||
const html = LitElement.prototype.html;
|
||||
const css = LitElement.prototype.css;
|
||||
|
||||
const weatherIconsDay = {
|
||||
clear: "day",
|
||||
"clear-night": "night",
|
||||
cloudy: "cloudy",
|
||||
fog: "fog",
|
||||
hail: "rainy-7",
|
||||
lightning: "thunder",
|
||||
"lightning-rainy": "lightning-rainy",
|
||||
partlycloudy: "cloudy-day-3",
|
||||
pouring: "rainy-6",
|
||||
rainy: "rainy-5",
|
||||
snowy: "snowy-6",
|
||||
"snowy-rainy": "snowy-rainy",
|
||||
sunny: "day",
|
||||
windy: "windy",
|
||||
"windy-variant": "windy",
|
||||
exceptional: "!!",
|
||||
};
|
||||
|
||||
const DefaultSensors = [
|
||||
["cloudCoverEntity", "_cloud_cover"],
|
||||
["rainChanceEntity", "_rain_chance"],
|
||||
["freezeChanceEntity", "_freeze_chance"],
|
||||
["snowChanceEntity", "_snow_chance"],
|
||||
["uvEntity", "_uv"],
|
||||
["rainForecastEntity", "_next_rain"],
|
||||
];
|
||||
|
||||
const weatherIconsNight = {
|
||||
...weatherIconsDay,
|
||||
clear: "night",
|
||||
sunny: "night",
|
||||
partlycloudy: "cloudy-night-3",
|
||||
};
|
||||
|
||||
const windDirections = [
|
||||
"N",
|
||||
"NNE",
|
||||
"NE",
|
||||
"ENE",
|
||||
"E",
|
||||
"ESE",
|
||||
"SE",
|
||||
"SSE",
|
||||
"S",
|
||||
"SSO",
|
||||
"SO",
|
||||
"OSO",
|
||||
"O",
|
||||
"ONO",
|
||||
"NO",
|
||||
"NNO",
|
||||
"N",
|
||||
];
|
||||
|
||||
const phenomenaText = {
|
||||
clear: "Ciel dégagé",
|
||||
"clear-night": "Nuit claire",
|
||||
cloudy: "Nuageux",
|
||||
fog: "Brouillard",
|
||||
hail: "Risque de grèle",
|
||||
lightning: "Orages",
|
||||
"lightning-rainy": "Pluies orageuses",
|
||||
partlycloudy: "Eclaircies",
|
||||
pouring: "Pluie forte",
|
||||
rainy: "Pluie",
|
||||
snowy: "Neige",
|
||||
"snowy-rainy": "Pluie verglaçante",
|
||||
sunny: "Ensoleillé",
|
||||
windy: "Venteux",
|
||||
"windy-variant": "Venteux variable",
|
||||
exceptional: "Exceptionnel",
|
||||
};
|
||||
|
||||
const phenomenaNightText = {
|
||||
...phenomenaText,
|
||||
sunny: "Nuit claire",
|
||||
};
|
||||
|
||||
const rainForecastValues = new Map([
|
||||
["Pas de valeur", 0.1],
|
||||
["Temps sec", 0.1],
|
||||
["Pluie faible", 0.4],
|
||||
["Pluie modérée", 0.7],
|
||||
["Pluie forte", 1],
|
||||
]);
|
||||
|
||||
window.customCards = window.customCards || [];
|
||||
window.customCards.push({
|
||||
type: "meteofrance-weather-card",
|
||||
name: "Carte Météo France par HACF",
|
||||
description: "Carte pour l'intégration Météo France.",
|
||||
preview: true,
|
||||
documentationURL:
|
||||
"https://github.com/hacf-fr/lovelace-meteofrance-weather-card",
|
||||
});
|
||||
|
||||
const fireEvent = (node, type, detail, options) => {
|
||||
options = options || {};
|
||||
detail = detail === null || detail === undefined ? {} : detail;
|
||||
const event = new Event(type, {
|
||||
bubbles: options.bubbles === undefined ? true : options.bubbles,
|
||||
cancelable: Boolean(options.cancelable),
|
||||
composed: options.composed === undefined ? true : options.composed,
|
||||
});
|
||||
event.detail = detail;
|
||||
node.dispatchEvent(event);
|
||||
return event;
|
||||
};
|
||||
|
||||
function hasConfigOrEntityChanged(element, changedProps) {
|
||||
if (changedProps.has("_config")) {
|
||||
return true;
|
||||
}
|
||||
|
||||
const oldHass = changedProps.get("hass");
|
||||
if (oldHass) {
|
||||
const entityName = element._config.entity.split(".")[1];
|
||||
return (
|
||||
oldHass.states[element._config.entity] !==
|
||||
element.hass.states[element._config.entity] ||
|
||||
oldHass.states["sun.sun"] !== element.hass.states["sun.sun"] ||
|
||||
!DefaultSensors.every((sensor) => {
|
||||
const sensorName = "sensor." + entityName + sensor[1];
|
||||
oldHass.states[sensorName] == element.hass.states[sensorName];
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
class MeteofranceWeatherCard extends LitElement {
|
||||
static get properties() {
|
||||
return {
|
||||
_config: {},
|
||||
hass: {},
|
||||
};
|
||||
}
|
||||
|
||||
static async getConfigElement() {
|
||||
await import("./meteofrance-weather-card-editor.js");
|
||||
return document.createElement("meteofrance-weather-card-editor");
|
||||
}
|
||||
|
||||
static getStubConfig(hass, unusedEntities, allEntities) {
|
||||
let entity = this.getDefaultWeatherEntity(unusedEntities, allEntities);
|
||||
let entities = { entity };
|
||||
|
||||
if (entity) {
|
||||
let sensors = this.getWeatherEntitiesFromEntity(
|
||||
hass,
|
||||
entity.split(".")[1],
|
||||
allEntities
|
||||
);
|
||||
entities = {
|
||||
...entities,
|
||||
...sensors,
|
||||
};
|
||||
}
|
||||
return entities;
|
||||
}
|
||||
|
||||
static getDefaultWeatherEntity(unusedEntities, allEntities) {
|
||||
let entity = unusedEntities.find((eid) => eid.split(".")[0] === "weather");
|
||||
if (!entity) {
|
||||
entity = allEntities.find((eid) => eid.split(".")[0] === "weather");
|
||||
}
|
||||
return entity;
|
||||
}
|
||||
|
||||
static getWeatherEntitiesFromEntity(hass, entityName, allEntities) {
|
||||
let entities = {};
|
||||
DefaultSensors.forEach((sensor) => {
|
||||
const sensorName = "sensor." + entityName + sensor[0];
|
||||
if (hass.states[sensorName] !== undefined) {
|
||||
let sensor = allEntities[sensorName];
|
||||
if (!sensor) {
|
||||
entities = {
|
||||
...entities,
|
||||
[sensor[1]]: sensorName,
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
return entities;
|
||||
}
|
||||
|
||||
setConfig(config) {
|
||||
if (!config.entity) {
|
||||
throw new Error("Please define a weather entity");
|
||||
}
|
||||
this._config = config;
|
||||
}
|
||||
|
||||
shouldUpdate(changedProps) {
|
||||
return hasConfigOrEntityChanged(this, changedProps);
|
||||
}
|
||||
|
||||
isSelected(option) {
|
||||
return option === undefined || option === true;
|
||||
}
|
||||
|
||||
render() {
|
||||
if (!this._config || !this.hass) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
this.numberElements = 0;
|
||||
|
||||
const stateObj = this.hass.states[this._config.entity];
|
||||
|
||||
if (!stateObj) {
|
||||
return html`
|
||||
<style>
|
||||
.not-found {
|
||||
flex: 1;
|
||||
background-color: yellow;
|
||||
padding: 8px;
|
||||
}
|
||||
</style>
|
||||
<ha-card>
|
||||
<div class="not-found">
|
||||
Entity not available: ${this._config.entity}
|
||||
</div>
|
||||
</ha-card>
|
||||
`;
|
||||
}
|
||||
|
||||
return html`
|
||||
<ha-card @click="${this._handleClick}">
|
||||
${this.isSelected(this._config.current)
|
||||
? this.renderCurrent(stateObj)
|
||||
: ""}
|
||||
${this.isSelected(this._config.details)
|
||||
? this.renderDetails(stateObj)
|
||||
: ""}
|
||||
${this.isSelected(this._config.alert_forecast)
|
||||
? this.renderAlertForecast()
|
||||
: ""}
|
||||
${this.isSelected(this._config.one_hour_forecast)
|
||||
? this.renderOneHourForecast()
|
||||
: ""}
|
||||
${this.isSelected(this._config.forecast)
|
||||
? this.renderForecast(stateObj.attributes.forecast)
|
||||
: ""}
|
||||
</ha-card>
|
||||
`;
|
||||
}
|
||||
|
||||
renderCurrent(stateObj) {
|
||||
this.numberElements++;
|
||||
return html`
|
||||
<ul class="flow-row current">
|
||||
<li
|
||||
style="background: none, url('${this.getWeatherIcon(
|
||||
stateObj.state.toLowerCase(),
|
||||
this.isNightTime()
|
||||
)}') no-repeat; background-size: contain;"
|
||||
></li>
|
||||
<li>
|
||||
${this.getPhenomenaText(stateObj.state, this.isNightTime())}
|
||||
${this._config.name ? html` <div>${this._config.name}</div>` : ""}
|
||||
</li>
|
||||
<li>
|
||||
${this.getUnit("temperature") == "°F"
|
||||
? Math.round(stateObj.attributes.temperature)
|
||||
: stateObj.attributes.temperature}
|
||||
<sup>${this.getUnit("temperature")}</sup>
|
||||
<ul>
|
||||
${this.renderMeteoFranceDetail(
|
||||
this.hass.states[this._config.detailEntity]
|
||||
)}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
`;
|
||||
}
|
||||
|
||||
renderDetails(stateObj) {
|
||||
const sun = this.hass.states["sun.sun"];
|
||||
let next_rising;
|
||||
let next_setting;
|
||||
|
||||
if (sun) {
|
||||
next_rising = new Date(sun.attributes.next_rising);
|
||||
next_setting = new Date(sun.attributes.next_setting);
|
||||
}
|
||||
|
||||
this.numberElements++;
|
||||
|
||||
return html`
|
||||
<ul class="flow-row details ${this.numberElements > 1 ? " spacer" : ""}">
|
||||
<!-- Cloudy -->
|
||||
${this.renderMeteoFranceDetail(
|
||||
this.hass.states[this._config.cloudCoverEntity]
|
||||
)}
|
||||
<!-- Wind -->
|
||||
${this.renderDetail(
|
||||
(stateObj.attributes.wind_bearing == undefined
|
||||
? " "
|
||||
: windDirections[
|
||||
parseInt((stateObj.attributes.wind_bearing + 11.25) / 22.5)
|
||||
] + " ") + stateObj.attributes.wind_speed,
|
||||
"Vent",
|
||||
"mdi:weather-windy",
|
||||
this.getUnit("speed")
|
||||
)}
|
||||
<!-- Rain -->
|
||||
${this.renderMeteoFranceDetail(
|
||||
this.hass.states[this._config.rainChanceEntity]
|
||||
)}
|
||||
<!-- Humidity -->
|
||||
${this.renderDetail(
|
||||
stateObj.attributes.humidity,
|
||||
"Humidité",
|
||||
"mdi:water-percent",
|
||||
"%"
|
||||
)}
|
||||
<!-- Freeze -->
|
||||
${this.renderMeteoFranceDetail(
|
||||
this.hass.states[this._config.freezeChanceEntity]
|
||||
)}
|
||||
<!-- Pressure -->
|
||||
${this.renderDetail(
|
||||
stateObj.attributes.pressure,
|
||||
"Pression atmosphérique",
|
||||
"mdi:gauge",
|
||||
this.getUnit("air_pressure")
|
||||
)}
|
||||
<!-- Snow -->
|
||||
${this.renderMeteoFranceDetail(
|
||||
this.hass.states[this._config.snowChanceEntity]
|
||||
)}
|
||||
<!-- UV -->
|
||||
${this.renderMeteoFranceDetail(this.hass.states[this._config.uvEntity])}
|
||||
</ul>
|
||||
<ul class="flow-row details">
|
||||
<!-- Sunset up -->
|
||||
${next_rising
|
||||
? this.renderDetail(
|
||||
next_rising.toLocaleTimeString(),
|
||||
"Heure de lever",
|
||||
"mdi:weather-sunset-up"
|
||||
)
|
||||
: ""}
|
||||
<!-- Sunset down -->
|
||||
${next_setting
|
||||
? this.renderDetail(
|
||||
next_setting.toLocaleTimeString(),
|
||||
"Heure de coucher",
|
||||
"mdi:weather-sunset-down"
|
||||
)
|
||||
: ""}
|
||||
</ul>
|
||||
`;
|
||||
}
|
||||
|
||||
renderMeteoFranceDetail(entity) {
|
||||
return entity !== undefined
|
||||
? this.renderDetail(
|
||||
entity.state,
|
||||
entity.attributes.friendly_name,
|
||||
entity.attributes.icon,
|
||||
entity.attributes.unit_of_measurement
|
||||
)
|
||||
: "";
|
||||
}
|
||||
|
||||
renderDetail(state, label, icon, unit) {
|
||||
return html`
|
||||
<li>
|
||||
<ha-icon icon="${icon}" title="${label}"></ha-icon>
|
||||
${state} ${unit ? html`${unit}` : ""}
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
renderOneHourForecast() {
|
||||
const rainForecast = this.hass.states[this._config.rainForecastEntity];
|
||||
|
||||
if (!rainForecast || rainForecast.length === 0) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
this.numberElements++;
|
||||
|
||||
let [startTime, endTime] = this.getOneHourForecastTime(rainForecast);
|
||||
|
||||
return html` <ul
|
||||
class="flow-row oneHourHeader ${this.numberElements > 1
|
||||
? " spacer"
|
||||
: ""}"
|
||||
>
|
||||
<li>${startTime}</li>
|
||||
<li>${this.getOneHourNextRainText(rainForecast)}</li>
|
||||
<li>${endTime}</li>
|
||||
</ul>
|
||||
<ul class="flow-row oneHour">
|
||||
${html`
|
||||
${this.getOneHourForecast(rainForecast).map(
|
||||
(forecast) => html` <li
|
||||
class="rain-${forecast[0]}min"
|
||||
style="opacity: ${forecast[1]}"
|
||||
title="${forecast[2]}"
|
||||
></li>`
|
||||
)}
|
||||
`}
|
||||
</ul>
|
||||
<ul class="flow-row oneHourLabel">
|
||||
<li></li>
|
||||
<li>10</li>
|
||||
<li>20</li>
|
||||
<li>30</li>
|
||||
<li>40</li>
|
||||
<li>50</li>
|
||||
</ul>`;
|
||||
}
|
||||
|
||||
renderAlertForecast() {
|
||||
const alertForecast = this.hass.states[this._config.alertEntity];
|
||||
|
||||
if (!alertForecast) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
const alerts = this.getAlertForecast(alertForecast);
|
||||
|
||||
if (alerts.length == 0) return html``;
|
||||
|
||||
this.numberElements++;
|
||||
|
||||
return html` <div
|
||||
class="flow-row alertForecast ${this.numberElements > 1 ? " spacer" : ""}"
|
||||
>
|
||||
${alerts.map(
|
||||
(phenomenon) => html` <div class="alertForecast${phenomenon.color}">
|
||||
<ha-icon
|
||||
icon="${phenomenon.icon}"
|
||||
title="${phenomenon.name}"
|
||||
></ha-icon>
|
||||
</div>`
|
||||
)}
|
||||
</div>`;
|
||||
}
|
||||
|
||||
renderForecast(forecast) {
|
||||
if (!forecast || forecast.length === 0) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
const lang = this.hass.selectedLanguage || this.hass.language;
|
||||
const isDaily = this.isDailyForecast(forecast);
|
||||
|
||||
this.numberElements++;
|
||||
return html` <ul
|
||||
class="flow-row forecast ${this.numberElements > 1 ? " spacer" : ""}"
|
||||
>
|
||||
${forecast
|
||||
.slice(
|
||||
0,
|
||||
this._config.number_of_forecasts
|
||||
? this._config.number_of_forecasts
|
||||
: 5
|
||||
)
|
||||
.map((daily) => this.renderDailyForecast(daily, lang, isDaily))}
|
||||
</ul>`;
|
||||
}
|
||||
|
||||
renderDailyForecast(daily, lang, isDaily) {
|
||||
return html` <li>
|
||||
<ul class="flow-column day">
|
||||
<li>
|
||||
${isDaily
|
||||
? new Date(daily.datetime).toLocaleDateString(lang, {
|
||||
weekday: "short",
|
||||
})
|
||||
: new Date(daily.datetime).toLocaleTimeString(lang, {
|
||||
hour: "2-digit",
|
||||
minute: "2-digit",
|
||||
})}
|
||||
</li>
|
||||
<li
|
||||
class="icon"
|
||||
style="background: none, url('${this.getWeatherIcon(
|
||||
daily.condition.toLowerCase(),
|
||||
!isDaily && this.isNightTime(daily.datetime)
|
||||
)}') no-repeat; background-size: contain"
|
||||
></li>
|
||||
<li class="highTemp">
|
||||
${daily.temperature}${this.getUnit("temperature")}
|
||||
</li>
|
||||
${daily.templow !== undefined
|
||||
? html`
|
||||
<li class="lowTemp">
|
||||
${daily.templow}${this.getUnit("temperature")}
|
||||
</li>
|
||||
`
|
||||
: ""}
|
||||
${!this._config.hide_precipitation &&
|
||||
daily.precipitation !== undefined &&
|
||||
daily.precipitation !== null
|
||||
? html`
|
||||
<li class="precipitation">
|
||||
${Math.round(daily.precipitation * 10) / 10}
|
||||
${this.getUnit("precipitation")}
|
||||
</li>
|
||||
`
|
||||
: ""}
|
||||
${!this._config.hide_precipitation &&
|
||||
daily.precipitation_probability !== undefined &&
|
||||
daily.precipitation_probability !== null
|
||||
? html`
|
||||
<li class="precipitation_probability">
|
||||
${Math.round(daily.precipitation_probability)}
|
||||
${this.getUnit("precipitation_probability")}
|
||||
</li>
|
||||
`
|
||||
: ""}
|
||||
${daily.wind_speed !== undefined && daily.wind_speed !== null
|
||||
? html`
|
||||
<li class="wind_speed">
|
||||
${Math.round(daily.wind_speed)} ${this.getUnit("speed")}
|
||||
</li>
|
||||
`
|
||||
: ""}
|
||||
</ul>
|
||||
</li>`;
|
||||
}
|
||||
|
||||
isDailyForecast(forecast) {
|
||||
const diff =
|
||||
new Date(forecast[1].datetime) - new Date(forecast[0].datetime);
|
||||
return diff > 3600000;
|
||||
}
|
||||
|
||||
isNightTime(datetimehourly) {
|
||||
const sun = this.hass.states["sun.sun"];
|
||||
if (!sun) {
|
||||
return false;
|
||||
}
|
||||
|
||||
let nextrising = new Date(sun.attributes.next_rising);
|
||||
let nextsetting = new Date(sun.attributes.next_setting);
|
||||
|
||||
const thistime = datetimehourly ? new Date(datetimehourly) : new Date();
|
||||
|
||||
return (
|
||||
(thistime > nextsetting && thistime < nextrising) ||
|
||||
(thistime < nextsetting &&
|
||||
thistime < nextrising &&
|
||||
nextrising < nextsetting)
|
||||
);
|
||||
}
|
||||
|
||||
getOneHourForecast(rainForecastEntity) {
|
||||
let rainForecastList = [];
|
||||
for (let [time, value] of Object.entries(
|
||||
rainForecastEntity.attributes["1_hour_forecast"]
|
||||
)) {
|
||||
if (time != undefined && time.match(/[0-9]*min/g)) {
|
||||
time = time.replace("min", "").trim();
|
||||
rainForecastList.push([time, rainForecastValues.get(value), value]);
|
||||
}
|
||||
}
|
||||
|
||||
return rainForecastList;
|
||||
}
|
||||
|
||||
getOneHourForecastTime(rainForecastEntity) {
|
||||
let rainForecastTimeRef = new Date(
|
||||
rainForecastEntity.attributes["forecast_time_ref"]
|
||||
);
|
||||
let rainForecastStartTime = rainForecastTimeRef.toLocaleTimeString([], {
|
||||
hour: "2-digit",
|
||||
minute: "2-digit",
|
||||
});
|
||||
rainForecastTimeRef.setHours(rainForecastTimeRef.getHours() + 1);
|
||||
let rainForecastEndTime = rainForecastTimeRef.toLocaleTimeString([], {
|
||||
hour: "2-digit",
|
||||
minute: "2-digit",
|
||||
});
|
||||
|
||||
return [rainForecastStartTime, rainForecastEndTime];
|
||||
}
|
||||
|
||||
getOneHourNextRainText(rainForecastEntity) {
|
||||
for (let [time, value] of Object.entries(
|
||||
rainForecastEntity.attributes["1_hour_forecast"]
|
||||
)) {
|
||||
if (time != undefined && rainForecastValues.get(value) > 0.1) {
|
||||
let timeStr = time.replace(/([345])5/g, "$10");
|
||||
return (
|
||||
value +
|
||||
(time == "0 min" ? " actuellement." : " dans " + timeStr + ".")
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
return "Pas de pluie dans l'heure.";
|
||||
}
|
||||
|
||||
getAlertForecast(alertEntity) {
|
||||
let phenomenaList = [];
|
||||
|
||||
if (alertEntity == undefined) {
|
||||
return [];
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertVentViolent &&
|
||||
alertEntity.attributes["Vent violent"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Vent violent",
|
||||
icon: "mdi:weather-windy",
|
||||
color: alertEntity.attributes["Vent violent"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertPluieInondation &&
|
||||
alertEntity.attributes["Pluie-inondation"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Pluie-inondation",
|
||||
icon: "mdi:weather-pouring",
|
||||
color: alertEntity.attributes["Pluie-inondation"],
|
||||
});
|
||||
}
|
||||
|
||||
if (!this._config.hide_alertOrages && alertEntity.attributes["Orages"]) {
|
||||
phenomenaList.push({
|
||||
name: "Orages",
|
||||
icon: "mdi:weather-lightning",
|
||||
color: alertEntity.attributes["Orages"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertInondation &&
|
||||
alertEntity.attributes["Inondation"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Inondation",
|
||||
icon: "mdi:home-flood",
|
||||
color: alertEntity.attributes["Inondation"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertNeigeVerglas &&
|
||||
alertEntity.attributes["Neige-verglas"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Neige-verglas",
|
||||
icon: "mdi:weather-snowy-heavy",
|
||||
color: alertEntity.attributes["Neige-verglas"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertCanicule &&
|
||||
alertEntity.attributes["Canicule"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Canicule",
|
||||
icon: "mdi:weather-sunny-alert",
|
||||
color: alertEntity.attributes["Canicule"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertGrandFroid &&
|
||||
alertEntity.attributes["Grand-froid"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Grand-froid",
|
||||
icon: "mdi:snowflake",
|
||||
color: alertEntity.attributes["Grand-froid"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertAvalanches &&
|
||||
alertEntity.attributes["Avalanches"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Avalanches",
|
||||
icon: "mdi:image-filter-hdr",
|
||||
color: alertEntity.attributes["Avalanches"],
|
||||
});
|
||||
}
|
||||
|
||||
if (
|
||||
!this._config.hide_alertVaguesSubmersion &&
|
||||
alertEntity.attributes["Vagues-submersion"]
|
||||
) {
|
||||
phenomenaList.push({
|
||||
name: "Vagues-submersion",
|
||||
icon: "mdi:waves",
|
||||
color: alertEntity.attributes["Vagues-submersion"],
|
||||
});
|
||||
}
|
||||
|
||||
return phenomenaList;
|
||||
}
|
||||
|
||||
getWeatherIcon(condition, isNight) {
|
||||
return `${
|
||||
this._config.icons
|
||||
? this._config.icons
|
||||
: "/local/community/lovelace-meteofrance-weather-card/icons/"
|
||||
}${isNight ? weatherIconsNight[condition] : weatherIconsDay[condition]}${
|
||||
this.isSelected(this._config.animated_icons) ? "" : "-static"
|
||||
}.svg`;
|
||||
}
|
||||
|
||||
getPhenomenaText(phenomena, isNight) {
|
||||
return `${
|
||||
isNight ? phenomenaNightText[phenomena] : phenomenaText[phenomena]
|
||||
}`;
|
||||
}
|
||||
|
||||
getUnit(measure) {
|
||||
const lengthUnit = this.hass.config.unit_system.length;
|
||||
switch (measure) {
|
||||
case "air_pressure":
|
||||
return lengthUnit === "km" ? "hPa" : "inHg";
|
||||
case "length":
|
||||
return lengthUnit;
|
||||
case "precipitation":
|
||||
return lengthUnit === "km" ? "mm" : "in";
|
||||
case "precipitation_probability":
|
||||
return "%";
|
||||
case "speed":
|
||||
return lengthUnit === "km" ? "km/h" : "mph";
|
||||
default:
|
||||
return this.hass.config.unit_system[measure] || "";
|
||||
}
|
||||
}
|
||||
|
||||
_handleClick() {
|
||||
fireEvent(this, "hass-more-info", { entityId: this._config.entity });
|
||||
}
|
||||
|
||||
getCardSize() {
|
||||
return 3;
|
||||
}
|
||||
|
||||
static get styles() {
|
||||
return css`
|
||||
ha-card {
|
||||
cursor: pointer;
|
||||
margin: auto;
|
||||
overflow: hidden;
|
||||
padding: 0.5em 1em;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
ha-card ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.flow-row {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
|
||||
.flow-column {
|
||||
display: flex;
|
||||
flex-flow: column wrap;
|
||||
}
|
||||
|
||||
.ha-icon {
|
||||
height: 0.8em;
|
||||
margin-right: 5px;
|
||||
color: var(--paper-item-icon-color);
|
||||
}
|
||||
|
||||
/* Current Forecast */
|
||||
.current {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.current > *:first-child {
|
||||
min-width: 100px;
|
||||
height: 100px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.current > *:last-child {
|
||||
margin-left: auto;
|
||||
min-width: max-content;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.current > *:last-child sup {
|
||||
font-size: initial;
|
||||
}
|
||||
|
||||
.current > li {
|
||||
font-size: 2em;
|
||||
line-height: 1.2;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.current > li > *:last-child {
|
||||
line-height: 1;
|
||||
font-size: 0.6em;
|
||||
color: var(--secondary-text-color);
|
||||
}
|
||||
|
||||
/* Details */
|
||||
.details {
|
||||
justify-content: space-between;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.details ha-icon {
|
||||
height: 22px;
|
||||
margin-right: 5px;
|
||||
color: var(--paper-item-icon-color);
|
||||
}
|
||||
|
||||
.details > li {
|
||||
flex-basis: auto;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.details > li:nth-child(2n) {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.details > li:nth-child(2n) ha-icon {
|
||||
margin-right: 0;
|
||||
margin-left: 8px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* One Hour Forecast */
|
||||
.oneHour {
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.oneHour > li {
|
||||
background-color: var(--paper-item-icon-color);
|
||||
border-right: 1px solid
|
||||
var(--lovelace-background, var(--primary-background-color));
|
||||
}
|
||||
|
||||
.oneHour > li:first-child {
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
}
|
||||
|
||||
.oneHour > li:last-child {
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* One Hour Labels */
|
||||
.rain-0min,
|
||||
.rain-5min,
|
||||
.rain-10min,
|
||||
.rain-15min,
|
||||
.rain-20min,
|
||||
.rain-25min {
|
||||
flex: 1 1 0;
|
||||
}
|
||||
|
||||
.rain-35min,
|
||||
.rain-45min,
|
||||
.rain-55min {
|
||||
flex: 2 1 0;
|
||||
}
|
||||
|
||||
.oneHourLabel > li {
|
||||
flex: 1 1 0;
|
||||
}
|
||||
|
||||
/* One Hour Header */
|
||||
.oneHourHeader {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.oneHourHeader li:last-child {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* Alert */
|
||||
.alertForecast {
|
||||
text-align: center;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.alertForecast > div {
|
||||
flex: 1;
|
||||
color: var(--paper-item-icon-color);
|
||||
color: grey;
|
||||
border: 0;
|
||||
border-radius: 5px;
|
||||
margin-left: 1px;
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.alertForecastVert {
|
||||
}
|
||||
|
||||
.alertForecastJaune {
|
||||
background-color: yellow;
|
||||
}
|
||||
|
||||
.alertForecastOrange {
|
||||
background-color: orange;
|
||||
}
|
||||
|
||||
.alertForecastRouge {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
/* Forecast */
|
||||
.forecast {
|
||||
justify-content: space-between;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.forecast > li {
|
||||
flex: 1;
|
||||
border-right: 0.1em solid #d9d9d9;
|
||||
}
|
||||
|
||||
.forecast > *:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.forecast ul.day {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.forecast ul.day > *:first-child {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.forecast ul.day .highTemp {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.forecast ul.day .lowTemp {
|
||||
color: var(--secondary-text-color);
|
||||
}
|
||||
|
||||
.forecast ul.day .icon {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
`;
|
||||
}
|
||||
}
|
||||
customElements.define("meteofrance-weather-card", MeteofranceWeatherCard);
|
||||
File diff suppressed because one or more lines are too long
+418
@@ -0,0 +1,418 @@
|
||||
console.info(`%c TEMPOMETER-CARD \n%c v1.4-beta.1`, 'color: orange; font-weight: bold; background: black', 'color: white; font-weight: bold; background: dimgray');
|
||||
class TempometerGaugeCard extends HTMLElement {
|
||||
constructor() {
|
||||
super();
|
||||
this.attachShadow({ mode: 'open' });
|
||||
}
|
||||
setConfig(config) {
|
||||
if (!config.entity) {
|
||||
throw new Error('Please define an entity');
|
||||
}
|
||||
if (config.max == null) {
|
||||
throw new Error('Please define the max config option');
|
||||
}
|
||||
if (config.min == null) {
|
||||
throw new Error('Please define the min config option');
|
||||
}
|
||||
|
||||
const root = this.shadowRoot;
|
||||
if (root.lastChild) root.removeChild(root.lastChild);
|
||||
|
||||
const cardConfig = Object.assign({}, config);
|
||||
if (!cardConfig.scale) cardConfig.scale = "50px";
|
||||
|
||||
if (config.horizontal) {
|
||||
cardConfig.scale = "40px";
|
||||
}
|
||||
|
||||
const entityParts = this._splitEntityAndAttribute(cardConfig.entity);
|
||||
cardConfig.entity = entityParts.entity;
|
||||
if (entityParts.attribute) cardConfig.attribute = entityParts.attribute;
|
||||
|
||||
if (cardConfig.entity_min !== undefined) {
|
||||
const entityMinParts = this._splitEntityAndAttribute(cardConfig.entity_min);
|
||||
cardConfig.entity_min = entityMinParts.entity;
|
||||
if (entityMinParts.attribute) cardConfig.minAttribute = entityMinParts.attribute;
|
||||
}
|
||||
|
||||
if (cardConfig.entity_max !== undefined) {
|
||||
const entityMaxParts = this._splitEntityAndAttribute(cardConfig.entity_max);
|
||||
cardConfig.entity_max = entityMaxParts.entity;
|
||||
if (entityMaxParts.attribute) cardConfig.maxAttribute = entityMaxParts.attribute;
|
||||
}
|
||||
|
||||
if (config.icon_color !== undefined) {
|
||||
var icon_color = config.icon_color;
|
||||
} else {
|
||||
var icon_color = "var(--paper-item-icon-color)";
|
||||
}
|
||||
|
||||
let card_style = cardConfig.card_style;
|
||||
const card = document.createElement('ha-card');
|
||||
const content = document.createElement('div');
|
||||
const style = document.createElement('style');
|
||||
|
||||
style.textContent = `
|
||||
ha-card {
|
||||
--base-unit: ${cardConfig.scale};
|
||||
height: calc(var(--base-unit)*3.5);
|
||||
position: relative;
|
||||
}
|
||||
.container{
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: calc(var(--base-unit) * 2.44);
|
||||
position: absolute;
|
||||
top: calc(var(--base-unit)*2.1);
|
||||
left: 50%;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
.gauge-a{
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
background-color: var(--secondary-background-color);
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: calc(var(--base-unit) * 2);
|
||||
top: 0%;
|
||||
border-radius:calc(var(--base-unit) * 2.5) calc(var(--base-unit) * 2.5) 0px 0px ;
|
||||
}
|
||||
.gauge-b{
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
background-color: var(--card-background-color);
|
||||
width: calc(var(--base-unit) * 3.6);
|
||||
height: calc(var(--base-unit) * 2);
|
||||
top: calc(var(--base-unit) * 0.2);
|
||||
margin-left: calc(var(--base-unit) * 0.2);
|
||||
margin-right: auto;
|
||||
border-radius: calc(var(--base-unit) * 3.6) calc(var(--base-unit) * 3.6) 0px 0px ;
|
||||
}
|
||||
.gauge-c{
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
background-color: var(--label-badge-yellow);
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: calc(var(--base-unit) * 2);
|
||||
top: calc(var(--base-unit) * 2);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border-radius: 0px 0px calc(var(--base-unit) * 2) calc(var(--base-unit) * 2) ;
|
||||
transform-origin: center top;
|
||||
transition: all 1.3s ease-in-out;
|
||||
}
|
||||
.gauge-data{
|
||||
z-index: 4;
|
||||
color: var(--primary-text-color);
|
||||
line-height: calc(var(--base-unit) * 0.3);
|
||||
position: absolute;
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: calc(var(--base-unit) * 2.1);
|
||||
top: calc(var(--base-unit) * 1.25);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
transition: all 1s ease-out;
|
||||
}
|
||||
.gauge-data #percent{
|
||||
font-size: calc(var(--base-unit) * 0.55);
|
||||
}
|
||||
.gauge-data #title{
|
||||
padding-top: calc(var(--base-unit) * 0.15);
|
||||
font-size: calc(var(--base-unit) * 0.30);
|
||||
}
|
||||
.gauge-icons{
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: calc(var(--base-unit) * 2.5);
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
padding-top: calc(var(--base-unit)*0.15);
|
||||
}
|
||||
.icon1{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
color: ${icon_color};
|
||||
float: left;
|
||||
padding-top: 3em;
|
||||
}
|
||||
.icon2{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
color: ${icon_color};
|
||||
padding-top: .5em;
|
||||
padding-right: 9px;
|
||||
}
|
||||
.icon3{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
color: ${icon_color};
|
||||
float: right;
|
||||
padding-top: 3em;
|
||||
}
|
||||
.gauge-footer{
|
||||
position: absolute;
|
||||
width: calc(var(--base-unit) *4);
|
||||
height: calc(var(--base-unit) *.75);
|
||||
top: calc(var(--base-unit) *2);
|
||||
z-index: 4;
|
||||
font-size: calc(var(--base-unit) * 0.30);
|
||||
font-weight: 400;
|
||||
padding-top: .25em;
|
||||
background: var(--card-background-color);
|
||||
}
|
||||
.gauge-footer .minval{
|
||||
float: left;
|
||||
color: #797575;
|
||||
padding-left: .5em;
|
||||
}
|
||||
.gauge-footer .maxval{
|
||||
float: right;
|
||||
color: #797575;
|
||||
padding-right: .25em;
|
||||
}
|
||||
.gauge-c hr {
|
||||
visibility: hidden;
|
||||
}
|
||||
.gauge-d{
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: 0;
|
||||
top: calc(var(--base-unit) * 2);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border-radius: 0px 0px calc(var(--base-unit) * 2) calc(var(--base-unit) * 2) ;
|
||||
transform-origin: center top;
|
||||
transition: all 1.3s ease-in-out;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.gauge-e{
|
||||
z-index: 101;
|
||||
position: absolute;
|
||||
width: calc(var(--base-unit) * 4);
|
||||
height: 0;
|
||||
top: calc(var(--base-unit) * 2);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border-radius: 0px 0px calc(var(--base-unit) * 2) calc(var(--base-unit) * 2) ;
|
||||
transform-origin: center top;
|
||||
transition: all 1.3s ease-in-out;
|
||||
transform: rotate(125deg);
|
||||
}
|
||||
`;
|
||||
content.innerHTML = `
|
||||
<div id="gauge-icons" class="gauge-icons" style="display: none;">
|
||||
<ha-icon class="icon1" icon="${cardConfig.icon1}"></ha-icon>
|
||||
<ha-icon class="icon2" icon="${cardConfig.icon2}"></ha-icon>
|
||||
<ha-icon class="icon3" icon="${cardConfig.icon3}"></ha-icon>
|
||||
</div>
|
||||
<div id="gauge-icons-baro" class="gauge-icons">
|
||||
<ha-icon class="icon1" icon=mdi:weather-pouring></ha-icon>
|
||||
<ha-icon class="icon2" icon=mdi:weather-partly-cloudy></ha-icon>
|
||||
<ha-icon class="icon3" icon=mdi:weather-sunny></ha-icon>
|
||||
</div>
|
||||
<div id="gauge-icons-thermo" class="gauge-icons" style="display: none;">
|
||||
<ha-icon class="icon1" icon=mdi:thermometer-low></ha-icon>
|
||||
<ha-icon class="icon2" icon=mdi:thermometer></ha-icon>
|
||||
<ha-icon class="icon3" icon=mdi:thermometer-high></ha-icon>
|
||||
</div>
|
||||
<div id="gauge-icons-water" class="gauge-icons" style="display: none;">
|
||||
<ha-icon class="icon1" icon=mdi:water-off></ha-icon>
|
||||
<ha-icon class="icon2" icon=mdi:water-percent></ha-icon>
|
||||
<ha-icon class="icon3" icon=mdi:water></ha-icon>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="gauge-a">
|
||||
</div>
|
||||
<div class="gauge-b"></div>
|
||||
<div class="gauge-c" id="gauge"></div>
|
||||
<div class="gauge-d" id="recentMin">
|
||||
<svg id="svg_min" style="margin-right: 90%; width: 18px;height: 18px; margin-top: -6px; padding-bottom: 10px" viewBox="0 0 24 24">
|
||||
<title id="svg_min_title"></title>
|
||||
<path fill="blue" d="M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="gauge-e" id="recentMax">
|
||||
<svg id="svg_max" style="margin-right: 90%; width: 18px;height: 18px; margin-top: -12px; padding-bottom:10px;" viewBox="0 0 24 24">
|
||||
<title id="svg_max_title"></title>
|
||||
<path fill="red" d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="gauge-data">
|
||||
<div id="percent"></div>
|
||||
<div id="title"></div>
|
||||
</div>
|
||||
<div class="gauge-footer">
|
||||
<span id="minval" class="minval"></span>
|
||||
<span id="maxval" class="maxval"></span>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
card.appendChild(content);
|
||||
card.appendChild(style);
|
||||
card.addEventListener('click', event => {
|
||||
this._fire('hass-more-info', { entityId: cardConfig.entity });
|
||||
});
|
||||
root.appendChild(card);
|
||||
this._config = cardConfig;
|
||||
|
||||
if (card_style == "thermometer") {
|
||||
root.getElementById("gauge-icons-baro").style.display = 'none';
|
||||
root.getElementById("gauge-icons-water").style.display = 'none';
|
||||
root.getElementById("gauge-icons-thermo").style.display = 'block';
|
||||
root.getElementById("gauge-icons").style.display = 'none';
|
||||
} else if (card_style == "humidity") {
|
||||
root.getElementById("gauge-icons-baro").style.display = 'none';
|
||||
root.getElementById("gauge-icons-water").style.display = 'block';
|
||||
root.getElementById("gauge-icons-thermo").style.display = 'none';
|
||||
root.getElementById("gauge-icons").style.display = 'none';
|
||||
} else if (card_style == "custom") {
|
||||
root.getElementById("gauge-icons-baro").style.display = 'none';
|
||||
root.getElementById("gauge-icons-water").style.display = 'none';
|
||||
root.getElementById("gauge-icons-thermo").style.display = 'none';
|
||||
root.getElementById("gauge-icons").style.display = 'block';
|
||||
}
|
||||
}
|
||||
|
||||
_splitEntityAndAttribute(entity) {
|
||||
let parts = entity.split('.');
|
||||
if (parts.length < 3) {
|
||||
return { entity: entity };
|
||||
}
|
||||
|
||||
return { attribute: parts.pop(), entity: parts.join('.') };
|
||||
}
|
||||
|
||||
_fire(type, detail, options) {
|
||||
const node = this.shadowRoot;
|
||||
options = options || {};
|
||||
detail = (detail === null || detail === undefined) ? {} : detail;
|
||||
const event = new Event(type, {
|
||||
bubbles: options.bubbles === undefined ? true : options.bubbles,
|
||||
cancelable: Boolean(options.cancelable),
|
||||
composed: options.composed === undefined ? true : options.composed
|
||||
});
|
||||
event.detail = detail;
|
||||
node.dispatchEvent(event);
|
||||
return event;
|
||||
}
|
||||
|
||||
_translateTurn(value, config) {
|
||||
return 5 * (value - config.min) / (config.max - config.min);
|
||||
}
|
||||
|
||||
_computeSeverity(stateValue, sections) {
|
||||
let numberValue = Number(stateValue);
|
||||
const severityMap = {
|
||||
red: "var(--label-badge-red)",
|
||||
green: "var(--label-badge-green)",
|
||||
yellow: "var(--label-badge-yellow)",
|
||||
normal: "var(--label-badge-blue)",
|
||||
};
|
||||
if (!sections) return severityMap["normal"];
|
||||
let sortable = [];
|
||||
for (let severity in sections) {
|
||||
sortable.push([severity, sections[severity]]);
|
||||
}
|
||||
sortable.sort((a, b) => { return a[1] - b[1] });
|
||||
if (numberValue >= sortable[0][1] && numberValue < sortable[1][1]) {
|
||||
return severityMap[sortable[0][0]];
|
||||
}
|
||||
if (numberValue >= sortable[1][1] && numberValue < sortable[2][1]) {
|
||||
return severityMap[sortable[1][0]];
|
||||
}
|
||||
if (sortable.length === 4) {
|
||||
if (numberValue >= sortable[2][1] && numberValue < sortable[3][1]) {
|
||||
return severityMap[sortable[2][0]];
|
||||
}
|
||||
if (numberValue > sortable[3][1]) {
|
||||
return severityMap["normal"]
|
||||
}
|
||||
} else {
|
||||
if (numberValue >= sortable[2][1]) {
|
||||
return severityMap[sortable[2][0]];
|
||||
}
|
||||
}
|
||||
return severityMap["normal"];
|
||||
}
|
||||
|
||||
_getEntityStateValue(entity, attribute) {
|
||||
if (!attribute) {
|
||||
return entity.state;
|
||||
}
|
||||
|
||||
return entity.attributes[attribute];
|
||||
}
|
||||
|
||||
set hass(hass) {
|
||||
const root = this.shadowRoot;
|
||||
const config = this._config;
|
||||
var entityState = this._getEntityStateValue(hass.states[config.entity], config.attribute);
|
||||
var maxEntityState = null;
|
||||
var minEntityState = null;
|
||||
if (config.entity_max !== undefined) {
|
||||
maxEntityState = this._getEntityStateValue(hass.states[config.entity_max], config.maxAttribute);
|
||||
} else {
|
||||
root.getElementById("recentMax").style.display = 'none';
|
||||
}
|
||||
if (config.entity_min !== undefined) {
|
||||
minEntityState = this._getEntityStateValue(hass.states[config.entity_min], config.minAttribute);
|
||||
} else {
|
||||
root.getElementById("recentMin").style.display = 'none';
|
||||
}
|
||||
|
||||
let measurement = "";
|
||||
if (config.measurement == null) {
|
||||
if (hass.states[config.entity].attributes.unit_of_measurement === undefined) {
|
||||
measurement = '';
|
||||
} else {
|
||||
measurement = hass.states[config.entity].attributes.unit_of_measurement;
|
||||
}
|
||||
} else {
|
||||
measurement = config.measurement;
|
||||
}
|
||||
|
||||
root.getElementById("minval").innerHTML = config.min;
|
||||
root.getElementById("maxval").innerHTML = config.max;
|
||||
|
||||
// Set decimal precision
|
||||
if (config.decimals !== undefined) {
|
||||
// Only allow positive numbers
|
||||
if (config.decimals >= 0) {
|
||||
entityState = Math.round(parseFloat(entityState) * (10 ** config.decimals)) / (10 ** config.decimals) // Round (https://stackoverflow.com/a/11832950)
|
||||
entityState = entityState.toFixed(config.decimals) // Add trailing zeroes if applicable
|
||||
}
|
||||
}
|
||||
|
||||
if (entityState !== this._entityState) {
|
||||
root.getElementById("percent").textContent = `${entityState} ${measurement}`;
|
||||
root.getElementById("title").textContent = config.title;
|
||||
const turn = this._translateTurn(entityState, config) / 10;
|
||||
root.getElementById("gauge").style.transform = `rotate(${turn}turn)`;
|
||||
root.getElementById("gauge").style.backgroundColor = this._computeSeverity(entityState, config.severity);
|
||||
this._entityState = entityState;
|
||||
}
|
||||
if (config.entity_max !== null) {
|
||||
if (maxEntityState !== this._maxEntityState) {
|
||||
this._maxEntityState = maxEntityState;
|
||||
const turn3 = this._translateTurn(maxEntityState, config) /10;
|
||||
root.getElementById("recentMax").style.transform = `rotate(${turn3}turn)`;
|
||||
root.getElementById("svg_max_title").innerHTML = maxEntityState;
|
||||
}
|
||||
}
|
||||
if (config.entity_min !== null) {
|
||||
if (minEntityState !== this._minEntityState) {
|
||||
this._minEntityState = minEntityState;
|
||||
const turn2 = this._translateTurn(minEntityState, config) /10;
|
||||
root.getElementById("recentMin").style.transform = `rotate(${turn2}turn)`;
|
||||
root.getElementById("svg_min_title").innerHTML = minEntityState;
|
||||
}
|
||||
}
|
||||
root.lastChild.hass = hass;
|
||||
}
|
||||
|
||||
getCardSize() {
|
||||
return 1;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define('tempometer-gauge-card', TempometerGaugeCard);
|
||||
@@ -0,0 +1,289 @@
|
||||
if (!customElements.get("paper-input")) {
|
||||
console.log("imported", "paper-input");
|
||||
import("https://unpkg.com/@polymer/paper-input/paper-input.js?module");
|
||||
}
|
||||
|
||||
const fireEvent = (node, type, detail, options) => {
|
||||
options = options || {};
|
||||
detail = detail === null || detail === undefined ? {} : detail;
|
||||
const event = new Event(type, {
|
||||
bubbles: options.bubbles === undefined ? true : options.bubbles,
|
||||
cancelable: Boolean(options.cancelable),
|
||||
composed: options.composed === undefined ? true : options.composed
|
||||
});
|
||||
event.detail = detail;
|
||||
node.dispatchEvent(event);
|
||||
return event;
|
||||
};
|
||||
|
||||
const LitElement = Object.getPrototypeOf(
|
||||
customElements.get("ha-panel-lovelace")
|
||||
);
|
||||
const html = LitElement.prototype.html;
|
||||
|
||||
export class WeatherCardEditor extends LitElement {
|
||||
setConfig(config) {
|
||||
this._config = config;
|
||||
}
|
||||
|
||||
static get properties() {
|
||||
return { hass: {}, _config: {} };
|
||||
}
|
||||
|
||||
get _entity() {
|
||||
return this._config.entity || "";
|
||||
}
|
||||
|
||||
get _rainChanceEntity() {
|
||||
return this._config.rainChanceEntity || "";
|
||||
}
|
||||
|
||||
get _cloudCoverEntity() {
|
||||
return this._config.cloudCoverEntity || "";
|
||||
}
|
||||
|
||||
get _snowChanceEntity() {
|
||||
return this._config.snowChanceEntity || "";
|
||||
}
|
||||
|
||||
get _freezeChanceEntity() {
|
||||
return this._config.freezeChanceEntity || "";
|
||||
}
|
||||
|
||||
|
||||
get _alertEntity() {
|
||||
return this._config.alertEntity || "";
|
||||
}
|
||||
|
||||
get _uvEntity() {
|
||||
return this._config.uvEntity || "";
|
||||
}
|
||||
|
||||
get _rainForecastEntity() {
|
||||
return this._config.rainForecastEntity || "";
|
||||
}
|
||||
|
||||
get _name() {
|
||||
return this._config.name || "";
|
||||
}
|
||||
|
||||
get _icons() {
|
||||
return this._config.icons || "";
|
||||
}
|
||||
|
||||
render() {
|
||||
if (!this.hass) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
return html`
|
||||
<div class="card-config">
|
||||
<div class="side-by-side">
|
||||
<paper-input
|
||||
label="Nom"
|
||||
.value="${this._name}"
|
||||
.configValue="${"name"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
<paper-input
|
||||
label="Icônes"
|
||||
.value="${this._icons}"
|
||||
.configValue="${"icons"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._entity}"
|
||||
.configValue=${"entity"}
|
||||
domain-filter="weather"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Météo"
|
||||
.value="${this._entity}"
|
||||
.configValue="${"entity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._rainChanceEntity}"
|
||||
.configValue=${"rainChanceEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Risque de pluie"
|
||||
.value="${this._rainChanceEntity}"
|
||||
.configValue="${"rainChanceEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._uvEntity}"
|
||||
.configValue=${"uvEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="UV"
|
||||
.value="${this._uvEntity}"
|
||||
.configValue="${"uvEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._cloudCoverEntity}"
|
||||
.configValue=${"cloudCoverEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Couverture nuageuse"
|
||||
.value="${this._cloudCoverEntity}"
|
||||
.configValue="${"cloudCoverEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._freezeChanceEntity}"
|
||||
.configValue=${"freezeChanceEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Risque de gel"
|
||||
.value="${this._freezeChanceEntity}"
|
||||
.configValue="${"freezeChanceEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._snowChanceEntity}"
|
||||
.configValue=${"snowChanceEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Risque de neige"
|
||||
.value="${this._snowChanceEntity}"
|
||||
.configValue="${"snowChanceEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._alertEntity}"
|
||||
.configValue=${"alertEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Vigilance Météo"
|
||||
.value="${this._alertEntity}"
|
||||
.configValue="${"alertEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
${
|
||||
customElements.get("ha-entity-picker")
|
||||
? html`
|
||||
<ha-entity-picker
|
||||
.hass="${this.hass}"
|
||||
.value="${this._rainForecastEntity}"
|
||||
.configValue=${"rainForecastEntity"}
|
||||
domain-filter="sensor"
|
||||
@change="${this._valueChanged}"
|
||||
allow-custom-entity
|
||||
></ha-entity-picker>
|
||||
`
|
||||
: html`
|
||||
<paper-input
|
||||
label="Pluie dans l'heure"
|
||||
.value="${this._rainForecastEntity}"
|
||||
.configValue="${"rainForecastEntity"}"
|
||||
@value-changed="${this._valueChanged}"
|
||||
></paper-input>
|
||||
`
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
_valueChanged(ev) {
|
||||
if (!this._config || !this.hass) {
|
||||
return;
|
||||
}
|
||||
const target = ev.target;
|
||||
if (this[`_${target.configValue}`] === target.value) {
|
||||
return;
|
||||
}
|
||||
if (target.configValue) {
|
||||
if (target.value === "") {
|
||||
delete this._config[target.configValue];
|
||||
} else {
|
||||
this._config = {
|
||||
...this._config,
|
||||
[target.configValue]: target.value
|
||||
};
|
||||
}
|
||||
}
|
||||
fireEvent(this, "config-changed", { config: this._config });
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("meteo-france-weather-card-editor", WeatherCardEditor);
|
||||
@@ -0,0 +1,724 @@
|
||||
const LitElement = Object.getPrototypeOf(
|
||||
customElements.get("ha-panel-lovelace")
|
||||
);
|
||||
const html = LitElement.prototype.html;
|
||||
|
||||
const weatherIconsDay = {
|
||||
clear: "day",
|
||||
"clear-night": "day",
|
||||
"nuit claire": "day",
|
||||
cloudy: "cloudy",
|
||||
fog: "cloudy",
|
||||
hail: "rainy-7",
|
||||
lightning: "thunder",
|
||||
"lightning-rainy": "thunder",
|
||||
partlycloudy: "cloudy-day-3",
|
||||
pouring: "rainy-6",
|
||||
rainy: "rainy-5",
|
||||
snowy: "snowy-6",
|
||||
"snowy-rainy": "rainy-7",
|
||||
sunny: "day",
|
||||
windy: "cloudy",
|
||||
"windy-variant": "cloudy-day-3",
|
||||
exceptional: "!!"
|
||||
};
|
||||
|
||||
const weatherIconsNight = {
|
||||
...weatherIconsDay,
|
||||
clear: "night",
|
||||
"clear-night": "night",
|
||||
sunny: "night",
|
||||
"nuit claire": "night",
|
||||
partlycloudy: "cloudy-night-3",
|
||||
"windy-variant": "cloudy-night-3"
|
||||
};
|
||||
|
||||
const fireEvent = (node, type, detail, options) => {
|
||||
options = options || {};
|
||||
detail = detail === null || detail === undefined ? {} : detail;
|
||||
const event = new Event(type, {
|
||||
bubbles: options.bubbles === undefined ? true : options.bubbles,
|
||||
cancelable: Boolean(options.cancelable),
|
||||
composed: options.composed === undefined ? true : options.composed
|
||||
});
|
||||
event.detail = detail;
|
||||
node.dispatchEvent(event);
|
||||
return event;
|
||||
};
|
||||
|
||||
function getWindDirectionRotation(direction) {
|
||||
let windDirections = [
|
||||
"N",//0
|
||||
"NNE",
|
||||
"NE",
|
||||
"ENE",
|
||||
"E",//90
|
||||
"ESE",
|
||||
"SE",
|
||||
"SSE",
|
||||
"S",//180
|
||||
"SSO",
|
||||
"SO",
|
||||
"OSO",
|
||||
"O",//270
|
||||
"ONO",
|
||||
"NO",
|
||||
"NNO"
|
||||
];
|
||||
|
||||
let name = windDirections[Math.round(direction/22.5)%16];
|
||||
return name;
|
||||
}
|
||||
|
||||
function getVigilance(color, alertEntity) {
|
||||
let phenomenaIcons = {
|
||||
"Vent violent": "mdi:weather-windy",
|
||||
"Pluie-inondation": "mdi:weather-pouring",
|
||||
"Orages": "mdi:weather-lightning",
|
||||
"Inondation": "mdi:home-flood",
|
||||
"Neige-verglas": "mdi:weather-snowy-heavy",
|
||||
"Canicule": "mdi:weather-sunny-alert",
|
||||
"Grand-froid": "mdi:snowflake",
|
||||
"Avalanches": "mdi:image-filter-hdr",
|
||||
"Vagues-submersion": "mdi:waves"
|
||||
};
|
||||
|
||||
if(alertEntity == undefined) {
|
||||
return [];
|
||||
}
|
||||
|
||||
let phenomenaList = [];
|
||||
for (const [currentPhenomenon, currentPhenomenonColor] of Object.entries(alertEntity.attributes)) {
|
||||
if(currentPhenomenonColor == color) {
|
||||
phenomenaList.push([currentPhenomenon, phenomenaIcons[currentPhenomenon]]);
|
||||
}
|
||||
}
|
||||
|
||||
return phenomenaList;
|
||||
}
|
||||
|
||||
function getRainForecast(rainForecastEntity) {
|
||||
|
||||
let rainForecastColors = new Map([
|
||||
['Temps sec', 0.1],
|
||||
['Pluie faible', 0.4],
|
||||
['Pluie modérée', 0.7],
|
||||
['Pluie forte', 1]
|
||||
]);
|
||||
|
||||
let rainForecastList = [];
|
||||
for (let [time, value] of Object.entries(rainForecastEntity.attributes['1_hour_forecast'])) {
|
||||
if(time != undefined && time.match(/[0-9]*min/g)) {
|
||||
time = time.replace('min', '').trim();
|
||||
rainForecastList.push([time, rainForecastColors.get(value), value]);
|
||||
}
|
||||
}
|
||||
|
||||
return rainForecastList;
|
||||
}
|
||||
|
||||
function hasConfigOrEntityChanged(element, changedProps) {
|
||||
if (changedProps.has("_config")) {
|
||||
return true;
|
||||
}
|
||||
|
||||
const oldHass = changedProps.get("hass");
|
||||
if (oldHass) {
|
||||
return (
|
||||
oldHass.states[element._config.entity] !==
|
||||
element.hass.states[element._config.entity] ||
|
||||
oldHass.states["sun.sun"] !== element.hass.states["sun.sun"]
|
||||
);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
class WeatherCard extends LitElement {
|
||||
static get properties() {
|
||||
return {
|
||||
_config: {},
|
||||
hass: {}
|
||||
};
|
||||
}
|
||||
|
||||
static async getConfigElement() {
|
||||
await import("./meteo-france-weather-card-editor.js");
|
||||
return document.createElement("meteo-france-weather-card-editor");
|
||||
}
|
||||
|
||||
static getStubConfig() {
|
||||
return {};
|
||||
}
|
||||
|
||||
setConfig(config) {
|
||||
if (!config.entity) {
|
||||
throw new Error("Please define a weather entity");
|
||||
}
|
||||
this._config = config;
|
||||
}
|
||||
|
||||
shouldUpdate(changedProps) {
|
||||
return hasConfigOrEntityChanged(this, changedProps);
|
||||
}
|
||||
|
||||
render() {
|
||||
if (!this._config || !this.hass) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
const stateObj = this.hass.states[this._config.entity];
|
||||
const rainChanceObj = this.hass.states[this._config.rainChanceEntity];
|
||||
const cloudCoverObj = this.hass.states[this._config.cloudCoverEntity];
|
||||
const snowChanceObj = this.hass.states[this._config.snowChanceEntity];
|
||||
const freezeChanceObj = this.hass.states[this._config.freezeChanceEntity];
|
||||
const alertObj = this.hass.states[this._config.alertEntity];
|
||||
const rainForecastObj = this.hass.states[this._config.rainForecastEntity];
|
||||
const uvObj = this.hass.states[this._config.uvEntity];
|
||||
|
||||
if (!stateObj) {
|
||||
return html`
|
||||
<style>
|
||||
.not-found {
|
||||
flex: 1;
|
||||
background-color: yellow;
|
||||
padding: 8px;
|
||||
}
|
||||
</style>
|
||||
<ha-card>
|
||||
<div class="not-found">
|
||||
Entity not available: ${this._config.entity}
|
||||
</div>
|
||||
</ha-card>
|
||||
`;
|
||||
}
|
||||
|
||||
const lang = this.hass.selectedLanguage || this.hass.language;
|
||||
|
||||
const next_rising = new Date(
|
||||
this.hass.states["sun.sun"].attributes.next_rising
|
||||
);
|
||||
const next_setting = new Date(
|
||||
this.hass.states["sun.sun"].attributes.next_setting
|
||||
);
|
||||
|
||||
return html`
|
||||
${this.renderStyle()}
|
||||
<ha-card @click="${this._handleClick}">
|
||||
<span
|
||||
class="icon bigger"
|
||||
style="background: none, url(${
|
||||
this.getWeatherIcon(
|
||||
stateObj.state.toLowerCase(),
|
||||
this.hass.states["sun.sun"].state
|
||||
)
|
||||
}) no-repeat; background-size: contain;"
|
||||
>${stateObj.state}
|
||||
</span>
|
||||
${
|
||||
this._config.name
|
||||
? html`
|
||||
<span class="title"> ${this._config.name} </span>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
<span class="temp"
|
||||
>${
|
||||
this.getUnit("temperature") == "°F"
|
||||
? Math.round(stateObj.attributes.temperature)
|
||||
: stateObj.attributes.temperature
|
||||
}</span
|
||||
>
|
||||
<span class="tempc"> ${this.getUnit("temperature")}</span>
|
||||
<span>
|
||||
<ul class="variations">
|
||||
<li>
|
||||
${
|
||||
rainChanceObj != undefined
|
||||
? html`
|
||||
<span title="${rainChanceObj.attributes.friendly_name}" class="ha-icon"
|
||||
><ha-icon icon="${rainChanceObj.attributes.icon === undefined ? 'mdi:weather-rainy' : rainChanceObj.attributes.icon}"></ha-icon
|
||||
></span>
|
||||
${rainChanceObj.state}<span class="unit"> ${rainChanceObj.attributes.unit_of_measurement} </span>
|
||||
<br />
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
${
|
||||
cloudCoverObj != undefined
|
||||
? html`
|
||||
<span title="${cloudCoverObj.attributes.friendly_name}" class="ha-icon"
|
||||
><ha-icon icon="${cloudCoverObj.attributes.icon === undefined ? 'mdi:weather-cloudy' : cloudCoverObj.attributes.icon}"></ha-icon
|
||||
></span>
|
||||
${cloudCoverObj.state}<span class="unit"> ${cloudCoverObj.attributes.unit_of_measurement} </span>
|
||||
<br />
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
${
|
||||
snowChanceObj != undefined
|
||||
? html`
|
||||
<span title="${snowChanceObj.attributes.friendly_name}" class="ha-icon"
|
||||
><ha-icon icon="${snowChanceObj.attributes.icon === undefined ? 'mdi:weather-snowy' : snowChanceObj.attributes.icon}"></ha-icon
|
||||
></span>
|
||||
${snowChanceObj.state}<span class="unit"> ${snowChanceObj.attributes.unit_of_measurement} </span>
|
||||
<br />
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
${
|
||||
freezeChanceObj != undefined
|
||||
? html`
|
||||
<span title="${freezeChanceObj.attributes.friendly_name}" class="ha-icon"
|
||||
><ha-icon icon="${freezeChanceObj.attributes.icon === undefined ? 'mdi:snowflake' : freezeChanceObj.attributes.icon}"></ha-icon
|
||||
></span>
|
||||
${freezeChanceObj.state}<span class="unit"> ${freezeChanceObj.attributes.unit_of_measurement} </span>
|
||||
<br />
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
<br />
|
||||
<span class="ha-icon"
|
||||
><ha-icon icon="mdi:weather-sunset-up"></ha-icon
|
||||
></span>
|
||||
${next_rising.toLocaleTimeString()}
|
||||
</li>
|
||||
<li>
|
||||
<span class="ha-icon"
|
||||
><ha-icon icon="mdi:weather-windy"></ha-icon
|
||||
></span>
|
||||
${stateObj.attributes.wind_speed}<span class="unit">
|
||||
${this.getUnit("length")}/h
|
||||
</span>
|
||||
<br />
|
||||
${
|
||||
stateObj.attributes.wind_bearing != undefined
|
||||
? html`
|
||||
<span class="ha-icon"
|
||||
><ha-icon icon="mdi:navigation" style="transform: rotate(${stateObj.attributes.wind_bearing - 180}deg); display: inline-block;"></ha-icon
|
||||
></span>
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
${
|
||||
stateObj.attributes.wind_bearing != undefined
|
||||
? html`
|
||||
${getWindDirectionRotation(stateObj.attributes.wind_bearing)}
|
||||
<br />
|
||||
<div style="height: 24px;" ></div>
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
${
|
||||
uvObj != undefined
|
||||
? html`
|
||||
<span title="${uvObj.attributes.friendly_name}" class="ha-icon"
|
||||
><ha-icon icon="${uvObj.attributes.icon === undefined ? 'mdi:sunglasses' : uvObj.attributes.icon}"></ha-icon
|
||||
></span>
|
||||
UV ${uvObj.state}
|
||||
<br />
|
||||
`
|
||||
: html`<div style="height: 24px;" ></div>`
|
||||
}
|
||||
<br />
|
||||
<span class="ha-icon"
|
||||
><ha-icon icon="mdi:weather-sunset-down"></ha-icon
|
||||
></span>
|
||||
${next_setting.toLocaleTimeString()}
|
||||
</li>
|
||||
</ul>
|
||||
</span>
|
||||
${
|
||||
rainForecastObj != undefined
|
||||
? html`
|
||||
<div class="pluie">
|
||||
${
|
||||
html`
|
||||
${
|
||||
getRainForecast(rainForecastObj).map(
|
||||
forecast => html`
|
||||
<div class="pluie-element" style="opacity: ${forecast[1]}" title="${forecast[2] + " " + (forecast[0] == 0 ? "actuellement" : "dans " + forecast[0] + " min")}">
|
||||
</div>
|
||||
`
|
||||
)
|
||||
}
|
||||
|
||||
`
|
||||
}
|
||||
</div>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
${
|
||||
getVigilance("Jaune", alertObj).length > 0
|
||||
? html`
|
||||
<span class="vigilance jaune">
|
||||
<ha-icon icon="mdi:alert"></ha-icon>Vigilance jaune en cours
|
||||
<div class="vigilance-list">
|
||||
${
|
||||
getVigilance("Jaune", alertObj).map(
|
||||
phenomenon => html`
|
||||
<ha-icon icon="${phenomenon[1]}" title="${phenomenon[0]}"></ha-icon>
|
||||
`
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</span>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
${
|
||||
getVigilance("Orange", alertObj).length > 0
|
||||
? html`
|
||||
<span class="vigilance orange">
|
||||
<ha-icon icon="mdi:alert"></ha-icon>Vigilance orange en cours
|
||||
<div class="vigilance-list">
|
||||
${
|
||||
getVigilance("Orange", alertObj).map(
|
||||
phenomenon => html`
|
||||
<ha-icon icon="${phenomenon[1]}" title="${phenomenon[0]}"></ha-icon>
|
||||
`
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</span>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
${
|
||||
getVigilance("Rouge", alertObj).length > 0
|
||||
? html`
|
||||
<span class="vigilance rouge">
|
||||
<ha-icon icon="mdi:alert"></ha-icon>Vigilance rouge en cours
|
||||
<div class="vigilance-list">
|
||||
${
|
||||
getVigilance("Rouge", alertObj).map(
|
||||
phenomenon => html`
|
||||
<ha-icon icon="${phenomenon[1]}" title="${phenomenon[0]}"></ha-icon>
|
||||
`
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</span>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
${
|
||||
stateObj.attributes.forecast &&
|
||||
stateObj.attributes.forecast.length > 0
|
||||
? html`
|
||||
<div class="forecast clear">
|
||||
${
|
||||
stateObj.attributes.forecast.slice(0, 5).map(
|
||||
daily => html`
|
||||
<div class="day">
|
||||
<span class="dayname"
|
||||
>${
|
||||
new Date(daily.datetime).toLocaleDateString(
|
||||
lang,
|
||||
{
|
||||
weekday: "short"
|
||||
}
|
||||
)
|
||||
}</span
|
||||
>
|
||||
<br /><i
|
||||
class="icon"
|
||||
style="background: none, url(${
|
||||
this.getWeatherIcon(daily.condition.toLowerCase())
|
||||
}) no-repeat; background-size: contain;"
|
||||
></i>
|
||||
<br /><span class="highTemp"
|
||||
>${daily.temperature}${
|
||||
this.getUnit("temperature")
|
||||
}</span
|
||||
>
|
||||
${
|
||||
typeof daily.templow !== 'undefined'
|
||||
? html`
|
||||
<br /><span class="lowTemp"
|
||||
>${daily.templow}${
|
||||
this.getUnit("temperature")
|
||||
}</span
|
||||
>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
${
|
||||
typeof daily.precipitation !== 'undefined'
|
||||
? html`
|
||||
<br /><span class="rainForcast"
|
||||
>${daily.precipitation}${
|
||||
this.getUnit("precipitation")
|
||||
}</span
|
||||
>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
</div>
|
||||
`
|
||||
)
|
||||
}
|
||||
</div>
|
||||
`
|
||||
: ""
|
||||
}
|
||||
</ha-card>
|
||||
`;
|
||||
}
|
||||
|
||||
getWeatherIcon(condition, sun) {
|
||||
let icon = `${
|
||||
this._config.icons
|
||||
? this._config.icons
|
||||
: "https://cdn.jsdelivr.net/gh/bramkragten/custom-ui@master/weather-card/icons/animated/"
|
||||
}${
|
||||
sun && sun == "below_horizon"
|
||||
? weatherIconsNight[condition]
|
||||
: weatherIconsDay[condition]
|
||||
}.svg`;
|
||||
return icon;
|
||||
}
|
||||
|
||||
getUnit(measure) {
|
||||
const lengthUnit = this.hass.config.unit_system.length;
|
||||
switch (measure) {
|
||||
case "air_pressure":
|
||||
return lengthUnit === "km" ? "hPa" : "inHg";
|
||||
case "length":
|
||||
return lengthUnit;
|
||||
case "precipitation":
|
||||
return lengthUnit === "km" ? "mm" : "in";
|
||||
default:
|
||||
return this.hass.config.unit_system[measure] || "";
|
||||
}
|
||||
}
|
||||
|
||||
_handleClick() {
|
||||
fireEvent(this, "hass-more-info", { entityId: this._config.entity });
|
||||
}
|
||||
|
||||
getCardSize() {
|
||||
return 3;
|
||||
}
|
||||
|
||||
renderStyle() {
|
||||
return html`
|
||||
<style>
|
||||
ha-card {
|
||||
cursor: pointer;
|
||||
margin: auto;
|
||||
padding-top: 2.5em;
|
||||
padding-bottom: 1.3em;
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pluie {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
height: 15px;
|
||||
padding: 0px;
|
||||
color: var(--primary-text-color);
|
||||
margin: 10px 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.pluie-element {
|
||||
width: 100%;
|
||||
background-color: var(--paper-item-icon-color);
|
||||
border-right: 1px solid var(
|
||||
--lovelace-background,
|
||||
var(--primary-background-color)
|
||||
);
|
||||
}
|
||||
|
||||
.pluie-element:first-child {
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
}
|
||||
|
||||
.pluie-element:last-child {
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.ha-icon {
|
||||
height: 18px;
|
||||
margin-right: 5px;
|
||||
color: var(--paper-item-icon-color);
|
||||
}
|
||||
|
||||
.vigilance {
|
||||
display: block;
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
font-weight: 600;
|
||||
color: var(--primary-text-color);
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.vigilance ha-icon {
|
||||
margin: 0px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.vigilance-list ha-icon {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.vigilance-list {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.vigilance.jaune {
|
||||
background-color: rgba(255,235,0,0.5);
|
||||
}
|
||||
|
||||
.vigilance.orange {
|
||||
background-color: rgba(255,152,0,0.5);
|
||||
}
|
||||
|
||||
.vigilance.rouge {
|
||||
background-color: rgba(244,67,54,0.5);
|
||||
}
|
||||
|
||||
.title {
|
||||
position: absolute;
|
||||
left: 3em;
|
||||
top: 0.9em;
|
||||
font-weight: 300;
|
||||
font-size: 3em;
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
.temp {
|
||||
font-weight: 300;
|
||||
font-size: 4em;
|
||||
color: var(--primary-text-color);
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
top: 0.7em;
|
||||
}
|
||||
|
||||
.tempc {
|
||||
font-weight: 300;
|
||||
font-size: 1.5em;
|
||||
vertical-align: super;
|
||||
color: var(--primary-text-color);
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
margin-top: -14px;
|
||||
margin-right: 7px;
|
||||
}
|
||||
|
||||
.variations {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
font-weight: 300;
|
||||
color: var(--primary-text-color);
|
||||
list-style: none;
|
||||
margin-top: 4.5em;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.variations li {
|
||||
flex-basis: auto;
|
||||
}
|
||||
|
||||
.variations li:first-child {
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.variations li:last-child {
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
.unit {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.forecast {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
height: 11em;
|
||||
}
|
||||
|
||||
.day {
|
||||
display: block;
|
||||
width: 20%;
|
||||
float: left;
|
||||
text-align: center;
|
||||
color: var(--primary-text-color);
|
||||
border-right: 0.1em solid #d9d9d9;
|
||||
line-height: 2;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.dayname {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.forecast .day:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.forecast .day:nth-last-child(1) {
|
||||
border-right: none;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.highTemp {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.lowTemp {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.rainForcast {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.icon.bigger {
|
||||
width: 10em;
|
||||
height: 10em;
|
||||
margin-top: -8.5em;
|
||||
position: absolute;
|
||||
left: 0em;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-right: 5px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
background-size: contain;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
text-indent: -9999px;
|
||||
}
|
||||
|
||||
.weather {
|
||||
font-weight: 300;
|
||||
font-size: 1.5em;
|
||||
color: var(--primary-text-color);
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
top: -0.5em;
|
||||
left: 6em;
|
||||
word-wrap: break-word;
|
||||
width: 30%;
|
||||
}
|
||||
</style>
|
||||
`;
|
||||
}
|
||||
}
|
||||
customElements.define("meteo-france-weather-card", WeatherCard);
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,292 @@
|
||||
/*!
|
||||
* SVGInjector v2.1.5 - Fast, caching, dynamic inline SVG DOM injection library
|
||||
* https://github.com/flobacher/SVGInjector2
|
||||
* forked from:
|
||||
* https://github.com/iconic/SVGInjector
|
||||
*
|
||||
* Copyright (c) 2015 flobacher <flo@digital-fuse.net>
|
||||
* @license MIT
|
||||
*
|
||||
* original Copyright (c) 2014 Waybury <hello@waybury.com>
|
||||
* @license MIT
|
||||
*/
|
||||
! function(e, t) {
|
||||
"use strict";
|
||||
var r = function() {
|
||||
function r(e) {
|
||||
r.instanceCounter++, this.init(e)
|
||||
}
|
||||
var n, i, s, l, a, o, c, u, f, p, d, v, g, m, h, b, y, S, A, C, x, k, N, w, j, E, I, F, T, G, V = "http://www.w3.org/2000/svg",
|
||||
O = "http://www.w3.org/1999/xlink",
|
||||
q = ["sprite"];
|
||||
return s = [], r.instanceCounter = 0, r.prototype.init = function(r) {
|
||||
r = r || {}, n = {}, o = {}, o.isLocal = "file:" === e.location.protocol, o.hasSvgSupport = t.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1"), i = {
|
||||
count: 0,
|
||||
elements: []
|
||||
}, l = {}, a = {}, a.evalScripts = r.evalScripts || "always", a.pngFallback = r.pngFallback || !1, a.svgFallbackDir = r.svgFallbackDir || !1, a.onlyInjectVisiblePart = r.onlyInjectVisiblePart || !0, a.keepStylesClass = void 0 === r.keepStylesClass ? "" : r.keepStylesClass, a.spriteClassName = void 0 === r.spriteClassName ? "sprite" : r.spriteClassName, a.spriteClassIdName = void 0 === r.spriteClassIdName ? "sprite--" : r.spriteClassIdName, a.removeStylesClass = void 0 === r.removeStylesClass ? "icon" : r.removeStylesClass, a.removeAllStyles = void 0 !== r.removeAllStyles && r.removeAllStyles, a.fallbackClassName = void 0 === r.fallbackClassName ? q : r.fallbackClassName, a.prefixStyleTags = void 0 === r.prefixStyleTags || r.prefixStyleTags, a.spritesheetURL = void 0 !== r.spritesheetURL && "" !== r.spritesheetURL && r.spritesheetURL, a.prefixFragIdClass = a.spriteClassIdName, a.forceFallbacks = void 0 !== r.forceFallbacks && r.forceFallbacks, a.forceFallbacks && (o.hasSvgSupport = !1), x(t.querySelector("html"), "no-svg", o.hasSvgSupport), o.hasSvgSupport && void 0 === r.removeStylesClass && C(a.removeStylesClass)
|
||||
}, r.prototype.inject = function(e, t, r) {
|
||||
if (void 0 !== e.length)
|
||||
if (0 === e.length) t && t(0);
|
||||
else {
|
||||
var n = 0,
|
||||
i = this;
|
||||
I.call(e, function(s) {
|
||||
i.injectElement(s, function(i) {
|
||||
r && "function" == typeof r && r(i), t && e.length === ++n && t(n)
|
||||
})
|
||||
})
|
||||
}
|
||||
else e ? this.injectElement(e, function(n) {
|
||||
r && "function" == typeof r && r(n), t && t(1), e = null
|
||||
}) : t && t(0)
|
||||
}, G = r.prototype.injectElement = function(e, t) {
|
||||
var r, n = e.getAttribute("data-src") || e.getAttribute("src");
|
||||
if (!n) {
|
||||
if (!a.spritesheetURL) return;
|
||||
if ("" === (r = h(e))) return;
|
||||
n = a.spritesheetURL + "#" + r
|
||||
}
|
||||
e.setAttribute("data-src", n);
|
||||
var s = n.split("#");
|
||||
1 === s.length && s.push("");
|
||||
var l;
|
||||
if (!/\.svg/i.test(n)) return void t("Attempted to inject a file with a non-svg extension: " + n);
|
||||
if (!o.hasSvgSupport) {
|
||||
var f = e.getAttribute("data-fallback") || e.getAttribute("data-png");
|
||||
return void(f ? (e.setAttribute("src", f), t(null)) : a.pngFallback ? (s.length > 1 && s[1] ? (l = s[1] + ".png", j(a.fallbackClassName) ? c(e, s[1], a.fallbackClassName) : w(a.fallbackClassName) ? a.fallbackClassName(e, s[1]) : "string" == typeof a.fallbackClassName ? E(e, a.fallbackClassName) : e.setAttribute("src", a.pngFallback + "/" + l)) : (l = n.split("/").pop().replace(".svg", ".png"), e.setAttribute("src", a.pngFallback + "/" + l)), t(null)) : t("This browser does not support SVG and no PNG fallback was defined."))
|
||||
}
|
||||
j(a.fallbackClassName) && u(e, s[1], a.fallbackClassName), -1 === i.elements.indexOf(e) && (i.elements.push(e), A(t, n, e))
|
||||
}, r.prototype.getEnv = function() {
|
||||
return o
|
||||
}, r.prototype.getConfig = function() {
|
||||
return a
|
||||
}, c = function(e, t, r) {
|
||||
var n = void 0 === r ? q : r.slice(0);
|
||||
I.call(n, function(e, r) {
|
||||
n[r] = e.replace("%s", t)
|
||||
}), E(e, n)
|
||||
}, u = function(e, t, r) {
|
||||
r = void 0 === r ? q.slice(0) : r.slice(0);
|
||||
var n, i, s = e.getAttribute("class");
|
||||
void 0 !== s && null !== s && (i = s.split(" ")) && (I.call(r, function(e) {
|
||||
e = e.replace("%s", t), (n = i.indexOf(e)) >= 0 && (i[n] = "")
|
||||
}), e.setAttribute("class", N(i.join(" "))))
|
||||
}, p = function(e, t, r, n) {
|
||||
var i = 0;
|
||||
return e.textContent = e.textContent.replace(/url\(('|")*#.+('|")*(?=\))/g, function(e) {
|
||||
return i++, e + "-" + t
|
||||
}), i
|
||||
}, f = function(e, t) {
|
||||
var r, n, i, s, l, a, o, c, u, f, p, d, v, g, m, h, b = [
|
||||
// {
|
||||
// def: "linearGradient",
|
||||
// attrs: ["fill", "stroke"]
|
||||
// },
|
||||
{
|
||||
def: "radialGradient",
|
||||
attrs: ["fill", "stroke"]
|
||||
}, {
|
||||
def: "clipPath",
|
||||
attrs: ["clip-path"]
|
||||
}, {
|
||||
def: "mask",
|
||||
attrs: ["mask"]
|
||||
}, {
|
||||
def: "filter",
|
||||
attrs: ["filter"]
|
||||
}, {
|
||||
def: "color-profile",
|
||||
attrs: ["color-profile"]
|
||||
}, {
|
||||
def: "cursor",
|
||||
attrs: ["cursor"]
|
||||
}, {
|
||||
def: "marker",
|
||||
attrs: ["marker", "marker-start", "marker-mid", "marker-end"]
|
||||
}];
|
||||
I.call(b, function(b) {
|
||||
for (n = e.querySelectorAll(b.def + "[id]"), s = 0, i = n.length; s < i; s++) {
|
||||
for (r = n[s].id + "-" + t, c = b.attrs, f = 0, u = c.length; f < u; f++)
|
||||
for (l = e.querySelectorAll("[" + c[f] + '="url(#' + n[s].id + ')"]'), o = 0, a = l.length; o < a; o++) l[o].setAttribute(c[f], "url(#" + r + ")");
|
||||
for (p = e.querySelectorAll("[*|href]"), g = [], v = 0, d = p.length; v < d; v++) p[v].getAttributeNS(O, "href").toString() === "#" + n[s].id && g.push(p[v]);
|
||||
for (h = 0, m = g.length; h < m; h++) g[h].setAttributeNS(O, "href", "#" + r);
|
||||
n[s].id = r
|
||||
}
|
||||
})
|
||||
}, d = function(e, t, r) {
|
||||
var n;
|
||||
void 0 === r && (r = ["id", "viewBox"]);
|
||||
for (var i = 0; i < e.attributes.length; i++) n = e.attributes.item(i), r.indexOf(n.name) < 0 && t.setAttribute(n.name, n.value)
|
||||
}, v = function(e) {
|
||||
var r = t.createElementNS(V, "svg");
|
||||
return I.call(e.childNodes, function(e) {
|
||||
r.appendChild(e.cloneNode(!0))
|
||||
}), d(e, r), r
|
||||
}, g = function(e, t, r) {
|
||||
var n, i, s, l, a, o, c = r.getAttribute("data-src").split("#"),
|
||||
u = e.textContent,
|
||||
f = "",
|
||||
p = function(e, t, r) {
|
||||
r[t] = "." + s + " " + e
|
||||
};
|
||||
if (c.length > 1) i = c[1], s = i + "-" + t, n = new RegExp("\\." + i + " ", "g"), e.textContent = u.replace(n, "." + s + " ");
|
||||
else {
|
||||
for (l = c[0].split("/"), s = l[l.length - 1].replace(".svg", "") + "-" + t, n = new RegExp("([\\s\\S]*?){([\\s\\S]*?)}", "g"); null !== (a = n.exec(u));) {
|
||||
o = a[1].trim().split(", "), o.forEach(p);
|
||||
f += o.join(", ") + "{" + a[2] + "}\n"
|
||||
}
|
||||
e.textContent = f
|
||||
}
|
||||
r.setAttribute("class", r.getAttribute("class") + " " + s)
|
||||
}, m = function(e) {
|
||||
var t = e.getAttribute("class");
|
||||
return t ? t.trim().split(" ") : []
|
||||
}, h = function(e) {
|
||||
var t = m(e),
|
||||
r = "";
|
||||
return I.call(t, function(e) {
|
||||
e.indexOf(a.spriteClassIdName) >= 0 && (r = e.replace(a.spriteClassIdName, ""))
|
||||
}), r
|
||||
}, b = function(e, t, r) {
|
||||
var n, i, s, l, a, o, c = null,
|
||||
u = !1,
|
||||
f = !1,
|
||||
p = null;
|
||||
if (void 0 === r) n = c = t.cloneNode(!0), c.getAttribute("width") || t.getAttribute("width") || (f = !0);
|
||||
else if (!(n = t.getElementById(r))) return;
|
||||
if (s = n.getAttribute("viewBox"), i = s.split(" "), !c) {
|
||||
if (n instanceof SVGSymbolElement) c = v(n), f = u = !0;
|
||||
else if (n instanceof SVGViewElement) {
|
||||
if (p = null, e.onlyInjectVisiblePart) {
|
||||
var d = '*[width="' + i[2] + '"][height="' + i[3] + '"]';
|
||||
l = {}, 0 === Math.abs(parseInt(i[0])) ? d += ":not([x])" : (l.x = i[0], d += '[x="' + i[0] + '"]'), 0 === Math.abs(parseInt(i[1])) ? d += ":not([y])" : (l.y = i[1], d += '[y="' + i[1] + '"]'), o = t.querySelectorAll(d), o.length, p = o[0]
|
||||
}
|
||||
if (p && p instanceof SVGSVGElement) {
|
||||
c = p.cloneNode(!0);
|
||||
for (var g in l) "width" !== g && "height" !== g && c.removeAttribute(g)
|
||||
} else if (p && p instanceof SVGUseElement) {
|
||||
var h = t.getElementById(p.getAttributeNS(O, "href").substr(1));
|
||||
c = v(h), s = h.getAttribute("viewBox"), i = s.split(" "), f = u = !0
|
||||
} else f = u = !0, c = t.cloneNode(!0)
|
||||
}
|
||||
a = m(c);
|
||||
var b = e.prefixFragIdClass + r;
|
||||
a.indexOf(b) < 0 && (a.push(b), c.setAttribute("class", a.join(" ")))
|
||||
}
|
||||
return u && c.setAttribute("viewBox", i.join(" ")), f && (c.setAttribute("width", i[2] + "px"), c.setAttribute("height", i[3] + "px")), c.setAttribute("xmlns", V), c.setAttribute("xmlns:xlink", O), c
|
||||
}, y = function(e, t, r, n) {
|
||||
s[e] = s[e] || [], s[e].push({
|
||||
callback: r,
|
||||
fragmentId: t,
|
||||
element: n,
|
||||
name: name
|
||||
})
|
||||
}, S = function(e) {
|
||||
for (var t, r = 0, n = s[e].length; r < n; r++) ! function(r) {
|
||||
setTimeout(function() {
|
||||
t = s[e][r], k(e, t.fragmentId, t.callback, t.element, t.name)
|
||||
}, 0)
|
||||
}(r)
|
||||
}, A = function(t, r, i) {
|
||||
var s, l, a, c, u;
|
||||
if (s = r.split("#"), l = s[0], a = 2 === s.length ? s[1] : void 0, void 0 !== a && (u = l.split("/"), c = u[u.length - 1].replace(".svg", "")), void 0 !== n[l]) n[l] instanceof SVGSVGElement ? k(l, a, t, i, c) : y(l, a, t, i, c);
|
||||
else {
|
||||
if (!e.XMLHttpRequest) return t("Browser does not support XMLHttpRequest"), !1;
|
||||
n[l] = {}, y(l, a, t, i, c);
|
||||
var f = new XMLHttpRequest;
|
||||
f.onreadystatechange = function() {
|
||||
if (4 === f.readyState) {
|
||||
if (404 === f.status || null === f.responseXML) return t("Unable to load SVG file: " + l), !1;
|
||||
if (!(200 === f.status || o.isLocal && 0 === f.status)) return t("There was a problem injecting the SVG: " + f.status + " " + f.statusText), !1;
|
||||
if (f.responseXML instanceof Document) n[l] = f.responseXML.documentElement;
|
||||
else if (DOMParser && DOMParser instanceof Function) {
|
||||
var e;
|
||||
try {
|
||||
var i = new DOMParser;
|
||||
e = i.parseFromString(f.responseText, "text/xml")
|
||||
} catch (t) {
|
||||
e = void 0
|
||||
}
|
||||
if (!e || e.getElementsByTagName("parsererror").length) return t("Unable to parse SVG file: " + r), !1;
|
||||
n[l] = e.documentElement
|
||||
}
|
||||
S(l)
|
||||
}
|
||||
}, f.open("GET", l), f.overrideMimeType && f.overrideMimeType("text/xml"), f.send()
|
||||
}
|
||||
}, C = function(e) {
|
||||
var r = "svg." + e + " {fill: currentColor;}",
|
||||
n = t.head || t.getElementsByTagName("head")[0],
|
||||
i = t.createElement("style");
|
||||
i.type = "text/css", i.styleSheet ? i.styleSheet.cssText = r : i.appendChild(t.createTextNode(r)), n.appendChild(i)
|
||||
}, x = function(e, t, r) {
|
||||
r ? e.className.replace(t, "") : e.className += " " + t
|
||||
}, k = function(t, r, s, o, c) {
|
||||
var u, v, h, y, S, A, C, x;
|
||||
if (void 0 === (u = b(a, n[t], r)) || "string" == typeof u) return S = o.getAttribute("data-fallback-svg"), S = !(!S && !a.svgFallbackDir) && a.svgFallbackDir + "/" + r + ".svg", S ? (o.setAttribute("data-src", S), i.elements.splice(i.elements.indexOf(o), 1), G(o, s)) : s(u), !1;
|
||||
u.setAttribute("role", "img"), I.call(u.children || [], function(e) {
|
||||
e instanceof SVGDefsElement || e instanceof SVGTitleElement || e instanceof SVGDescElement || e.setAttribute("role", "presentation")
|
||||
}), y = o.getAttribute("aria-hidden") || u.getAttribute("aria-hidden"), y ? (u.setAttribute("aria-hidden", "true"), C = u.querySelector("title"), x = u.querySelector("desc"), C && u.removeChild(C), x && u.removeChild(x)) : (h = F("desc", u, o, r, !1), v = F("title", u, o, r, !1), (h.length > 0 || v.length > 0) && (A = v + " " + h, u.setAttribute("aria-labelledby", A.trim()))), d(o, u, ["class"]);
|
||||
var k = [].concat(u.getAttribute("class") || [], "injected-svg", o.getAttribute("class") || []).join(" ");
|
||||
u.setAttribute("class", N(k)), f(u, i.count, c), u.removeAttribute("xmlns:a");
|
||||
for (var w, j, E = u.querySelectorAll("script"), T = [], V = 0, O = E.length; V < O; V++)(j = E[V].getAttribute("type")) && "application/ecmascript" !== j && "application/javascript" !== j || (w = E[V].innerText || E[V].textContent, T.push(w), u.removeChild(E[V]));
|
||||
if (T.length > 0 && ("always" === a.evalScripts || "once" === a.evalScripts && !l[t])) {
|
||||
for (var q = 0, L = T.length; q < L; q++) new Function(T[q])(e);
|
||||
l[t] = !0
|
||||
}
|
||||
var M = u.querySelectorAll("style");
|
||||
I.call(M, function(e) {
|
||||
var t = m(u),
|
||||
r = !0;
|
||||
(t.indexOf(a.removeStylesClass) >= 0 || a.removeAllStyles) && t.indexOf(a.keepStylesClass) < 0 ? e.parentNode.removeChild(e) : (p(e, i.count, u, c) > 0 && (r = !1), a.prefixStyleTags && (g(e, i.count, u, c), r = !1), r && (e.textContent += ""))
|
||||
}), o.parentNode?.replaceChild(u, o), delete i.elements[i.elements.indexOf(o)], i.count++, s(u)
|
||||
}, N = function(e) {
|
||||
e = e.split(" ");
|
||||
for (var t = {}, r = e.length, n = []; r--;) t.hasOwnProperty(e[r]) || (t[e[r]] = 1, n.unshift(e[r]));
|
||||
return n.join(" ")
|
||||
}, w = function(e) {
|
||||
return !!(e && e.constructor && e.call && e.apply)
|
||||
}, j = function(e) {
|
||||
return "[object Array]" === Object.prototype.toString.call(e)
|
||||
}, E = function(e, t) {
|
||||
var r = e.getAttribute("class");
|
||||
r = r || "", j(t) && (t = t.join(" ")), t = r + " " + t, e.setAttribute("class", N(t))
|
||||
}, I = Array.prototype.forEach || function(e, t) {
|
||||
if (void 0 === this || null === this || "function" != typeof e) throw new TypeError;
|
||||
var r, n = this.length >>> 0;
|
||||
for (r = 0; r < n; ++r) r in this && e.call(t, this[r], r, this)
|
||||
}, F = function(e, t, r, n, s) {
|
||||
var l, a = n ? n + "-" : "";
|
||||
return a += e + "-" + i.count, l = r.querySelector(e), l ? T(e, t, l.textContent, a, t.firstChild) : (l = t.querySelector(e), l ? l.setAttribute("id", a) : s ? T(e, t, n, a, t.firstChild) : a = ""), a
|
||||
}, T = function(e, r, n, i, s) {
|
||||
var l, a = r.querySelector(e);
|
||||
return l = t.createElementNS(V, e), l.appendChild(t.createTextNode(n)), l.setAttribute("id", i), r.insertBefore(l, s), a && a.parentNode.removeChild(a), l
|
||||
}, r
|
||||
}();
|
||||
"object" == typeof angular ? angular.module("svginjector", []).provider("svgInjectorOptions", function() {
|
||||
var e = {};
|
||||
return {
|
||||
set: function(t) {
|
||||
e = t
|
||||
},
|
||||
$get: function() {
|
||||
return e
|
||||
}
|
||||
}
|
||||
}).factory("svgInjectorFactory", ["svgInjectorOptions", function(e) {
|
||||
return new r(e)
|
||||
}]).directive("svg", ["svgInjectorFactory", function(e) {
|
||||
var t = e.getConfig();
|
||||
return {
|
||||
restrict: "E",
|
||||
link: function(r, n, i) {
|
||||
i.class && i.class.indexOf(t.spriteClassIdName) >= 0 ? i.$observe("class", function() {
|
||||
e.inject(n[0])
|
||||
}) : (i.dataSrc || i.src) && e.inject(n[0])
|
||||
}
|
||||
}
|
||||
}]) : "object" == typeof module && "object" == typeof module.exports ? module.exports = r : "function" == typeof define && define.amd ? define(function() {
|
||||
return r
|
||||
}) : "object" == typeof e && (e.SVGInjector = r)
|
||||
}(window, document);
|
||||
//# sourceMappingURL=./dist/svg-injector.map.js
|
||||
@@ -0,0 +1,704 @@
|
||||
#
|
||||
# File : sak-css-definitions.yaml
|
||||
# Project : Home Assistant
|
||||
# Repository: https://github.com/AmoebeLabs/Home-Assistant-Config
|
||||
#
|
||||
# Author: Mars @ AmoebeLabs.com
|
||||
#
|
||||
# License: CC BY-SA, https://creativecommons.org/licenses/by/4.0/
|
||||
#
|
||||
# -----
|
||||
# Description:
|
||||
# Swiss Army Knife CSS class definitions used to style tools
|
||||
#
|
||||
###############################################################################
|
||||
#sak_css_definitions:
|
||||
- descr: sak-overwrite
|
||||
content: >
|
||||
.sak-state__value {
|
||||
--descr: extra-css;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
#
|
||||
# Toolsets
|
||||
#
|
||||
#------------------------------------------------------------------------------
|
||||
|
||||
- descr: Toolset
|
||||
content: >
|
||||
.toolset__group-outer {
|
||||
overflow: visible;
|
||||
/*filter: drop-shadow(0px 1px 1px rgba(0,0,0,0.8));*/
|
||||
/*filter: url(#shadow);*/
|
||||
}
|
||||
.toolset__group {
|
||||
overflow: visible;
|
||||
/*filter: drop-shadow(0px 1px 1px rgba(0,0,0,0.8));*/
|
||||
/*filter: url(#shadow);*/
|
||||
}
|
||||
|
||||
|
||||
#
|
||||
# Tools in slphabetical order
|
||||
#
|
||||
#------------------------------------------------------------------------------
|
||||
- descr: ArcSlider tool
|
||||
content: >
|
||||
.sak-circslider__group-inner {
|
||||
pointer-events: none;
|
||||
}
|
||||
#as-thumb-group {
|
||||
overflow: visible;
|
||||
pointer-events: all;
|
||||
}
|
||||
#as-label {
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-circslider {
|
||||
overflow: visible;
|
||||
fill: none;
|
||||
stroke: none;
|
||||
pointer-events: none;
|
||||
}
|
||||
.sak-circslider__capture {
|
||||
overflow: visible;
|
||||
pointer-events: all;
|
||||
fill: none;
|
||||
stroke-width: 0;
|
||||
touch-action: manipulation;
|
||||
fill: grey;
|
||||
fill-opacity: 0.1;
|
||||
stroke-width: 0em;
|
||||
stroke: red;
|
||||
}
|
||||
.sak-circslider__active {
|
||||
stroke: var(--theme-sys-color-primary);
|
||||
stroke-width: 4em;
|
||||
pointer-events: all;
|
||||
}
|
||||
.sak-circslider__track {
|
||||
fill: none;
|
||||
stroke-width: 2em;
|
||||
stroke: var(--theme-sys-elevation-surface-neutral10);
|
||||
overflow: visible;
|
||||
pointer-events: all;
|
||||
}
|
||||
.sak-circslider__thumb {
|
||||
overflow: visible;
|
||||
fill: var(--theme-sys-color-primary);
|
||||
fill-opacity: 1;
|
||||
transform-origin: center;
|
||||
transform-box: fill-box;
|
||||
}
|
||||
.sak-circslider__value {
|
||||
overflow: visible;
|
||||
fill: var(--primary-text-color);
|
||||
font-size: 8em;
|
||||
font-weight: 400;
|
||||
dominant-baseline: central;
|
||||
pointer-events: none;
|
||||
}
|
||||
.sak-circslider__uom {
|
||||
overflow: visible;
|
||||
fill: var(--primary-text-color);
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
opacity: 0.7;
|
||||
letter-spacing: 0.05em;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
- descr: Area tool
|
||||
content: >
|
||||
.sak-area {
|
||||
}
|
||||
|
||||
.sak-area__area {
|
||||
font-size: 3em;
|
||||
fill: var(--primary-text-color);
|
||||
opacity: 0.8;
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
- descr: Badge tool
|
||||
content: >
|
||||
.sak-badge {
|
||||
}
|
||||
.sak-badge__left {
|
||||
stroke-width: 0;
|
||||
fill: grey;
|
||||
}
|
||||
.sak-badge__right {
|
||||
stroke-width: 0;
|
||||
fill: var(--theme-gradient-color-03, darkgrey);
|
||||
}
|
||||
|
||||
- descr: Barchart tool
|
||||
content: >
|
||||
.sak-barchart {
|
||||
}
|
||||
.sak-barchart__line {
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
}
|
||||
|
||||
- descr: Circle tool
|
||||
content: >
|
||||
.sak-circle {
|
||||
}
|
||||
.sak-circle__circle {
|
||||
fill: var(--primary-background-color);
|
||||
}
|
||||
|
||||
- descr: Ellipse tool
|
||||
content: >
|
||||
.sak-ellipse {
|
||||
}
|
||||
.sak-ellipse__ellipse {
|
||||
fill: var(--primary-background-color);
|
||||
}
|
||||
|
||||
- descr: Horseshoe tool
|
||||
content: >
|
||||
.sak-horseshoe {
|
||||
}
|
||||
.sak-horseshoe__todo {
|
||||
}
|
||||
|
||||
- descr: Icon tool
|
||||
content: >
|
||||
.sak-icon {
|
||||
}
|
||||
.sak-icon__icon {
|
||||
--mdc-icon-size: 100%;
|
||||
align-self: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
fill: var(--primary-text-color);
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
- descr: Line tool
|
||||
content: >
|
||||
.sak-line {
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-line__line {
|
||||
stroke-linecap: round;
|
||||
stroke: var(--primary-text-color);
|
||||
opacity: 1.0;
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
- descr: Entity Name tool
|
||||
content: >
|
||||
.sak-name {
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-name__name {
|
||||
font-size: 3em;
|
||||
fill: var(--primary-text-color);
|
||||
opacity: 1.0;
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
- descr: Polygon tool
|
||||
content: >
|
||||
.sak-polygon {
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-polygon__regpoly {
|
||||
stroke: var(--primary-text-color);
|
||||
fill: var(--primary-background-color);
|
||||
fill-rule: nonzero;
|
||||
}
|
||||
|
||||
- descr: Rectangle tool
|
||||
content: >
|
||||
.sak-rectangle {
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-rectangle__rectangle {
|
||||
stroke-linecap: round;
|
||||
stroke: var(--primary-text-color);
|
||||
opacity: 1.0;
|
||||
stroke-width: 2em;
|
||||
fill: var(--primary-background-color);
|
||||
}
|
||||
|
||||
- descr: RectEx tool
|
||||
content: >
|
||||
.sak-rectex {
|
||||
}
|
||||
.sak-rectex__rectex {
|
||||
stroke-linecap: round;
|
||||
stroke: var(--primary-text-color);
|
||||
opacity: 1.0;
|
||||
stroke-width: 0;
|
||||
fill: var(--primary-background-color);
|
||||
}
|
||||
|
||||
- descr: Segmented arc tool
|
||||
content: >
|
||||
.sak-segarc {
|
||||
}
|
||||
.sak-segarc__background {
|
||||
stroke-linecap: round;
|
||||
fill: var(--primary-background-color);
|
||||
stroke-width: 0;
|
||||
fill-rule: evenodd;
|
||||
stroke-linejoin: round;
|
||||
}
|
||||
.sak-segarc__foreground {
|
||||
stroke-linecap: round;
|
||||
fill: var(--primary-color);
|
||||
stroke: none;
|
||||
stroke-width: 0.5;
|
||||
fill-rule: evenodd;
|
||||
stroke-linejoin: round;
|
||||
}
|
||||
|
||||
- descr: Slider tool
|
||||
content: >
|
||||
#rs-thumb-group {
|
||||
overflow: visible;
|
||||
}
|
||||
#rs-label {
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-slider {
|
||||
pointer-events: none;
|
||||
overflow: visible;
|
||||
}
|
||||
.sak-slider__capture {
|
||||
overflow: visible;
|
||||
pointer-events: all;
|
||||
fill: none;
|
||||
stroke-width: 0;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
.sak-slider__track {
|
||||
overflow: visible;
|
||||
fill-opacity: 0.38;
|
||||
stroke-width: 0;
|
||||
stroke: var(--primary-text-color);
|
||||
fill: var(--switch-unchecked-track-color);
|
||||
transition: all .5s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
.sak-slider__thumb {
|
||||
overflow: visible;
|
||||
--thumb-stroke: var(--secondary-text-color);
|
||||
stroke: var(--thumb-stroke);
|
||||
fill: var(--primary-background-color);
|
||||
pointer-events: none;
|
||||
}
|
||||
.sak-slider__value {
|
||||
overflow: visible;
|
||||
fill: var(--primary-text-color);
|
||||
font-size: 8em;
|
||||
font-weight: 400;
|
||||
transition: all .5s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
pointer-events: none;
|
||||
dominant-baseline: central;
|
||||
}
|
||||
.sak-slider__uom {
|
||||
overflow: visible;
|
||||
fill: var(--primary-text-color);
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
opacity: 0.7;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
- descr: Entity state/units tool
|
||||
content: >
|
||||
.sak-state {
|
||||
}
|
||||
.sak-state__value {
|
||||
--descr: original;
|
||||
font-size: 3em;
|
||||
fill: var(--primary-text-color);
|
||||
opacity: 1.0;
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
.sak-state__uom {
|
||||
fill: var(--primary-text-color);
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
opacity: 0.7;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
- descr: Switch tool
|
||||
content: >
|
||||
.sak-switch {
|
||||
}
|
||||
.sak-switch__track {
|
||||
fill-opacity: 0.38;
|
||||
stroke-width: 0;
|
||||
stroke: var(--primary-text-color);
|
||||
fill: var(--primary-background-color);
|
||||
transition: all .5s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
.sak-switch__thumb {
|
||||
--thumb-stroke: var(--secondary-text-color);
|
||||
stroke: var(--thumb-stroke);
|
||||
fill: var(--primary-background-color);
|
||||
transition: all .5s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
- descr: Text tool
|
||||
content: >
|
||||
.sak-text {
|
||||
}
|
||||
.sak-text__text {
|
||||
font-size: 3em;
|
||||
fill: var(--primary-text-color);
|
||||
opacity: 1.0;
|
||||
text-anchor: middle;
|
||||
dominant-baseline: central;
|
||||
}
|
||||
|
||||
- descr: Usersvg tool
|
||||
content: >
|
||||
.sak-usersvg__group {
|
||||
}
|
||||
.sak-usersvg__image {
|
||||
}
|
||||
|
||||
#
|
||||
# CSS Animations using keyframes
|
||||
#
|
||||
#------------------------------------------------------------------------------
|
||||
- descr: CSS Animations
|
||||
content: >
|
||||
@keyframes blinkingText {
|
||||
0%{ opacity: 0%; }
|
||||
49%{ opacity: 0%; }
|
||||
60%{ opacity: 100%; }
|
||||
99%{ opacity: 100%; }
|
||||
100%{ opacity: 0%; }
|
||||
}
|
||||
|
||||
@keyframes zoomOut {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0;
|
||||
transform: scale3d(0.3, 0.3, 0.3);
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bounce {
|
||||
from,
|
||||
20%,
|
||||
53%,
|
||||
80%,
|
||||
to {
|
||||
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
40%,
|
||||
43% {
|
||||
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
||||
transform: translate3d(0, -30px, 0);
|
||||
}
|
||||
70% {
|
||||
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
||||
transform: translate3d(0, -15px, 0);
|
||||
}
|
||||
90% {
|
||||
transform: translate3d(0, -4px, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes flash {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes flash {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.2;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes flashold {
|
||||
from,
|
||||
50%,
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
25%,
|
||||
75% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes headShake {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
6.5% {
|
||||
transform: translateX(-6px) rotateY(-9deg);
|
||||
}
|
||||
18.5% {
|
||||
transform: translateX(5px) rotateY(7deg);
|
||||
}
|
||||
31.5% {
|
||||
transform: translateX(-3px) rotateY(-5deg);
|
||||
}
|
||||
43.5% {
|
||||
transform: translateX(2px) rotateY(3deg);
|
||||
}
|
||||
50% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes heartBeat {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
14% {
|
||||
transform: scale(1.3);
|
||||
}
|
||||
28% {
|
||||
transform: scale(1);
|
||||
}
|
||||
42% {
|
||||
transform: scale(1.3);
|
||||
}
|
||||
70% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes jello {
|
||||
from,
|
||||
11.1%,
|
||||
to {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
22.2% {
|
||||
transform: skewX(-12.5deg) skewY(-12.5deg);
|
||||
}
|
||||
33.3% {
|
||||
transform: skewX(6.25deg) skewY(6.25deg);
|
||||
}
|
||||
44.4% {
|
||||
transform: skewX(-3.125deg) skewY(-3.125deg);
|
||||
}
|
||||
55.5% {
|
||||
transform: skewX(1.5625deg) skewY(1.5625deg);
|
||||
}
|
||||
66.6% {
|
||||
transform: skewX(-0.78125deg) skewY(-0.78125deg);
|
||||
}
|
||||
77.7% {
|
||||
transform: skewX(0.390625deg) skewY(0.390625deg);
|
||||
}
|
||||
88.8% {
|
||||
transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
from {
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
50% {
|
||||
transform: scale3d(1.05, 1.05, 1.05);
|
||||
}
|
||||
to {
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rubberBand {
|
||||
from {
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
30% {
|
||||
transform: scale3d(1.25, 0.75, 1);
|
||||
}
|
||||
40% {
|
||||
transform: scale3d(0.75, 1.25, 1);
|
||||
}
|
||||
50% {
|
||||
transform: scale3d(1.15, 0.85, 1);
|
||||
}
|
||||
65% {
|
||||
transform: scale3d(0.95, 1.05, 1);
|
||||
}
|
||||
75% {
|
||||
transform: scale3d(1.05, 0.95, 1);
|
||||
}
|
||||
to {
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes shake {
|
||||
from,
|
||||
to {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
10%,
|
||||
30%,
|
||||
50%,
|
||||
70%,
|
||||
90% {
|
||||
transform: translate3d(-10px, 0, 0);
|
||||
}
|
||||
20%,
|
||||
40%,
|
||||
60%,
|
||||
80% {
|
||||
transform: translate3d(10px, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes swing {
|
||||
20% {
|
||||
transform: rotate3d(0, 0, 1, 15deg);
|
||||
}
|
||||
40% {
|
||||
transform: rotate3d(0, 0, 1, -10deg);
|
||||
}
|
||||
60% {
|
||||
transform: rotate3d(0, 0, 1, 5deg);
|
||||
}
|
||||
80% {
|
||||
transform: rotate3d(0, 0, 1, -5deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate3d(0, 0, 1, 0deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes tada {
|
||||
from {
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
10%,
|
||||
20% {
|
||||
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
|
||||
}
|
||||
30%,
|
||||
50%,
|
||||
70%,
|
||||
90% {
|
||||
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
|
||||
}
|
||||
40%,
|
||||
60%,
|
||||
80% {
|
||||
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
|
||||
}
|
||||
to {
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes wobble {
|
||||
from {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
15% {
|
||||
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
|
||||
}
|
||||
30% {
|
||||
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
|
||||
}
|
||||
45% {
|
||||
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
|
||||
}
|
||||
60% {
|
||||
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
|
||||
}
|
||||
75% {
|
||||
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
|
||||
}
|
||||
to {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes spinold {
|
||||
from {
|
||||
-webkit-transform: -webkit-rotate(0deg);
|
||||
transform:rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-webkit-transform: -webkit-rotate(360deg);
|
||||
transform:rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spinn {
|
||||
100% {
|
||||
-webkit-transform: -webkit-rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes spinn {
|
||||
100% {
|
||||
-webkit-transform: -webkit-rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spin-stop {
|
||||
100% {
|
||||
-webkit-transform: -webkit-rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,427 @@
|
||||
#
|
||||
# File : sak-svg-definitions.yaml
|
||||
# Project : Home Assistant
|
||||
# Repository: https://github.com/AmoebeLabs/Home-Assistant-Config
|
||||
#
|
||||
# Author: Mars @ AmoebeLabs.com
|
||||
#
|
||||
# License: CC BY-SA, https://creativecommons.org/licenses/by/4.0/
|
||||
#
|
||||
# -----
|
||||
# Description:
|
||||
# Swiss Army Knife SVG <def> definitions
|
||||
#
|
||||
###############################################################################
|
||||
#sak_svg_definitions:
|
||||
# Light color temperature gradient
|
||||
# HA uses: linear-gradient( right, rgb(255, 160, 0) 0%, white 50%, rgb(166, 209, 255) 100% );
|
||||
# Then converted to SVG using https://www.kmhcreative.com/downloads/CSS2SVG.htm gives:
|
||||
|
||||
# ===== Inset shadow filters =====
|
||||
|
||||
# SVG inner shadow on rgba fill: https://codepen.io/salsita/pen/qBbmYMw
|
||||
# Damien Jurado Poster Rebound: https://codepen.io/dylanbaumann/pen/wevMwB
|
||||
- descr: sak-inset-1 filter
|
||||
content: |
|
||||
<filter id="sak-inset-1" x="-50%" y="-50%" width="400%" height="400%">
|
||||
<feComponentTransfer in=SourceAlpha>
|
||||
<feFuncA type="table" tableValues="1 0" />
|
||||
</feComponentTransfer>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feOffset dx="0" dy="1" result="offsetblur"/>
|
||||
<feFlood flood-color="rgba(0, 0, 0, 0.3)" result="color"/>
|
||||
<feComposite in2="offsetblur" operator="in"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" />
|
||||
<feMerge>
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
<feMergeNode />
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
# SVG Inset Shadow: https://codepen.io/mattrosno/pen/zxpNwd
|
||||
- descr: sak-inset-2 filter
|
||||
content: |
|
||||
<filter id="sak-inset-2">
|
||||
<!-- Shadow Offset -->
|
||||
<feOffset
|
||||
dx='1'
|
||||
dy='1'
|
||||
/>
|
||||
<!-- Shadow Blur -->
|
||||
<feGaussianBlur
|
||||
stdDeviation='0.5'
|
||||
result='offset-blur'
|
||||
/>
|
||||
<!-- Invert the drop shadow
|
||||
to create an inner shadow -->
|
||||
<feComposite
|
||||
operator='out'
|
||||
in='SourceGraphic'
|
||||
in2='offset-blur'
|
||||
result='inverse'
|
||||
/>
|
||||
<!-- Color & Opacity -->
|
||||
<feFlood
|
||||
flood-color='black'
|
||||
flood-opacity='0.4'
|
||||
result='color'
|
||||
/>
|
||||
<!-- Clip color inside shadow -->
|
||||
<feComposite
|
||||
operator='in'
|
||||
in='color'
|
||||
in2='inverse'
|
||||
result='shadow'
|
||||
/>
|
||||
<!-- Put shadow over original object -->
|
||||
<feComposite
|
||||
operator='over'
|
||||
in='shadow'
|
||||
in2='SourceGraphic'
|
||||
/>
|
||||
</filter>
|
||||
|
||||
# ===== Neumorphic filters =====
|
||||
- descr: sak-neumorphic filters
|
||||
content: |
|
||||
<!-- Neumorphic filter -->
|
||||
<!-- -->
|
||||
<!-- Light Shadow, #FFFFFF at 50%, x:-6, Y:-6, Blur:16 -->
|
||||
<!-- Dark Shadow: #d1cdc7 at 50%, x:6, y:6, Blur:16 -->
|
||||
<!-- Main Background: #efeeee -->
|
||||
<!-- Shape Background: #efeeee -->
|
||||
<!-- Optional Border: #fff at 20% Alpha -->
|
||||
<!-- Dark Shadow was: 0d2750 -->
|
||||
|
||||
<!-- 2021.11.17 -->
|
||||
<!-- Performance with inset shadow and width/height=150% seems to be optimal setting -->
|
||||
<!-- Smaller settings give clipping, and larger settings performance hits -->
|
||||
<!-- Absolute settings (userSpaceOnUse) seem to be difficult to find right settings -->
|
||||
<filter id="is-1" x="-25%" y="-25%" width="150%" height="150%">
|
||||
<feComponentTransfer in=SourceAlpha>
|
||||
<feFuncA type="table" tableValues="1 0" />
|
||||
</feComponentTransfer>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feOffset dx="2" dy="2" result="offsetblur"/>
|
||||
<feFlood flood-color="#0d2750" flood-opacity="0.5" result="color"/>
|
||||
<feComposite in2="offsetblur" operator="in"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" />
|
||||
<feMerge>
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
<feMergeNode />
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="is-1b" filterUnits="userSpaceOnUse" x="-200" y="-200" width="1000" height="1000">
|
||||
<feComponentTransfer in=SourceAlpha>
|
||||
<feFuncA type="table" tableValues="1 0" />
|
||||
</feComponentTransfer>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feOffset dx="2" dy="2" result="offsetblur"/>
|
||||
<feFlood flood-color="#0d2750" flood-opacity="0.5" result="color"/>
|
||||
<feComposite in2="offsetblur" operator="in"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" />
|
||||
<feMerge>
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
<feMergeNode />
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<!-- Using feComposite in="offsetblur" operator="in" instead of in2 gives a -->
|
||||
<!-- much larger shadow area, much deeper! WHY?? -->
|
||||
|
||||
<filter id="nm-2" x="-50%" y="-50%" width="200%" height="200%">
|
||||
<feComponentTransfer in=SourceAlpha out=transfer>
|
||||
<feFuncA type="table" tableValues="1 0" />
|
||||
</feComponentTransfer>
|
||||
|
||||
<feGaussianBlur input="transfer" stdDeviation="5" result="blurdark"/>
|
||||
<feOffset input="blurdark" dx="12" dy="12" result="offsetblurdark"/>
|
||||
<feFlood input="offsetblurdark" flood-color="#d1cdc7" flood-opacity="0.4" result="colordark"/>
|
||||
|
||||
<feGaussianBlur input="transfer" stdDeviation="5" result="blurlight"/>
|
||||
<feOffset input="blurlight" dx="-12" dy="-12" result="offsetblurlight"/>
|
||||
<feFlood input="offsetblurlight" flood-color="white" flood-opacity="0.9" result="colorlight"/>
|
||||
|
||||
<feComposite in="offsetblurdark" operator="in"/>
|
||||
<feComposite in="SourceAlpha" operator="in" />
|
||||
|
||||
<feMerge>
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
<feMergeNode />
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="filter-yoksel" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="linearRGB">
|
||||
<feFlood flood-color="#eeebe7" flood-opacity="0.7" x="0%" y="0%" width="100%" height="100%" result="flood2"/>
|
||||
<feComposite in="flood2" in2="SourceAlpha" operator="out" x="0%" y="0%" width="100%" height="100%" result="composite5"/>
|
||||
<feOffset dx="-9" dy="-7" x="0%" y="0%" width="100%" height="100%" in="composite5" result="offset1"/>
|
||||
<feGaussianBlur stdDeviation="3 10" x="0%" y="0%" width="100%" height="100%" in="offset1" edgeMode="none" result="blur2"/>
|
||||
<feComposite in="merge3" in2="SourceAlpha" operator="in" x="0%" y="0%" width="100%" height="100%" result="composite7"/>
|
||||
<feFlood flood-color="#0f0f0f" flood-opacity="1" x="0%" y="0%" width="100%" height="100%" result="flood4"/>
|
||||
<feComposite in="flood4" in2="SourceAlpha" operator="out" x="0%" y="0%" width="100%" height="100%" result="composite8"/>
|
||||
<feOffset dx="6" dy="6" x="0%" y="0%" width="100%" height="100%" in="merge3" result="offset2"/>
|
||||
<feGaussianBlur stdDeviation="3 10" x="0%" y="0%" width="100%" height="100%" in="offset2" edgeMode="none" result="blur3"/>
|
||||
<feComposite in="blur3" in2="SourceAlpha" operator="in" x="0%" y="0%" width="100%" height="100%" result="composite9"/>
|
||||
<feMerge x="0%" y="0%" width="100%" height="100%" result="merge3">
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
<feMergeNode in="composite7"/>
|
||||
<feMergeNode in="composite9"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<!-- 2021.11.15 -->
|
||||
<!-- For some reason, changing the filter width/height from 160% to 600% improves performance on iOS 15 -->
|
||||
|
||||
<!-- second try... -->
|
||||
<filter id="filter" x="-50%" y="-50%" width="300%" height="300%">
|
||||
<feFlood flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="flood2"/>
|
||||
<feComposite in="flood2" in2="SourceAlpha" operator="out" result="composite5"/>
|
||||
<feOffset dx="-6" dy="-6" in="composite5" result="offset1"/>
|
||||
<feGaussianBlur stdDeviation="5" in="offset1" edgeMode="none" result="blur2"/>
|
||||
<feComposite in="blur2" in2="SourceAlpha" operator="in" result="composite7"/>
|
||||
|
||||
<!-- flood-color="#777777" -->
|
||||
<feFlood flood-color="var(--cs-theme-shadow-darker)" flood-opacity="1" result="flood4"/>
|
||||
<feComposite in="flood4" in2="SourceAlpha" operator="out" result="composite8"/>
|
||||
<feOffset dx="6" dy="6" in="composite8" result="offset2"/>
|
||||
<feGaussianBlur stdDeviation="15" in="offset2" edgeMode="none" result="blur3"/>
|
||||
<feComposite in="blur3" in2="SourceAlpha" operator="in" result="composite9"/>
|
||||
|
||||
<feMerge result="merge3">
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
<feMergeNode in="composite7"/>
|
||||
<feMergeNode in="composite9"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="filterb" filterUnits="userSpaceOnUse" x="-200" y="-200" width="1000" height="1000">
|
||||
<feFlood flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="flood2"/>
|
||||
<feComposite in="flood2" in2="SourceAlpha" operator="out" result="composite5"/>
|
||||
<feOffset dx="-6" dy="-6" in="composite5" result="offset1"/>
|
||||
<feGaussianBlur stdDeviation="5" in="offset1" edgeMode="none" result="blur2"/>
|
||||
<feComposite in="blur2" in2="SourceAlpha" operator="in" result="composite7"/>
|
||||
|
||||
<!-- flood-color="#777777" -->
|
||||
<feFlood flood-color="var(--cs-theme-shadow-darker)" flood-opacity="1" result="flood4"/>
|
||||
<feComposite in="flood4" in2="SourceAlpha" operator="out" result="composite8"/>
|
||||
<feOffset dx="6" dy="6" in="composite8" result="offset2"/>
|
||||
<feGaussianBlur stdDeviation="15" in="offset2" edgeMode="none" result="blur3"/>
|
||||
<feComposite in="blur3" in2="SourceAlpha" operator="in" result="composite9"/>
|
||||
|
||||
<feMerge result="merge3">
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
<feMergeNode in="composite7"/>
|
||||
<feMergeNode in="composite9"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="bold" x="-50%" y="-50%" width="240%" height="240%">
|
||||
<feFlood flood-color="#FFFFFF" flood-opacity="0.8" result="flood2"/>
|
||||
<feComposite in="flood2" in2="SourceAlpha" operator="out" result="composite5"/>
|
||||
<feOffset dx="12" dy="12" in="composite5" result="offset1"/>
|
||||
<feGaussianBlur stdDeviation="5" in="offset1" edgeMode="none" result="blur2"/>
|
||||
<feComposite in="blur2" in2="SourceAlpha" operator="in" result="composite7"/>
|
||||
|
||||
<feFlood flood-color="#777777" flood-opacity="0.6" result="flood4"/>
|
||||
<feComposite in="flood4" in2="SourceAlpha" operator="out" result="composite8"/>
|
||||
<feOffset dx="-12" dy="-12" in="composite8" result="offset2"/>
|
||||
<feGaussianBlur stdDeviation="15" in="offset2" edgeMode="none" result="blur3"/>
|
||||
<feComposite in="blur3" in2="SourceAlpha" operator="in" result="composite9"/>
|
||||
|
||||
<feMerge result="merge3">
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
<feMergeNode in="composite7"/>
|
||||
<feMergeNode in="composite9"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="filterss" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feFlood flood-color="#eeebe7" flood-opacity="0.9" result="flood2"/>
|
||||
<feComposite in="flood2" in2="SourceAlpha" operator="out" result="composite5"/>
|
||||
<feOffset dx="-15" dy="-15" in="composite5" result="offset1"/>
|
||||
<feGaussianBlur stdDeviation="5" in="offset1" edgeMode="none" result="blur2"/>
|
||||
<feComposite in="blur2" in2="SourceAlpha" operator="in" result="composite7"/>
|
||||
|
||||
<feFlood flood-color="#0f0f0f" flood-opacity="1" result="flood4"/>
|
||||
<feComposite in="flood4" in2="SourceAlpha" operator="out" result="composite8"/>
|
||||
<feOffset dx="6" dy="6" in="composite8" result="offset2"/>
|
||||
<feGaussianBlur stdDeviation="5" in="offset2" edgeMode="none" result="blur3"/>
|
||||
<feComposite in="blur3" in2="SourceAlpha" operator="in" result="composite9"/>
|
||||
|
||||
<feMerge result="merge3">
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
<feMergeNode in="composite7"/>
|
||||
<feMergeNode in="composite9"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<!-- flood-color="#d1cdc7" -->
|
||||
<!-- flood-color="#FFFFFF" -->
|
||||
<filter id="nm-11" x="-50%" y="-50%" width="300%" height="300%">
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic"
|
||||
dx="6" dy="6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"
|
||||
</feDropShadow>
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic"
|
||||
dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<!-- 2021.11.15 -->
|
||||
<!-- For some reason, changing the filter width/height from 300% to 600% improves performance on iOS 15 -->
|
||||
<!-- Changing this value to 3000% improves performance also, but pixelates some of the views, so unusable! -->
|
||||
<!-- A value of 1000% seems to be a good value too! Switching views is now instant again for some reason! -->
|
||||
<!-- However, some views (sake5) becomes very, very, very slow. Views sake4 and sake6 are very fast. -->
|
||||
<!-- 2021.11.17 -->
|
||||
<!-- Let's settle for now with x/y=-10% and width/height=120%. This is actually the default for svg filters... -->
|
||||
|
||||
<filter id="sak-nm-default" x="-10%" y="-10%" width="120%" height="120%">
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic" dx="6" dy="6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"/>
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic" dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="nm-1" x="-10%" y="-10%" width="120%" height="120%">
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic" dx="6" dy="6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"/>
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic" dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="sak-nm-default-b" filterUnits="userSpaceOnUse" x="-100" y="-100" width="5000" height="800">
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic" dx="6" dy="6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"/>
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic" dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="nm-1b" filterUnits="userSpaceOnUse" x="-200" y="-200" width="2000" height="2000">
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic" dx="6" dy="6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"/>
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic" dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="nm-1-reverse" x="-10%" y="-10%" width="120%" height="120%">
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic" dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"/>
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic" dx="6" dy="6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
<filter id="nm-1b-reverse" filterUnits="userSpaceOnUse" primitiveUnits="userSpaceOnUse" x="0" y="0" width="1000" height="1000">
|
||||
<feDropShadow stdDeviation="4.5" in="SourceGraphic" dx="-6" dy="-6" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5" result="dropShadow"/>
|
||||
<feDropShadow stdDeviation="5" in="SourceGraphic" dx="6" dy="6" flood-color="var(--cs-theme-shadow-lighter)" flood-opacity="1" result="dropShadow1"/>
|
||||
<feMerge result="merge">
|
||||
<feMergeNode in="dropShadow1"/>
|
||||
<feMergeNode in="dropShadow"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
|
||||
# ===== Drop shadow filters =====
|
||||
|
||||
- descr: shadow from https://css-tricks.com/adding-shadows-to-svg-icons-with-css-and-svg-filters/
|
||||
content: |
|
||||
<filter id='shadow' color-interpolation-filters="sRGB">
|
||||
<feDropShadow dx="2" dy="2" stdDeviation="3" flood-color="var(--cs-theme-shadow-darker)" flood-opacity="0.5"/>
|
||||
</filter>
|
||||
|
||||
- descr: sak-drop-shadow filters
|
||||
content: |
|
||||
<filter id="sak-drop-1" y="-50%" x="-50%" width="200%" height="400%">
|
||||
<feDropShadow dx="0" dy="1.5" flood-color="var(--cs-theme-shadow-darker)" stdDeviation=".3"/>
|
||||
</filter>
|
||||
|
||||
<filter id="sak-drop-1a" y="-50%" x="-50%" width="200%" height="400%">
|
||||
<feDropShadow dx="1" dy="2" flood-color="var(--cs-theme-shadow-darker)" stdDeviation=".5"/>
|
||||
</filter>
|
||||
|
||||
<filter id="sak-drop-1b" y="-50%" x="-50%" width="200%" height="400%">
|
||||
<feDropShadow dx="2" dy="4" flood-color="var(--cs-theme-shadow-darker)" stdDeviation="6"/>
|
||||
</filter>
|
||||
|
||||
<filter id="sak-drop-2" width="10" height="10">
|
||||
<feDropShadow dx="2" dy="3" flood-color="var(--cs-theme-shadow-darker)" stdDeviation="0.5"/>
|
||||
</filter>
|
||||
|
||||
<filter id="sak-drop-3" x="0" y="0" width="200%" height="200%">
|
||||
<feOffset result="offOut" in="SourceAlpha" dx="20" dy="20" />
|
||||
<feGaussianBlur result="blurOut" in="offOut" stdDeviation="10" />
|
||||
<feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
|
||||
</filter>
|
||||
|
||||
<filter id="sak-drop-4" x="0" y="0" width="200%" height="200%">
|
||||
<feGaussianBlur stdDeviation="1" />
|
||||
</filter>
|
||||
|
||||
# ===== Markers (testing segmented arc) =====
|
||||
|
||||
- descr: sak-markers
|
||||
content: |
|
||||
<marker viewBox="0 0 200 200" id="markerCircle" markerWidth="8" markerHeight="8" refX="5" refY="5">
|
||||
<circle cx="5" cy="5" r="3" style="stroke: none; fill:currentColor;"/>
|
||||
</marker>
|
||||
|
||||
<marker viewBox="0 0 200 200" id="markerArrow" markerWidth="13" markerHeight="13" refX="2" refY="6"
|
||||
orient="auto">
|
||||
<path d="M2,2 L2,11 L10,6 L2,2" style="fill: currentColor;" />
|
||||
</marker>
|
||||
|
||||
# ===== Clip path test =====
|
||||
|
||||
- descr: sak-clip-path tests
|
||||
content: |
|
||||
<rect id="cliprect" width="100%" height="100%" fill="none" stroke="none" rx="3" />
|
||||
<clipPath id="clip">
|
||||
<use xlink:href="#cliprect"/>
|
||||
</clipPath>
|
||||
|
||||
# ===== Gradients =====
|
||||
|
||||
- descr: sak-gradients
|
||||
content: |
|
||||
<linearGradient id="sak-light-brightness-gradient" x1="1" x2="0">
|
||||
<stop stop-color="#eeeeee"/>
|
||||
<stop offset="1" stop-color="#555555"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="sak-light-brightness-gradient--orange" x1="1" x2="0">
|
||||
<stop stop-color="white"/>
|
||||
<stop offset="1" stop-color="darkorange"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="sak-light-brightness-gradient--reverse" x1="1" x2="0">
|
||||
<stop stop-color="#555555"/>
|
||||
<stop offset="1" stop-color="#eeeeee"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="sak-light-color-temperature-gradient" x1="1" x2="0">
|
||||
<stop stop-color="#ffa000"/>
|
||||
<stop offset=".5" stop-color="#fff"/>
|
||||
<stop offset="1" stop-color="#a6d1ff"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="sak-boiler-setpoint-blue-orange-gradient" x1="1" x2="0">
|
||||
<stop stop-color="#ff8c00"/>
|
||||
<stop offset="1" stop-color="#0094ff"/>
|
||||
</linearGradient>
|
||||
|
||||
<radialGradient id="sak-mask-radial-gradient">
|
||||
<stop offset="0" stop-color="white" stop-opacity="1"/>
|
||||
<stop offset="0.8" stop-color="white" stop-opacity="0.8"/>
|
||||
<stop offset="1" stop-color="white" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
@@ -0,0 +1,6 @@
|
||||
#definitions: !include_dir_merge_named definitions
|
||||
definitions:
|
||||
sak_css_definitions:
|
||||
!include sak-css-definitions.yml
|
||||
sak_svg_definitions:
|
||||
!include sak-svg-definitions.yml
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 45 KiB After Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 45 KiB |
Reference in New Issue
Block a user