[KB] feat[#267]: 로딩 스피너 컴포넌트 추가

Author: min06150315

src/components/Common/LoadingSpinner.tsx

@@ -0,0 +1,34 @@
+import styled, { keyframes } from 'styled-components';
+
+const spin = keyframes`
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+`;
+
+const Container = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+`;
+
+const Spinner = styled.div`
+  width: 40px;
+  height: 40px;
+  border: 4px solid rgba(255, 255, 255, 0.3);
+  border-top: 4px solid #3498db;
+  border-radius: 50%;
+  animation: ${spin} 1s linear infinite;
+  margin-bottom: 10px;
+`;
+
+const LoadingSpinner = () => {
+  return (
+    <Container>
+      <Spinner />
+    </Container>
+  );
+};
+
+export default LoadingSpinner;