✨ Login actions

2024-09-28 16:54:56 +02:00
parent 90ddfd1da5
commit ce5019ca38
5 changed files with 200 additions and 35 deletions
@@ -0,0 +1,95 @@
+const Loader = (props) => {
+	return (
+		<svg
+			viewBox='0 0 57 57'
+			xmlns='http://www.w3.org/2000/svg'
+			stroke='currentColor'
+			{...props}
+		>
+			<g
+				fill='none'
+				fill-rule='evenodd'
+			>
+				<g
+					transform='translate(1 1)'
+					stroke-width='2'
+				>
+					<circle
+						cx='5'
+						cy='50'
+						r='5'
+					>
+						<animate
+							attributeName='cy'
+							begin='0s'
+							dur='2.2s'
+							values='50;5;50;50'
+							calcMode='linear'
+							repeatCount='indefinite'
+						/>
+						<animate
+							attributeName='cx'
+							begin='0s'
+							dur='2.2s'
+							values='5;27;49;5'
+							calcMode='linear'
+							repeatCount='indefinite'
+						/>
+					</circle>
+					<circle
+						cx='27'
+						cy='5'
+						r='5'
+					>
+						<animate
+							attributeName='cy'
+							begin='0s'
+							dur='2.2s'
+							from='5'
+							to='5'
+							values='5;50;50;5'
+							calcMode='linear'
+							repeatCount='indefinite'
+						/>
+						<animate
+							attributeName='cx'
+							begin='0s'
+							dur='2.2s'
+							from='27'
+							to='27'
+							values='27;49;5;27'
+							calcMode='linear'
+							repeatCount='indefinite'
+						/>
+					</circle>
+					<circle
+						cx='49'
+						cy='50'
+						r='5'
+					>
+						<animate
+							attributeName='cy'
+							begin='0s'
+							dur='2.2s'
+							values='50;50;5;50'
+							calcMode='linear'
+							repeatCount='indefinite'
+						/>
+						<animate
+							attributeName='cx'
+							from='49'
+							to='49'
+							begin='0s'
+							dur='2.2s'
+							values='49;5;27;49'
+							calcMode='linear'
+							repeatCount='indefinite'
+						/>
+					</circle>
+				</g>
+			</g>
+		</svg>
+	);
+};
+
+export default Loader;