diff options
author | Roger Zanoni <rzanoni@igalia.com> | 2024-01-03 16:13:11 -0300 |
---|---|---|
committer | Jan-Simon Moeller <jsmoeller@linuxfoundation.org> | 2024-01-29 12:08:06 +0000 |
commit | e57fc753b3a083ddea52dbe4cd003261e836b2d4 (patch) | |
tree | 16ad0c2d7cea4ecd21b5aa485ae38dd04f2a1e18 /src | |
parent | 52aabdb011279871468269802e056f0ec48511e4 (diff) |
Style refresh with square grid motif and blue palette.
It tries to follow the visual language of the flutter sample apps.
Bug-AGL: SPEC-4041
Signed-off-by: Roger Zanoni <rzanoni@igalia.com>
Change-Id: I68f4ebf82ac5cb5dbe856e9ffe5fca26f47b3442
Diffstat (limited to 'src')
-rw-r--r-- | src/images/dashboardTextures.svg | 2527 | ||||
-rw-r--r-- | src/index.html | 34 | ||||
-rw-r--r-- | src/index.js | 5 | ||||
-rw-r--r-- | src/js/app.js | 2 | ||||
-rw-r--r-- | src/styles/app.scss | 8 | ||||
-rw-r--r-- | src/styles/landscape.scss | 5 | ||||
-rw-r--r-- | src/styles/portrait.scss | 5 |
7 files changed, 2555 insertions, 31 deletions
diff --git a/src/images/dashboardTextures.svg b/src/images/dashboardTextures.svg new file mode 100644 index 0000000..04b8767 --- /dev/null +++ b/src/images/dashboardTextures.svg @@ -0,0 +1,2527 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<svg + width="1080.0001" + height="918.05273" + viewBox="0 0 1080.0001 918.05273" + fill="none" + version="1.1" + id="svg402" + sodipodi:docname="dashboardTextures.svg" + inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns="http://www.w3.org/2000/svg" + xmlns:svg="http://www.w3.org/2000/svg"> + <sodipodi:namedview + id="namedview402" + pagecolor="#ffffff" + bordercolor="#000000" + borderopacity="0.25" + inkscape:showpageshadow="2" + inkscape:pageopacity="0.0" + inkscape:pagecheckerboard="0" + inkscape:deskcolor="#d1d1d1" + inkscape:zoom="0.89541239" + inkscape:cx="497.53611" + inkscape:cy="478.55045" + inkscape:window-width="2560" + inkscape:window-height="1371" + inkscape:window-x="0" + inkscape:window-y="0" + inkscape:window-maximized="1" + inkscape:current-layer="svg402" /> + <path + d="M 1080.0001,0 V 918.05276 H 0 L 5.87481e-5,0 Z" + fill="url(#paint0_radial_129_2056)" + fill-opacity="0.3" + id="path1" + style="fill:url(#paint0_radial_129_2056);stroke-width:0.826484" /> + <g + opacity="0.5" + id="g68" + transform="translate(5.87481e-5,-921.94724)"> + <path + d="m 412,1072 h -1 v 648 h 1 z" + fill="url(#paint2_radial_129_2056)" + id="path3" + style="fill:url(#paint2_radial_129_2056)" /> + <path + d="m 812,1072 h -1 v 648 h 1 z" + fill="url(#paint3_radial_129_2056)" + id="path4" + style="fill:url(#paint3_radial_129_2056)" /> + <path + d="m 962,1072 h -1 v 648 h 1 z" + fill="url(#paint4_radial_129_2056)" + id="path5" + style="fill:url(#paint4_radial_129_2056)" /> + <path + d="m 1037,1072 h -1 v 648 h 1 z" + fill="url(#paint5_radial_129_2056)" + id="path6" + style="fill:url(#paint5_radial_129_2056)" /> + <path + d="m 312,1072 h -1 v 648 h 1 z" + fill="url(#paint6_radial_129_2056)" + id="path7" + style="fill:url(#paint6_radial_129_2056)" /> + <path + d="m 712,1072 h -1 v 648 h 1 z" + fill="url(#paint7_radial_129_2056)" + id="path8" + style="fill:url(#paint7_radial_129_2056)" /> + <path + d="m 862,1072 h -1 v 648 h 1 z" + fill="url(#paint8_radial_129_2056)" + id="path9" + style="fill:url(#paint8_radial_129_2056)" /> + <path + d="m 362,1072 h -1 v 648 h 1 z" + fill="url(#paint9_radial_129_2056)" + id="path10" + style="fill:url(#paint9_radial_129_2056)" /> + <path + d="m 762,1072 h -1 v 648 h 1 z" + fill="url(#paint10_radial_129_2056)" + id="path11" + style="fill:url(#paint10_radial_129_2056)" /> + <path + d="m 912,1072 h -1 v 648 h 1 z" + fill="url(#paint11_radial_129_2056)" + id="path12" + style="fill:url(#paint11_radial_129_2056)" /> + <path + d="m 987,1072 h -1 v 648 h 1 z" + fill="url(#paint12_radial_129_2056)" + id="path13" + style="fill:url(#paint12_radial_129_2056)" /> + <path + d="m 262,1072 h -1 v 648 h 1 z" + fill="url(#paint13_radial_129_2056)" + id="path14" + style="fill:url(#paint13_radial_129_2056)" /> + <path + d="m 662,1072 h -1 v 648 h 1 z" + fill="url(#paint14_radial_129_2056)" + id="path15" + style="fill:url(#paint14_radial_129_2056)" /> + <path + d="m 387,1072 h -1 v 648 h 1 z" + fill="url(#paint15_radial_129_2056)" + id="path16" + style="fill:url(#paint15_radial_129_2056)" /> + <path + d="m 787,1072 h -1 v 648 h 1 z" + fill="url(#paint16_radial_129_2056)" + id="path17" + style="fill:url(#paint16_radial_129_2056)" /> + <path + d="m 937,1072 h -1 v 648 h 1 z" + fill="url(#paint17_radial_129_2056)" + id="path18" + style="fill:url(#paint17_radial_129_2056)" /> + <path + d="m 1012,1072 h -1 v 648 h 1 z" + fill="url(#paint18_radial_129_2056)" + id="path19" + style="fill:url(#paint18_radial_129_2056)" /> + <path + d="m 287,1072 h -1 v 648 h 1 z" + fill="url(#paint19_radial_129_2056)" + id="path20" + style="fill:url(#paint19_radial_129_2056)" /> + <path + d="m 687,1072 h -1 v 648 h 1 z" + fill="url(#paint20_radial_129_2056)" + id="path21" + style="fill:url(#paint20_radial_129_2056)" /> + <path + d="m 837,1072 h -1 v 648 h 1 z" + fill="url(#paint21_radial_129_2056)" + id="path22" + style="fill:url(#paint21_radial_129_2056)" /> + <path + d="m 337,1072 h -1 v 648 h 1 z" + fill="url(#paint22_radial_129_2056)" + id="path23" + style="fill:url(#paint22_radial_129_2056)" /> + <path + d="m 737,1072 h -1 v 648 h 1 z" + fill="url(#paint23_radial_129_2056)" + id="path24" + style="fill:url(#paint23_radial_129_2056)" /> + <path + d="m 887,1072 h -1 v 648 h 1 z" + fill="url(#paint24_radial_129_2056)" + id="path25" + style="fill:url(#paint24_radial_129_2056)" /> + <path + d="m 237,1072 h -1 v 648 h 1 z" + fill="url(#paint25_radial_129_2056)" + id="path26" + style="fill:url(#paint25_radial_129_2056)" /> + <path + d="m 637,1072 h -1 v 648 h 1 z" + fill="url(#paint26_radial_129_2056)" + id="path27" + style="fill:url(#paint26_radial_129_2056)" /> + <path + d="m 212,1072 h -1 v 648 h 1 z" + fill="url(#paint27_radial_129_2056)" + id="path28" + style="fill:url(#paint27_radial_129_2056)" /> + <path + d="m 612,1072 h -1 v 648 h 1 z" + fill="url(#paint28_radial_129_2056)" + id="path29" + style="fill:url(#paint28_radial_129_2056)" /> + <path + d="m 112,1072 h -1 v 648 h 1 z" + fill="url(#paint29_radial_129_2056)" + id="path30" + style="fill:url(#paint29_radial_129_2056)" /> + <path + d="m 512,1072 h -1 v 648 h 1 z" + fill="url(#paint30_radial_129_2056)" + id="path31" + style="fill:url(#paint30_radial_129_2056)" /> + <path + d="m 162,1072 h -1 v 648 h 1 z" + fill="url(#paint31_radial_129_2056)" + id="path32" + style="fill:url(#paint31_radial_129_2056)" /> + <path + d="m 562,1072 h -1 v 648 h 1 z" + fill="url(#paint32_radial_129_2056)" + id="path33" + style="fill:url(#paint32_radial_129_2056)" /> + <path + d="m 62,1072 h -1 v 648 h 1 z" + fill="url(#paint33_radial_129_2056)" + id="path34" + style="fill:url(#paint33_radial_129_2056)" /> + <path + d="m 462,1072 h -1 v 648 h 1 z" + fill="url(#paint34_radial_129_2056)" + id="path35" + style="fill:url(#paint34_radial_129_2056)" /> + <path + d="m 187,1072 h -1 v 648 h 1 z" + fill="url(#paint35_radial_129_2056)" + id="path36" + style="fill:url(#paint35_radial_129_2056)" /> + <path + d="m 587,1072 h -1 v 648 h 1 z" + fill="url(#paint36_radial_129_2056)" + id="path37" + style="fill:url(#paint36_radial_129_2056)" /> + <path + d="m 87,1072 h -1 v 648 h 1 z" + fill="url(#paint37_radial_129_2056)" + id="path38" + style="fill:url(#paint37_radial_129_2056)" /> + <path + d="m 487,1072 h -1 v 648 h 1 z" + fill="url(#paint38_radial_129_2056)" + id="path39" + style="fill:url(#paint38_radial_129_2056)" /> + <path + d="m 137,1072 h -1 v 648 h 1 z" + fill="url(#paint39_radial_129_2056)" + id="path40" + style="fill:url(#paint39_radial_129_2056)" /> + <path + d="m 537,1072 h -1 v 648 h 1 z" + fill="url(#paint40_radial_129_2056)" + id="path41" + style="fill:url(#paint40_radial_129_2056)" /> + <path + d="m 37,1072 h -1 v 648 h 1 z" + fill="url(#paint41_radial_129_2056)" + id="path42" + style="fill:url(#paint41_radial_129_2056)" /> + <path + d="m 437,1072 h -1 v 648 h 1 z" + fill="url(#paint42_radial_129_2056)" + id="path43" + style="fill:url(#paint42_radial_129_2056)" /> + <path + d="M 1052,1095.04 H 20 v 1 h 1032 z" + fill="url(#paint43_radial_129_2056)" + id="path44" + style="fill:url(#paint43_radial_129_2056)" /> + <path + d="M 1052,1295.34 H 20 v 1.01 h 1032 z" + fill="url(#paint44_radial_129_2056)" + id="path45" + style="fill:url(#paint44_radial_129_2056)" /> + <path + d="M 1052,1495.65 H 20 v 1.01 h 1032 z" + fill="url(#paint45_radial_129_2056)" + id="path46" + style="fill:url(#paint45_radial_129_2056)" /> + <path + d="M 1052,1195.19 H 20 v 1 h 1032 z" + fill="url(#paint46_radial_129_2056)" + id="path47" + style="fill:url(#paint46_radial_129_2056)" /> + <path + d="M 1052,1395.5 H 20 v 1 h 1032 z" + fill="url(#paint47_radial_129_2056)" + id="path48" + style="fill:url(#paint47_radial_129_2056)" /> + <path + d="M 1052,1595.81 H 20 v 1 h 1032 z" + fill="url(#paint48_radial_129_2056)" + id="path49" + style="fill:url(#paint48_radial_129_2056)" /> + <path + d="M 1052,1145.11 H 20 v 1 h 1032 z" + fill="url(#paint49_radial_129_2056)" + id="path50" + style="fill:url(#paint49_radial_129_2056)" /> + <path + d="M 1052,1345.42 H 20 v 1 h 1032 z" + fill="url(#paint50_radial_129_2056)" + id="path51" + style="fill:url(#paint50_radial_129_2056)" /> + <path + d="M 1052,1545.73 H 20 v 1 h 1032 z" + fill="url(#paint51_radial_129_2056)" + id="path52" + style="fill:url(#paint51_radial_129_2056)" /> + <path + d="M 1052,1245.27 H 20 v 1 h 1032 z" + fill="url(#paint52_radial_129_2056)" + id="path53" + style="fill:url(#paint52_radial_129_2056)" /> + <path + d="M 1052,1445.58 H 20 v 1 h 1032 z" + fill="url(#paint53_radial_129_2056)" + id="path54" + style="fill:url(#paint53_radial_129_2056)" /> + <path + d="M 1052,1645.89 H 20 v 1 h 1032 z" + fill="url(#paint54_radial_129_2056)" + id="path55" + style="fill:url(#paint54_radial_129_2056)" /> + <path + d="M 1052,1120.07 H 20 v 1.01 h 1032 z" + fill="url(#paint55_radial_129_2056)" + id="path56" + style="fill:url(#paint55_radial_129_2056)" /> + <path + d="M 1052,1320.38 H 20 v 1 h 1032 z" + fill="url(#paint56_radial_129_2056)" + id="path57" + style="fill:url(#paint56_radial_129_2056)" /> + <path + d="M 1052,1520.69 H 20 v 1 h 1032 z" + fill="url(#paint57_radial_129_2056)" + id="path58" + style="fill:url(#paint57_radial_129_2056)" /> + <path + d="M 1052,1220.23 H 20 v 1 h 1032 z" + fill="url(#paint58_radial_129_2056)" + id="path59" + style="fill:url(#paint58_radial_129_2056)" /> + <path + d="M 1052,1420.54 H 20 v 1 h 1032 z" + fill="url(#paint59_radial_129_2056)" + id="path60" + style="fill:url(#paint59_radial_129_2056)" /> + <path + d="M 1052,1620.85 H 20 v 1 h 1032 z" + fill="url(#paint60_radial_129_2056)" + id="path61" + style="fill:url(#paint60_radial_129_2056)" /> + <path + d="M 1052,1170.15 H 20 v 1 h 1032 z" + fill="url(#paint61_radial_129_2056)" + id="path62" + style="fill:url(#paint61_radial_129_2056)" /> + <path + d="M 1052,1370.46 H 20 v 1 h 1032 z" + fill="url(#paint62_radial_129_2056)" + id="path63" + style="fill:url(#paint62_radial_129_2056)" /> + <path + d="M 1052,1570.77 H 20 v 1 h 1032 z" + fill="url(#paint63_radial_129_2056)" + id="path64" + style="fill:url(#paint63_radial_129_2056)" /> + <path + d="M 1052,1270.31 H 20 v 1 h 1032 z" + fill="url(#paint64_radial_129_2056)" + id="path65" + style="fill:url(#paint64_radial_129_2056)" /> + <path + d="M 1052,1470.62 H 20 v 1 h 1032 z" + fill="url(#paint65_radial_129_2056)" + id="path66" + style="fill:url(#paint65_radial_129_2056)" /> + <path + d="M 1052,1670.92 H 20 v 1.01 h 1032 z" + fill="url(#paint66_radial_129_2056)" + id="path67" + style="fill:url(#paint66_radial_129_2056)" /> + <path + d="M 1052,1695.96 H 20 v 1 h 1032 z" + fill="url(#paint67_radial_129_2056)" + id="path68" + style="fill:url(#paint67_radial_129_2056)" /> + </g> + <defs + id="defs402"> + <radialGradient + id="paint0_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,-601.44751,540,0,540.00006,601.44746)"> + <stop + stop-color="#2962FF" + id="stop134" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop135" /> + </radialGradient> + <radialGradient + id="paint1_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,406,-406,0,540,634)"> + <stop + stop-color="#2962FF" + stop-opacity="0" + id="stop136" /> + <stop + offset="0.513053" + stop-color="#2962FF" + stop-opacity="0.782292" + id="stop137" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop138" /> + </radialGradient> + <radialGradient + id="paint2_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop139" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop140" /> + </radialGradient> + <radialGradient + id="paint3_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop141" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop142" /> + </radialGradient> + <radialGradient + id="paint4_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop143" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop144" /> + </radialGradient> + <radialGradient + id="paint5_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop145" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop146" /> + </radialGradient> + <radialGradient + id="paint6_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop147" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop148" /> + </radialGradient> + <radialGradient + id="paint7_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop149" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop150" /> + </radialGradient> + <radialGradient + id="paint8_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop151" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop152" /> + </radialGradient> + <radialGradient + id="paint9_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop153" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop154" /> + </radialGradient> + <radialGradient + id="paint10_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop155" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop156" /> + </radialGradient> + <radialGradient + id="paint11_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop157" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop158" /> + </radialGradient> + <radialGradient + id="paint12_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop159" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop160" /> + </radialGradient> + <radialGradient + id="paint13_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop161" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop162" /> + </radialGradient> + <radialGradient + id="paint14_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop163" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop164" /> + </radialGradient> + <radialGradient + id="paint15_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop165" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop166" /> + </radialGradient> + <radialGradient + id="paint16_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop167" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop168" /> + </radialGradient> + <radialGradient + id="paint17_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop169" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop170" /> + </radialGradient> + <radialGradient + id="paint18_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop171" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop172" /> + </radialGradient> + <radialGradient + id="paint19_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop173" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop174" /> + </radialGradient> + <radialGradient + id="paint20_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop175" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop176" /> + </radialGradient> + <radialGradient + id="paint21_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop177" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop178" /> + </radialGradient> + <radialGradient + id="paint22_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop179" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop180" /> + </radialGradient> + <radialGradient + id="paint23_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop181" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop182" /> + </radialGradient> + <radialGradient + id="paint24_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop183" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop184" /> + </radialGradient> + <radialGradient + id="paint25_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop185" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop186" /> + </radialGradient> + <radialGradient + id="paint26_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop187" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop188" /> + </radialGradient> + <radialGradient + id="paint27_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop189" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop190" /> + </radialGradient> + <radialGradient + id="paint28_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop191" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop192" /> + </radialGradient> + <radialGradient + id="paint29_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop193" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop194" /> + </radialGradient> + <radialGradient + id="paint30_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop195" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop196" /> + </radialGradient> + <radialGradient + id="paint31_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop197" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop198" /> + </radialGradient> + <radialGradient + id="paint32_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop199" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop200" /> + </radialGradient> + <radialGradient + id="paint33_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop201" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop202" /> + </radialGradient> + <radialGradient + id="paint34_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop203" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop204" /> + </radialGradient> + <radialGradient + id="paint35_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop205" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop206" /> + </radialGradient> + <radialGradient + id="paint36_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop207" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop208" /> + </radialGradient> + <radialGradient + id="paint37_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop209" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop210" /> + </radialGradient> + <radialGradient + id="paint38_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop211" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop212" /> + </radialGradient> + <radialGradient + id="paint39_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop213" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop214" /> + </radialGradient> + <radialGradient + id="paint40_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop215" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop216" /> + </radialGradient> + <radialGradient + id="paint41_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop217" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop218" /> + </radialGradient> + <radialGradient + id="paint42_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop219" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop220" /> + </radialGradient> + <radialGradient + id="paint43_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop221" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop222" /> + </radialGradient> + <radialGradient + id="paint44_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop223" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop224" /> + </radialGradient> + <radialGradient + id="paint45_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop225" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop226" /> + </radialGradient> + <radialGradient + id="paint46_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop227" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop228" /> + </radialGradient> + <radialGradient + id="paint47_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop229" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop230" /> + </radialGradient> + <radialGradient + id="paint48_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop231" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop232" /> + </radialGradient> + <radialGradient + id="paint49_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop233" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop234" /> + </radialGradient> + <radialGradient + id="paint50_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop235" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop236" /> + </radialGradient> + <radialGradient + id="paint51_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop237" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop238" /> + </radialGradient> + <radialGradient + id="paint52_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop239" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop240" /> + </radialGradient> + <radialGradient + id="paint53_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop241" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop242" /> + </radialGradient> + <radialGradient + id="paint54_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop243" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop244" /> + </radialGradient> + <radialGradient + id="paint55_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop245" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop246" /> + </radialGradient> + <radialGradient + id="paint56_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop247" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop248" /> + </radialGradient> + <radialGradient + id="paint57_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop249" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop250" /> + </radialGradient> + <radialGradient + id="paint58_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop251" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop252" /> + </radialGradient> + <radialGradient + id="paint59_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop253" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop254" /> + </radialGradient> + <radialGradient + id="paint60_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop255" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop256" /> + </radialGradient> + <radialGradient + id="paint61_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop257" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop258" /> + </radialGradient> + <radialGradient + id="paint62_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop259" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop260" /> + </radialGradient> + <radialGradient + id="paint63_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop261" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop262" /> + </radialGradient> + <radialGradient + id="paint64_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop263" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop264" /> + </radialGradient> + <radialGradient + id="paint65_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop265" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop266" /> + </radialGradient> + <radialGradient + id="paint66_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop267" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop268" /> + </radialGradient> + <radialGradient + id="paint67_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,536,1396)"> + <stop + stop-color="#2962FF" + id="stop269" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop270" /> + </radialGradient> + <radialGradient + id="paint68_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop271" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop272" /> + </radialGradient> + <radialGradient + id="paint69_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop273" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop274" /> + </radialGradient> + <radialGradient + id="paint70_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop275" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop276" /> + </radialGradient> + <radialGradient + id="paint71_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop277" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop278" /> + </radialGradient> + <radialGradient + id="paint72_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop279" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop280" /> + </radialGradient> + <radialGradient + id="paint73_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop281" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop282" /> + </radialGradient> + <radialGradient + id="paint74_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop283" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop284" /> + </radialGradient> + <radialGradient + id="paint75_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop285" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop286" /> + </radialGradient> + <radialGradient + id="paint76_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop287" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop288" /> + </radialGradient> + <radialGradient + id="paint77_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop289" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop290" /> + </radialGradient> + <radialGradient + id="paint78_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop291" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop292" /> + </radialGradient> + <radialGradient + id="paint79_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop293" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop294" /> + </radialGradient> + <radialGradient + id="paint80_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop295" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop296" /> + </radialGradient> + <radialGradient + id="paint81_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop297" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop298" /> + </radialGradient> + <radialGradient + id="paint82_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop299" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop300" /> + </radialGradient> + <radialGradient + id="paint83_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop301" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop302" /> + </radialGradient> + <radialGradient + id="paint84_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop303" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop304" /> + </radialGradient> + <radialGradient + id="paint85_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop305" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop306" /> + </radialGradient> + <radialGradient + id="paint86_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop307" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop308" /> + </radialGradient> + <radialGradient + id="paint87_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop309" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop310" /> + </radialGradient> + <radialGradient + id="paint88_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop311" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop312" /> + </radialGradient> + <radialGradient + id="paint89_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop313" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop314" /> + </radialGradient> + <radialGradient + id="paint90_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop315" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop316" /> + </radialGradient> + <radialGradient + id="paint91_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop317" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop318" /> + </radialGradient> + <radialGradient + id="paint92_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop319" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop320" /> + </radialGradient> + <radialGradient + id="paint93_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop321" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop322" /> + </radialGradient> + <radialGradient + id="paint94_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop323" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop324" /> + </radialGradient> + <radialGradient + id="paint95_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop325" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop326" /> + </radialGradient> + <radialGradient + id="paint96_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop327" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop328" /> + </radialGradient> + <radialGradient + id="paint97_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop329" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop330" /> + </radialGradient> + <radialGradient + id="paint98_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop331" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop332" /> + </radialGradient> + <radialGradient + id="paint99_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop333" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop334" /> + </radialGradient> + <radialGradient + id="paint100_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop335" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop336" /> + </radialGradient> + <radialGradient + id="paint101_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop337" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop338" /> + </radialGradient> + <radialGradient + id="paint102_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop339" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop340" /> + </radialGradient> + <radialGradient + id="paint103_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop341" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop342" /> + </radialGradient> + <radialGradient + id="paint104_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop343" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop344" /> + </radialGradient> + <radialGradient + id="paint105_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop345" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop346" /> + </radialGradient> + <radialGradient + id="paint106_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop347" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop348" /> + </radialGradient> + <radialGradient + id="paint107_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop349" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop350" /> + </radialGradient> + <radialGradient + id="paint108_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop351" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop352" /> + </radialGradient> + <radialGradient + id="paint109_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop353" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop354" /> + </radialGradient> + <radialGradient + id="paint110_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop355" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop356" /> + </radialGradient> + <radialGradient + id="paint111_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop357" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop358" /> + </radialGradient> + <radialGradient + id="paint112_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop359" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop360" /> + </radialGradient> + <radialGradient + id="paint113_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop361" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop362" /> + </radialGradient> + <radialGradient + id="paint114_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop363" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop364" /> + </radialGradient> + <radialGradient + id="paint115_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop365" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop366" /> + </radialGradient> + <radialGradient + id="paint116_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop367" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop368" /> + </radialGradient> + <radialGradient + id="paint117_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop369" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop370" /> + </radialGradient> + <radialGradient + id="paint118_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop371" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop372" /> + </radialGradient> + <radialGradient + id="paint119_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop373" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop374" /> + </radialGradient> + <radialGradient + id="paint120_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop375" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop376" /> + </radialGradient> + <radialGradient + id="paint121_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop377" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop378" /> + </radialGradient> + <radialGradient + id="paint122_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop379" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop380" /> + </radialGradient> + <radialGradient + id="paint123_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop381" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop382" /> + </radialGradient> + <radialGradient + id="paint124_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop383" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop384" /> + </radialGradient> + <radialGradient + id="paint125_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop385" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop386" /> + </radialGradient> + <radialGradient + id="paint126_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop387" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop388" /> + </radialGradient> + <radialGradient + id="paint127_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop389" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop390" /> + </radialGradient> + <radialGradient + id="paint128_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop391" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop392" /> + </radialGradient> + <radialGradient + id="paint129_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop393" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop394" /> + </radialGradient> + <radialGradient + id="paint130_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop395" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop396" /> + </radialGradient> + <radialGradient + id="paint131_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop397" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop398" /> + </radialGradient> + <radialGradient + id="paint132_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop399" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop400" /> + </radialGradient> + <radialGradient + id="paint133_radial_129_2056" + cx="0" + cy="0" + r="1" + gradientUnits="userSpaceOnUse" + gradientTransform="matrix(0,324,-516,0,540,638)"> + <stop + stop-color="#2962FF" + id="stop401" /> + <stop + offset="1" + stop-color="#2962FF" + stop-opacity="0" + id="stop402" /> + </radialGradient> + </defs> +</svg> diff --git a/src/index.html b/src/index.html index c12b13e..e94c770 100644 --- a/src/index.html +++ b/src/index.html @@ -26,26 +26,26 @@ Mixer </h1> <div id="SliderContainer" class="sliderContainer"></div> - <script id="slider-template" type="x-tmpl-mustache"> - <div class="entry" id="slider-{{id}}" slider-id="{{ id }}" value="{{ value }}"> - <div class="label"> - {{ name }}: <span class="value"> {{ value }}%</span> - </div> - <a id="decrease-{{id}}" class="button" onclick="VOLUME.decrease(this);"> - <span class="icon-volume-decrease"></span> - </a> - <div class="slider"> - <input id="progress-{{id}}" type="range" min="1" value="{{ value }}" max="100" oninput="VOLUME.change(this);"> - <progress value="{{ value }}" max="100"></progress> - </div> - <a id="increase-{{id}}" class="button" onclick="VOLUME.increase(this);"> - <span class="icon-volume-increase"></span> - </a> - </div> - </script> </div> <div class="log" id="log"> </div> + <script id="slider-template" type="x-tmpl-mustache"> + <div class="entry" id="slider-{{ id }}" slider-id="{{ id }}" value="{{ value }}"> + <div class="label"> + {{ name }}: <span class="value"> {{ value }}%</span> + </div> + <a id="decrease-{{id}}" class="button" onclick="VOLUME.decrease(this);"> + <span class="icon-volume-decrease"></span> + </a> + <div class="slider"> + <input id="progress-{{id}}" type="range" min="1" value="{{ value }}" max="100" oninput="VOLUME.change(this);"> + <progress value="{{ value }}" max="100"></progress> + </div> + <a id="increase-{{id}}" class="button" onclick="VOLUME.increase(this);"> + <span class="icon-volume-increase"></span> + </a> + </div> + </script> </body> </html> diff --git a/src/index.js b/src/index.js index a022899..4db937f 100644 --- a/src/index.js +++ b/src/index.js @@ -14,14 +14,11 @@ * limitations under the License. */ -/* JS */ -import { init } from './js/app'; - /* CSS */ import './styles/app.scss'; document.addEventListener('DOMContentLoaded', function(){ - init(); + APP.init(); KUKSA.init([ [PATHS.volume, VOLUME], diff --git a/src/js/app.js b/src/js/app.js index 9ad4ea1..d4cc919 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -17,7 +17,5 @@ function render_sliders(sliders) { export function init() { template = document.getElementById('slider-template').innerHTML; - Mustache.parse(template); - render_sliders(controls); } diff --git a/src/styles/app.scss b/src/styles/app.scss index cbba7fc..18af381 100644 --- a/src/styles/app.scss +++ b/src/styles/app.scss @@ -1,7 +1,7 @@ $colors: ( - primary: #00ADDC, - font: #FFFFFF, - grey: #848286 + primary: #2962ff, + font: #c1d8ff, + grey: #1c2d92 ); @media (max-device-width: 720px) and (orientation: portrait) { @import "main.scss"; @@ -27,4 +27,4 @@ $colors: ( @import "1080.scss"; } -@import "style.css";
\ No newline at end of file +@import "style.css"; diff --git a/src/styles/landscape.scss b/src/styles/landscape.scss index d215960..ee504e9 100644 --- a/src/styles/landscape.scss +++ b/src/styles/landscape.scss @@ -1,7 +1,8 @@ @media (orientation: landscape) { html { - background-image: url('../images/horizontal_background.png'); + background-image: url('../images/dashboardTextures.svg'); + background-color: black; } body { @@ -14,4 +15,4 @@ } } } -}
\ No newline at end of file +} diff --git a/src/styles/portrait.scss b/src/styles/portrait.scss index eff553c..ab28917 100644 --- a/src/styles/portrait.scss +++ b/src/styles/portrait.scss @@ -1,7 +1,8 @@ @media (orientation: portrait) { html { - background-image: url('../images/vertical_background.png'); + background-image: url('../images/dashboardTextures.svg'); + background-color: black; } body { @@ -9,4 +10,4 @@ width: 100%; } } -}
\ No newline at end of file +} |