diff --git a/package.json b/package.json index 97f423e..0a2cfd7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-dark-mode-toggle-2", - "version": "2.0.4", + "version": "2.0.5", "description": "An updated, cute dark mode toggle button for React.", "module": "dist/index.es.js", "types": "dist/index.d.ts", @@ -93,5 +93,8 @@ "./{src,stories}/**/*.{ts,tsx,js,jsx}": [ "prettier --write" ] + }, + "prettier": { + "printWidth": 120 } } diff --git a/src/animationData.json b/src/animationData.json index 5e28c54..5a8d4dd 100644 --- a/src/animationData.json +++ b/src/animationData.json @@ -1 +1,4005 @@ -{"v":"5.3.4","fr":24,"ip":0,"op":96,"w":500,"h":500,"nm":"Toggle","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shutting Star","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,250,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-11.168,-2.743],[-25,-28]],"o":[[28.5,7],[28.361,31.764]],"v":[[-126,-24.5],[-27,37.5]],"c":false},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":32,"s":[0],"e":[100]},{"t":40}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":30,"s":[0],"e":[100]},{"t":37}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim","hd":false},{"ty":"st","c":{"a":0,"k":[0.933333333333,0.992156862745,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":1,"ix":5},"lc":2,"lj":2,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":30,"op":41,"st":30,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Moon","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[-175.595],"e":[0]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[0],"e":[0]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":48,"s":[0],"e":[-175.595]},{"t":72}],"ix":10},"p":{"s":true,"x":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[170],"e":[330]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[330],"e":[330]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":48,"s":[330],"e":[170]},{"t":72}],"ix":3},"y":{"a":0,"k":250,"ix":4}},"a":{"a":0,"k":[60.25,60.25,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[4.981,1.834],[0,7.828],[11.632,0],[2.39,-0.941],[-1.477,0],[0,-11.632],[6.338,-3.63],[0,-5.618],[4.49,-2.06],[0,6.513]],"o":[[6.338,-3.63],[0,-11.632],[-2.724,0],[1.391,-0.289],[11.632,0],[0,7.828],[4.981,1.834],[0,5.263],[6.24,-0.973],[0,-5.619]],"v":[[3.775,7.124],[14.388,-11.16],[-6.674,-32.221],[-14.388,-30.757],[-10.079,-31.2],[10.983,-10.137],[0.37,8.146],[8.911,20.374],[1.297,32.221],[12.317,19.353]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[1.534,0],[0,5.888],[-1.927,1.929],[0,-4.354],[-5.888,0],[-1.93,1.933]],"o":[[-5.887,0],[0,-2.941],[-3.74,1.656],[0,5.887],[2.946,0],[-1.319,0.584]],"v":[[-57.252,37.674],[-67.912,27.014],[-64.794,19.481],[-71.147,29.228],[-60.487,39.888],[-52.944,36.76]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[1,0.940106153488,0.53420650959,1],"e":[0.783999992819,0.944999964097,0.969000004787,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[0.783999992819,0.944999964097,0.969000004787,1],"e":[0.783999992819,0.944999964097,0.969000004787,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":48,"s":[0.783999992819,0.944999964097,0.969000004787,1],"e":[1,0.940106153488,0.53420650959,1]},{"t":72}],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[86.845,53.361],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Shadow","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[4.981,1.834],[0,7.828],[11.632,0],[0,-11.632],[-10.302,-1.374],[0,-3.827],[-7.202,0],[0,7.202]],"o":[[6.338,-3.63],[0,-11.632],[-11.632,0],[0,10.679],[-2.624,2.386],[0,7.202],[7.203,0],[0,-5.619]],"v":[[10.449,7.038],[21.061,-11.246],[0,-32.307],[-21.061,-11.246],[-2.81,9.623],[-7.092,19.266],[5.949,32.307],[18.991,19.266]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[0,-5.888],[5.887,0],[0,5.887],[-5.888,0]],"o":[[0,5.887],[-5.888,0],[0,-5.888],[5.887,0]],"v":[[-43.153,29.141],[-53.813,39.801],[-64.473,29.141],[-53.813,18.481]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[1,0.940106153488,0.53420650959,1],"e":[0.862999949736,0.957000014361,0.969000004787,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[0.862999949736,0.957000014361,0.969000004787,1],"e":[0.862999949736,0.957000014361,0.969000004787,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":48,"s":[0.862999949736,0.957000014361,0.969000004787,1],"e":[1,0.940106153488,0.53420650959,1]},{"t":72}],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[80.171,53.448],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Crater","np":3,"cix":2,"ix":2,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,-33.137],[33.137,0],[0,33.137],[-33.137,0]],"o":[[0,33.137],[-33.137,0],[0,-33.137],[33.137,0]],"v":[[60,0],[0,60],[-60,0],[0,-60]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[1,0.940106153488,0.53420650959,1],"e":[0.933000033509,0.991999966491,1,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[0.933000033509,0.991999966491,1,1],"e":[0.933000033509,0.991999966491,1,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":48,"s":[0.933000033509,0.991999966491,1,1],"e":[1,0.940106153488,0.53420650959,1]},{"t":72}],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[60.25,60.25],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Moon","np":2,"cix":2,"ix":3,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1224,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Stars","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":11,"s":[0],"e":[100]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":13,"s":[100],"e":[100]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":59,"s":[100],"e":[0]},{"t":61}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"s":true,"x":{"a":1,"k":[{"i":{"x":[0.101],"y":[0.954]},"o":{"x":[0.9],"y":[0]},"n":["0p101_0p954_0p9_0"],"t":0,"s":[304.75],"e":[190.55]},{"i":{"x":[0.438],"y":[0.439]},"o":{"x":[0.397],"y":[0.396]},"n":["0p438_0p439_0p397_0p396"],"t":24,"s":[190.55],"e":[184.75]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.899],"y":[-0.043]},"n":["0p1_1_0p899_-0p043"],"t":48,"s":[184.75],"e":[304.75]},{"t":72}],"ix":3},"y":{"a":0,"k":212.75,"ix":4}},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[10,10],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":32,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"fl","c":{"a":0,"k":[0.933333333333,0.992156862745,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-32.5,65],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Star 03","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[6,6],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":32,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"fl","c":{"a":0,"k":[0.933333333333,0.992156862745,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[47.5,45],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Star 02","np":3,"cix":2,"ix":2,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[8,8],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":32,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"fl","c":{"a":0,"k":[0.933333333333,0.992156862745,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Star 01","np":3,"cix":2,"ix":3,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":96,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Cloud 1","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":11,"s":[100],"e":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":13,"s":[0],"e":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":59,"s":[0],"e":[100]},{"t":61}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"s":true,"x":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[275.5],"e":[184]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[184],"e":[184]},{"i":{"x":[0.102],"y":[0.92]},"o":{"x":[0.9],"y":[0]},"n":["0p102_0p92_0p9_0"],"t":48,"s":[184],"e":[269.054]},{"i":{"x":[0.731],"y":[1]},"o":{"x":[0.225],"y":[0.253]},"n":["0p731_1_0p225_0p253"],"t":72,"s":[269.054],"e":[275.5]},{"t":95}],"ix":3},"y":{"a":0,"k":220,"ix":4}},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[4.193,0.263],[4.158,0],[0,0],[0.688,-3.952],[0,0],[0,-4.43],[0,0],[-4.43,0],[0,0],[0,4.43],[0,0]],"o":[[-0.677,-3.965],[0,0],[-4.149,0],[0,0],[-4.43,0],[0,0],[0,4.43],[0,0],[4.43,0],[0,0],[0,-4.259]],"v":[[11.887,-4.516],[3.601,-11.5],[3.601,-11.5],[-4.68,-4.542],[-11.38,-4.542],[-19.401,3.479],[-19.401,3.479],[-11.38,11.5],[11.38,11.5],[19.401,3.479],[19.401,3.479]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":32,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":96,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Cloud 2","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":11,"s":[100],"e":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":13,"s":[0],"e":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":59,"s":[0],"e":[100]},{"t":61}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"s":true,"x":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[330.5],"e":[167.5]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[167.5],"e":[167.5]},{"i":{"x":[0.101],"y":[0.95]},"o":{"x":[0.9],"y":[0]},"n":["0p101_0p95_0p9_0"],"t":48,"s":[167.5],"e":[324.054]},{"i":{"x":[0.731],"y":[1]},"o":{"x":[0.218],"y":[0.284]},"n":["0p731_1_0p218_0p284"],"t":72,"s":[324.054],"e":[330.5]},{"t":95}],"ix":3},"y":{"a":0,"k":265,"ix":4}},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[6.375,0.399],[6.322,0],[0,0],[1.046,-6.009],[0,0],[0,-6.736],[0,0],[-6.736,0],[0,0],[0,6.736],[0,0]],"o":[[-1.03,-6.029],[0,0],[-6.308,0],[0,0],[-6.736,0],[0,0],[0,6.736],[0,0],[6.736,0],[0,0],[0,-6.476]],"v":[[16.075,-1.367],[3.476,-11.986],[3.476,-11.986],[-9.116,-1.406],[-19.304,-1.406],[-31.5,10.79],[-31.5,10.79],[-19.304,22.986],[15.304,22.986],[27.5,10.79],[27.5,10.79]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":32,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":96,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Shadow","sr":1,"ks":{"o":{"a":0,"k":15,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,180,0],"ix":2},"a":{"a":0,"k":[0,-37.154,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[37.432,0],[0,0],[0,-37.432],[0,0],[-0.021,-0.694],[-36.733,0],[0,0],[-1.105,-36.465],[0,0.699],[0,0]],"o":[[0,0],[-37.432,0],[0,0],[0,0.699],[1.105,-36.465],[0,0],[36.733,0],[0.021,-0.694],[0,0],[0,-37.432]],"v":[[82.223,-37.154],[-82.223,-37.154],[-150,30.623],[-150,35.069],[-149.947,37.154],[-82.223,-28.538],[82.223,-28.538],[149.947,37.154],[150,35.069],[150,30.623]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[0.933333333333,0.992156862745,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":1,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Shape 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":96,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"Base","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,180,0],"ix":2},"a":{"a":0,"k":[0,-70,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,140],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":320,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":1,"k":[{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":0,"s":[0.413832724094,0.784281790257,1,1],"e":[0.0580506064,0.077281616628,0.256188720465,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":24,"s":[0.0580506064,0.077281616628,0.256188720465,1],"e":[0.0580506064,0.077281616628,0.256188720465,1]},{"i":{"x":[0.1],"y":[1]},"o":{"x":[0.9],"y":[0]},"n":["0p1_1_0p9_0"],"t":48,"s":[0.0580506064,0.077281616628,0.256188720465,1],"e":[0.413832724094,0.784281790257,1,1]},{"t":72}],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle 1","np":2,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":96,"st":0,"bm":0},{"ddd":0,"ind":8,"ty":4,"nm":"BG","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,250,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[500,500],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":18.8,"ix":5},"lc":1,"lj":1,"ml":4,"ml2":{"a":0,"k":4,"ix":8},"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":true},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":96,"st":0,"bm":0}],"markers":[]} +{ + "v": "5.3.4", + "fr": 24, + "ip": 0, + "op": 96, + "w": 500, + "h": 500, + "nm": "Toggle", + "ddd": 0, + "assets": [], + "layers": [ + { + "ddd": 0, + "ind": 1, + "ty": 4, + "nm": "Shutting Star", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 250, + 250, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + -11.168, + -2.743 + ], + [ + -25, + -28 + ] + ], + "o": [ + [ + 28.5, + 7 + ], + [ + 28.361, + 31.764 + ] + ], + "v": [ + [ + -126, + -24.5 + ], + [ + -27, + 37.5 + ] + ], + "c": false + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "tm", + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 32, + "s": [ + 0 + ], + "e": [ + 100 + ] + }, + { + "t": 40 + } + ], + "ix": 1 + }, + "e": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 30, + "s": [ + 0 + ], + "e": [ + 100 + ] + }, + { + "t": 37 + } + ], + "ix": 2 + }, + "o": { + "a": 0, + "k": 0, + "ix": 3 + }, + "m": 1, + "ix": 2, + "nm": "Trim Paths 1", + "mn": "ADBE Vector Filter - Trim", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 0.933333333333, + 0.992156862745, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 1, + "ix": 5 + }, + "lc": 2, + "lj": 2, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Shape 1", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 30, + "op": 41, + "st": 30, + "bm": 0 + }, + { + "ddd": 0, + "ind": 2, + "ty": 4, + "nm": "Moon", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + -175.595 + ], + "e": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 0 + ], + "e": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 48, + "s": [ + 0 + ], + "e": [ + -175.595 + ] + }, + { + "t": 72 + } + ], + "ix": 10 + }, + "p": { + "s": true, + "x": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 170 + ], + "e": [ + 330 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 330 + ], + "e": [ + 330 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 48, + "s": [ + 330 + ], + "e": [ + 170 + ] + }, + { + "t": 72 + } + ], + "ix": 3 + }, + "y": { + "a": 0, + "k": 250, + "ix": 4 + } + }, + "a": { + "a": 0, + "k": [ + 60.25, + 60.25, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 4.981, + 1.834 + ], + [ + 0, + 7.828 + ], + [ + 11.632, + 0 + ], + [ + 2.39, + -0.941 + ], + [ + -1.477, + 0 + ], + [ + 0, + -11.632 + ], + [ + 6.338, + -3.63 + ], + [ + 0, + -5.618 + ], + [ + 4.49, + -2.06 + ], + [ + 0, + 6.513 + ] + ], + "o": [ + [ + 6.338, + -3.63 + ], + [ + 0, + -11.632 + ], + [ + -2.724, + 0 + ], + [ + 1.391, + -0.289 + ], + [ + 11.632, + 0 + ], + [ + 0, + 7.828 + ], + [ + 4.981, + 1.834 + ], + [ + 0, + 5.263 + ], + [ + 6.24, + -0.973 + ], + [ + 0, + -5.619 + ] + ], + "v": [ + [ + 3.775, + 7.124 + ], + [ + 14.388, + -11.16 + ], + [ + -6.674, + -32.221 + ], + [ + -14.388, + -30.757 + ], + [ + -10.079, + -31.2 + ], + [ + 10.983, + -10.137 + ], + [ + 0.37, + 8.146 + ], + [ + 8.911, + 20.374 + ], + [ + 1.297, + 32.221 + ], + [ + 12.317, + 19.353 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ind": 1, + "ty": "sh", + "ix": 2, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 1.534, + 0 + ], + [ + 0, + 5.888 + ], + [ + -1.927, + 1.929 + ], + [ + 0, + -4.354 + ], + [ + -5.888, + 0 + ], + [ + -1.93, + 1.933 + ] + ], + "o": [ + [ + -5.887, + 0 + ], + [ + 0, + -2.941 + ], + [ + -3.74, + 1.656 + ], + [ + 0, + 5.887 + ], + [ + 2.946, + 0 + ], + [ + -1.319, + 0.584 + ] + ], + "v": [ + [ + -57.252, + 37.674 + ], + [ + -67.912, + 27.014 + ], + [ + -64.794, + 19.481 + ], + [ + -71.147, + 29.228 + ], + [ + -60.487, + 39.888 + ], + [ + -52.944, + 36.76 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 2", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 1, + 0.940106153488, + 0.53420650959, + 1 + ], + "e": [ + 0.783999992819, + 0.944999964097, + 0.969000004787, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 0.783999992819, + 0.944999964097, + 0.969000004787, + 1 + ], + "e": [ + 0.783999992819, + 0.944999964097, + 0.969000004787, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 48, + "s": [ + 0.783999992819, + 0.944999964097, + 0.969000004787, + 1 + ], + "e": [ + 1, + 0.940106153488, + 0.53420650959, + 1 + ] + }, + { + "t": 72 + } + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 86.845, + 53.361 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Shadow", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + }, + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 4.981, + 1.834 + ], + [ + 0, + 7.828 + ], + [ + 11.632, + 0 + ], + [ + 0, + -11.632 + ], + [ + -10.302, + -1.374 + ], + [ + 0, + -3.827 + ], + [ + -7.202, + 0 + ], + [ + 0, + 7.202 + ] + ], + "o": [ + [ + 6.338, + -3.63 + ], + [ + 0, + -11.632 + ], + [ + -11.632, + 0 + ], + [ + 0, + 10.679 + ], + [ + -2.624, + 2.386 + ], + [ + 0, + 7.202 + ], + [ + 7.203, + 0 + ], + [ + 0, + -5.619 + ] + ], + "v": [ + [ + 10.449, + 7.038 + ], + [ + 21.061, + -11.246 + ], + [ + 0, + -32.307 + ], + [ + -21.061, + -11.246 + ], + [ + -2.81, + 9.623 + ], + [ + -7.092, + 19.266 + ], + [ + 5.949, + 32.307 + ], + [ + 18.991, + 19.266 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ind": 1, + "ty": "sh", + "ix": 2, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 0, + -5.888 + ], + [ + 5.887, + 0 + ], + [ + 0, + 5.887 + ], + [ + -5.888, + 0 + ] + ], + "o": [ + [ + 0, + 5.887 + ], + [ + -5.888, + 0 + ], + [ + 0, + -5.888 + ], + [ + 5.887, + 0 + ] + ], + "v": [ + [ + -43.153, + 29.141 + ], + [ + -53.813, + 39.801 + ], + [ + -64.473, + 29.141 + ], + [ + -53.813, + 18.481 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 2", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 1, + 0.940106153488, + 0.53420650959, + 1 + ], + "e": [ + 0.862999949736, + 0.957000014361, + 0.969000004787, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 0.862999949736, + 0.957000014361, + 0.969000004787, + 1 + ], + "e": [ + 0.862999949736, + 0.957000014361, + 0.969000004787, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 48, + "s": [ + 0.862999949736, + 0.957000014361, + 0.969000004787, + 1 + ], + "e": [ + 1, + 0.940106153488, + 0.53420650959, + 1 + ] + }, + { + "t": 72 + } + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 80.171, + 53.448 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Crater", + "np": 3, + "cix": 2, + "ix": 2, + "mn": "ADBE Vector Group", + "hd": false + }, + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 0, + -33.137 + ], + [ + 33.137, + 0 + ], + [ + 0, + 33.137 + ], + [ + -33.137, + 0 + ] + ], + "o": [ + [ + 0, + 33.137 + ], + [ + -33.137, + 0 + ], + [ + 0, + -33.137 + ], + [ + 33.137, + 0 + ] + ], + "v": [ + [ + 60, + 0 + ], + [ + 0, + 60 + ], + [ + -60, + 0 + ], + [ + 0, + -60 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 1, + 0.940106153488, + 0.53420650959, + 1 + ], + "e": [ + 0.933000033509, + 0.991999966491, + 1, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 0.933000033509, + 0.991999966491, + 1, + 1 + ], + "e": [ + 0.933000033509, + 0.991999966491, + 1, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 48, + "s": [ + 0.933000033509, + 0.991999966491, + 1, + 1 + ], + "e": [ + 1, + 0.940106153488, + 0.53420650959, + 1 + ] + }, + { + "t": 72 + } + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 60.25, + 60.25 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Moon", + "np": 2, + "cix": 2, + "ix": 3, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 3, + "ty": 4, + "nm": "Stars", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 11, + "s": [ + 0 + ], + "e": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 13, + "s": [ + 100 + ], + "e": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 59, + "s": [ + 100 + ], + "e": [ + 0 + ] + }, + { + "t": 61 + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "s": true, + "x": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.101 + ], + "y": [ + 0.954 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p101_0p954_0p9_0" + ], + "t": 0, + "s": [ + 304.75 + ], + "e": [ + 190.55 + ] + }, + { + "i": { + "x": [ + 0.438 + ], + "y": [ + 0.439 + ] + }, + "o": { + "x": [ + 0.397 + ], + "y": [ + 0.396 + ] + }, + "n": [ + "0p438_0p439_0p397_0p396" + ], + "t": 24, + "s": [ + 190.55 + ], + "e": [ + 184.75 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.899 + ], + "y": [ + -0.043 + ] + }, + "n": [ + "0p1_1_0p899_-0p043" + ], + "t": 48, + "s": [ + 184.75 + ], + "e": [ + 304.75 + ] + }, + { + "t": 72 + } + ], + "ix": 3 + }, + "y": { + "a": 0, + "k": 212.75, + "ix": 4 + } + }, + "a": { + "a": 0, + "k": [ + 0, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 10, + 10 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 32, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.933333333333, + 0.992156862745, + 1, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -32.5, + 65 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Star 03", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + }, + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 6, + 6 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 32, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.933333333333, + 0.992156862745, + 1, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 47.5, + 45 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Star 02", + "np": 3, + "cix": 2, + "ix": 2, + "mn": "ADBE Vector Group", + "hd": false + }, + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 8, + 8 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 32, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.933333333333, + 0.992156862745, + 1, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Star 01", + "np": 3, + "cix": 2, + "ix": 3, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 4, + "ty": 4, + "nm": "Cloud 1", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 11, + "s": [ + 100 + ], + "e": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 13, + "s": [ + 0 + ], + "e": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 59, + "s": [ + 0 + ], + "e": [ + 100 + ] + }, + { + "t": 61 + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "s": true, + "x": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 275.5 + ], + "e": [ + 184 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 184 + ], + "e": [ + 184 + ] + }, + { + "i": { + "x": [ + 0.102 + ], + "y": [ + 0.92 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p102_0p92_0p9_0" + ], + "t": 48, + "s": [ + 184 + ], + "e": [ + 269.054 + ] + }, + { + "i": { + "x": [ + 0.731 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.225 + ], + "y": [ + 0.253 + ] + }, + "n": [ + "0p731_1_0p225_0p253" + ], + "t": 72, + "s": [ + 269.054 + ], + "e": [ + 275.5 + ] + }, + { + "t": 95 + } + ], + "ix": 3 + }, + "y": { + "a": 0, + "k": 220, + "ix": 4 + } + }, + "a": { + "a": 0, + "k": [ + 0, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 4.193, + 0.263 + ], + [ + 4.158, + 0 + ], + [ + 0, + 0 + ], + [ + 0.688, + -3.952 + ], + [ + 0, + 0 + ], + [ + 0, + -4.43 + ], + [ + 0, + 0 + ], + [ + -4.43, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 4.43 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + -0.677, + -3.965 + ], + [ + 0, + 0 + ], + [ + -4.149, + 0 + ], + [ + 0, + 0 + ], + [ + -4.43, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 4.43 + ], + [ + 0, + 0 + ], + [ + 4.43, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -4.259 + ] + ], + "v": [ + [ + 11.887, + -4.516 + ], + [ + 3.601, + -11.5 + ], + [ + 3.601, + -11.5 + ], + [ + -4.68, + -4.542 + ], + [ + -11.38, + -4.542 + ], + [ + -19.401, + 3.479 + ], + [ + -19.401, + 3.479 + ], + [ + -11.38, + 11.5 + ], + [ + 11.38, + 11.5 + ], + [ + 19.401, + 3.479 + ], + [ + 19.401, + 3.479 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 32, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Shape 1", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 5, + "ty": 4, + "nm": "Cloud 2", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 11, + "s": [ + 100 + ], + "e": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 13, + "s": [ + 0 + ], + "e": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "n": [ + "0p833_0p833_0p167_0p167" + ], + "t": 59, + "s": [ + 0 + ], + "e": [ + 100 + ] + }, + { + "t": 61 + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "s": true, + "x": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 330.5 + ], + "e": [ + 167.5 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 167.5 + ], + "e": [ + 167.5 + ] + }, + { + "i": { + "x": [ + 0.101 + ], + "y": [ + 0.95 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p101_0p95_0p9_0" + ], + "t": 48, + "s": [ + 167.5 + ], + "e": [ + 324.054 + ] + }, + { + "i": { + "x": [ + 0.731 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.218 + ], + "y": [ + 0.284 + ] + }, + "n": [ + "0p731_1_0p218_0p284" + ], + "t": 72, + "s": [ + 324.054 + ], + "e": [ + 330.5 + ] + }, + { + "t": 95 + } + ], + "ix": 3 + }, + "y": { + "a": 0, + "k": 265, + "ix": 4 + } + }, + "a": { + "a": 0, + "k": [ + 0, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 6.375, + 0.399 + ], + [ + 6.322, + 0 + ], + [ + 0, + 0 + ], + [ + 1.046, + -6.009 + ], + [ + 0, + 0 + ], + [ + 0, + -6.736 + ], + [ + 0, + 0 + ], + [ + -6.736, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 6.736 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + -1.03, + -6.029 + ], + [ + 0, + 0 + ], + [ + -6.308, + 0 + ], + [ + 0, + 0 + ], + [ + -6.736, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 6.736 + ], + [ + 0, + 0 + ], + [ + 6.736, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -6.476 + ] + ], + "v": [ + [ + 16.075, + -1.367 + ], + [ + 3.476, + -11.986 + ], + [ + 3.476, + -11.986 + ], + [ + -9.116, + -1.406 + ], + [ + -19.304, + -1.406 + ], + [ + -31.5, + 10.79 + ], + [ + -31.5, + 10.79 + ], + [ + -19.304, + 22.986 + ], + [ + 15.304, + 22.986 + ], + [ + 27.5, + 10.79 + ], + [ + 27.5, + 10.79 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 32, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Shape 1", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 6, + "ty": 4, + "nm": "Shadow", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 15, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 250, + 180, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + -37.154, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 37.432, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -37.432 + ], + [ + 0, + 0 + ], + [ + -0.021, + -0.694 + ], + [ + -36.733, + 0 + ], + [ + 0, + 0 + ], + [ + -1.105, + -36.465 + ], + [ + 0, + 0.699 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + 0, + 0 + ], + [ + -37.432, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 0.699 + ], + [ + 1.105, + -36.465 + ], + [ + 0, + 0 + ], + [ + 36.733, + 0 + ], + [ + 0.021, + -0.694 + ], + [ + 0, + 0 + ], + [ + 0, + -37.432 + ] + ], + "v": [ + [ + 82.223, + -37.154 + ], + [ + -82.223, + -37.154 + ], + [ + -150, + 30.623 + ], + [ + -150, + 35.069 + ], + [ + -149.947, + 37.154 + ], + [ + -82.223, + -28.538 + ], + [ + 82.223, + -28.538 + ], + [ + 149.947, + 37.154 + ], + [ + 150, + 35.069 + ], + [ + 150, + 30.623 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 0.933333333333, + 0.992156862745, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 1, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0, + 0, + 0, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Shape 1", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 7, + "ty": 4, + "nm": "Base", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 250, + 180, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + -70, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ty": "rc", + "d": 1, + "s": { + "a": 0, + "k": [ + 300, + 140 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 320, + "ix": 4 + }, + "nm": "Rectangle Path 1", + "mn": "ADBE Vector Shape - Rect", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 0, + "s": [ + 0.413832724094, + 0.784281790257, + 1, + 1 + ], + "e": [ + 0.0580506064, + 0.077281616628, + 0.256188720465, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 24, + "s": [ + 0.0580506064, + 0.077281616628, + 0.256188720465, + 1 + ], + "e": [ + 0.0580506064, + 0.077281616628, + 0.256188720465, + 1 + ] + }, + { + "i": { + "x": [ + 0.1 + ], + "y": [ + 1 + ] + }, + "o": { + "x": [ + 0.9 + ], + "y": [ + 0 + ] + }, + "n": [ + "0p1_1_0p9_0" + ], + "t": 48, + "s": [ + 0.0580506064, + 0.077281616628, + 0.256188720465, + 1 + ], + "e": [ + 0.413832724094, + 0.784281790257, + 1, + 1 + ] + }, + { + "t": 72 + } + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 100, + "ix": 5 + }, + "r": 1, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Rectangle 1", + "np": 2, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 8, + "ty": 4, + "nm": "BG", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 250, + 250, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ty": "rc", + "d": 1, + "s": { + "a": 0, + "k": [ + 500, + 500 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 4 + }, + "nm": "Rectangle Path 1", + "mn": "ADBE Vector Shape - Rect", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 18.8, + "ix": 5 + }, + "lc": 1, + "lj": 1, + "ml": 4, + "ml2": { + "a": 0, + "k": 4, + "ix": 8 + }, + "nm": "Stroke 1", + "mn": "ADBE Vector Graphic - Stroke", + "hd": true + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100 + ], + "ix": 3 + }, + "r": { + "a": 0, + "k": 0, + "ix": 6 + }, + "o": { + "a": 0, + "k": 100, + "ix": 7 + }, + "sk": { + "a": 0, + "k": 0, + "ix": 4 + }, + "sa": { + "a": 0, + "k": 0, + "ix": 5 + }, + "nm": "Transform" + } + ], + "nm": "Rectangle 1", + "np": 3, + "cix": 2, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 96, + "st": 0, + "bm": 0 + } + ], + "markers": [] +} diff --git a/src/index.tsx b/src/index.tsx index e4f31ac..f7a152d 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,5 +1,5 @@ import * as React from "react"; -import LottiePlayer from "react-lottie-player"; +import LottiePlayerLight from "react-lottie-player/dist/LottiePlayerLight"; import { parseUnit } from "./parseUnit"; import animationData from "./animationData.json"; import type { AnimationSegment } from "lottie-web"; @@ -25,69 +25,52 @@ export declare namespace DarkModeToggle { }; } -const buttonStyles = (sizeValue: number, sizeUnit: string): string => - css({ - cursor: "pointer", - overflow: "hidden", - width: `${sizeValue}${sizeUnit}`, - height: `${sizeValue * 0.5}${sizeUnit}`, - appearance: "none", - border: "none", - backgroundColor: "transparent", - padding: 0, - }); - -const lottieStyles = ( - isLottieReady: boolean, - sizeValue: number, - sizeUnit: string -): string => - css({ - display: isLottieReady ? "flex" : "none", - alignItems: "center", - justifyContent: "center", - marginTop: `${sizeValue * -0.575}${sizeUnit}`, - marginLeft: `${sizeValue * -0.32}${sizeUnit}`, - width: `${sizeValue * 1.65}${sizeUnit}`, - height: `${sizeValue * 1.65}${sizeUnit}`, - }); - -const arePropsEqual = ( - prevProps: DarkModeToggle.Props, - nextProps: DarkModeToggle.Props -) => - prevProps.size === nextProps.size && - prevProps.isDarkMode === nextProps.isDarkMode && - prevProps.speed === nextProps.speed && - prevProps.className === nextProps.className; - +// TODO: Add ESLint export const DarkModeToggle = React.memo( ({ isDarkMode, onChange, size = 85, speed = 1.3, className = "" }) => { const [sizeValue, sizeUnit] = parseUnit(size); - const [isLottieReady, setLottieReady] = React.useState(false); // Hide the toggle until Lottie is ready - const [isReadyToAnimate, setReadyToAnimate] = React.useState(false); // Disable animation of toggle until first click + const [segments, setSegments] = React.useState([0, 0]); + const [goTo, setGoTo] = React.useState(0); + + // Used to hide the LottiePlayer until it attempts to draw it's first frame + const [isLottiePlayerVisible, setLottiePlayerVisible] = React.useState(false); + + // Used to ensure we snap to the initial position of the toggle instead of animating to it + const [isReadyToAnimate, setReadyToAnimate] = React.useState(false); + + // Snap the toggle to it's initial position, do not animate to it + React.useEffect(() => { + setTimeout(() => { + setSegments(isDarkMode ? [40, 41] : [0, 1]); // Snap to initial position + setReadyToAnimate(true); // Enable animations + }, 10); + }, []); + + // Re-adjust 'goTo' and 'segments' based on the current state of the toggle + React.useEffect(() => { + if (!isLottiePlayerVisible) return; - const segmentToGoTo: number = isDarkMode ? 51 : 2; - const segmentsToPlay: AnimationSegment = isDarkMode ? [2, 50] : [51, 96]; + setGoTo(isDarkMode ? 41 : 0); + setSegments(isDarkMode ? [0, 41] : [42, 96]); + }, [isLottiePlayerVisible, isDarkMode]); return ( ); @@ -96,3 +79,38 @@ export const DarkModeToggle = React.memo( ); DarkModeToggle.displayName = "DarkModeToggle"; + +function arePropsEqual(prevProps: DarkModeToggle.Props, nextProps: DarkModeToggle.Props) { + return ( + prevProps.size === nextProps.size && + prevProps.isDarkMode === nextProps.isDarkMode && + prevProps.speed === nextProps.speed && + prevProps.className === nextProps.className + ); +} + +function lottieStyles(isLottieReady: boolean, sizeValue: number, sizeUnit: string): string { + return css({ + // display: "flex", + display: isLottieReady ? "flex" : "none", + alignItems: "center", + justifyContent: "center", + marginTop: `${sizeValue * -0.575}${sizeUnit}`, + marginLeft: `${sizeValue * -0.32}${sizeUnit}`, + width: `${sizeValue * 1.65}${sizeUnit}`, + height: `${sizeValue * 1.65}${sizeUnit}`, + }); +} + +function buttonStyles(sizeValue: number, sizeUnit: string): string { + return css({ + cursor: "pointer", + overflow: "hidden", + width: `${sizeValue}${sizeUnit}`, + height: `${sizeValue * 0.5}${sizeUnit}`, + appearance: "none", + border: "none", + backgroundColor: "transparent", + padding: 0, + }); +}