diff --git a/src/renderer/components/Shared/HexLogoSpinner.tsx b/src/renderer/components/Shared/HexLogoSpinner.tsx new file mode 100644 index 0000000000000000000000000000000000000000..c592ba3128edfee8586be067469bc077e4c560ac --- /dev/null +++ b/src/renderer/components/Shared/HexLogoSpinner.tsx @@ -0,0 +1,64 @@ +export default function HexLogoSpinner({ size = 60 }) { + return ( + <svg + width={size * 1.2} + height={size} + viewBox="0 0 40 100" + version="1.1" + id="svg1" + xmlns="http://www.w3.org/2000/svg" + className="tlab-hex-svg" + style={{ + animation: 'rotate 5s linear infinite', + transformOrigin: 'center center', + }} + > + <style> + {` + @keyframes rotate { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } + } + .tlab-hex-svg-path { + animation: rotate 5s linear infinite; + transform-origin: center center; + } + `} + </style> + <g id="layer1"> + <path + id="path6" + className="tlab-hex-svg-path" + style={{ + display: 'inline', + fill: '#ffffff', + stroke: '#000000', + strokeWidth: 3, + strokeLinecap: 'round', + strokeLinejoin: 'round', + }} + d="m 30.000003,18.325218 c 0,10.521451 0,21.042918 0,31.564369 M 44.951546,18.325218 c 0,10.521451 0,21.042918 0,31.564369 M 16.332227,26.21631 c 9.111853,5.260734 18.22371,10.521451 27.335563,15.782185 M 23.807999,13.267891 c 9.111857,5.260734 18.22371,10.521451 27.335562,15.782185 M 16.332243,41.998495 C 25.444096,36.737761 34.555937,31.477044 43.66779,26.21631 M 8.8564718,29.050076 C 17.968325,23.789342 27.080165,18.528625 36.192018,13.267891 M 30.000019,49.88957 c 0,-10.52145 0,-21.042918 0,-31.564369 M 15.048471,49.88957 c 0,-10.52145 0,-21.042918 0,-31.564369 M 43.667773,41.998478 C 34.555921,36.737744 25.44408,31.477027 16.332227,26.216294 M 36.192001,54.946897 C 27.080149,49.686163 17.968308,44.425446 8.8564552,39.164712 M 43.667773,26.21631 C 34.555921,31.477044 25.44408,36.737761 16.332227,41.998495 M 51.143545,39.164712 C 42.031692,44.425446 32.919856,49.686163 23.807999,54.946897" + /> + </g> + <g id="layer2"> + <path + id="path1" + className="tlab-hex-svg-path" + style={{ + display: 'inline', + fill: '#ffffff', + stroke: '#000000', + strokeWidth: 3, + strokeLinecap: 'round', + strokeLinejoin: 'round', + }} + d="m 47.717681,11.725889 c 3.356997,1.938164 6.713997,3.876324 10.070994,5.814489 M 12.282319,56.488916 C 8.9253221,54.550751 5.5683221,52.612591 2.2113248,50.674427 M 58.241807,38.260609 c 0,3.876326 0,7.752652 0,11.628978 M 40.524128,60.642122 c -3.356997,1.938165 -6.713997,3.876325 -10.070994,5.814489 M 1.7581934,29.954196 c 0,-3.876326 0,-7.752652 0,-11.628978 m 56.4836136,0 c 0,3.876326 0,7.752652 0,11.628978 M 30.453134,1.7581934 c 3.356997,1.9381645 6.713997,3.8763245 10.070994,5.814489 M 57.788675,50.674427 c -3.356997,1.938165 -6.713997,3.876324 -10.070994,5.814489 m -18.17081,9.967679 C 26.189881,64.518424 22.832879,62.580276 19.475889,60.642106 M 1.75821,49.88957 c 0,-3.876326 0,-7.752652 0,-11.628978 M 2.2113414,17.540378 C 5.56833,15.602208 8.92533,13.664058 12.282319,11.725889 M 19.475872,7.5726824 C 22.83287,5.6345172 26.189873,3.6963591 29.546871,1.7581934" + /> + </g> + </svg> + ); +}