diff --git a/frontend/src/assets/img/avatar.png b/frontend/src/assets/img/avatar.png
deleted file mode 100644
index 15f7c90b8..000000000
Binary files a/frontend/src/assets/img/avatar.png and /dev/null differ
diff --git a/frontend/src/assets/img/logo-text.svg b/frontend/src/assets/img/logo-text.svg
deleted file mode 100644
index 2ea40acaa..000000000
--- a/frontend/src/assets/img/logo-text.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/frontend/src/assets/img/logo.svg b/frontend/src/assets/img/logo.svg
deleted file mode 100644
index 1d6b32a54..000000000
--- a/frontend/src/assets/img/logo.svg
+++ /dev/null
@@ -1,20 +0,0 @@
-
diff --git a/frontend/src/assets/img/react.svg b/frontend/src/assets/img/react.svg
deleted file mode 100644
index 8e0e0f15c..000000000
--- a/frontend/src/assets/img/react.svg
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/frontend/src/bundles/auth/components/common/form-header/styles.module.css b/frontend/src/bundles/auth/components/common/form-header/styles.module.css
index a0fa4eb4e..44b7c5878 100644
--- a/frontend/src/bundles/auth/components/common/form-header/styles.module.css
+++ b/frontend/src/bundles/auth/components/common/form-header/styles.module.css
@@ -1,12 +1,3 @@
-.logo {
- margin-bottom: 50px;
- display: flex;
-}
-
-.logo img {
- margin-right: 10px;
-}
-
.heading {
color: white;
margin-bottom: 6px;
diff --git a/frontend/src/bundles/chat/components/chat-body/chat-body.tsx b/frontend/src/bundles/chat/components/chat-body/chat-body.tsx
index bb4c00dde..d9c720ed9 100644
--- a/frontend/src/bundles/chat/components/chat-body/chat-body.tsx
+++ b/frontend/src/bundles/chat/components/chat-body/chat-body.tsx
@@ -16,7 +16,7 @@ const ChatBody: React.FC = ({ messages }) => {
return (
{dataStatus === DataStatus.PENDING ? (
-
+
) : (
)}
diff --git a/frontend/src/bundles/common/components/header/styles.module.css b/frontend/src/bundles/common/components/header/styles.module.css
index 50e9a7ec9..1a77d610a 100644
--- a/frontend/src/bundles/common/components/header/styles.module.css
+++ b/frontend/src/bundles/common/components/header/styles.module.css
@@ -11,16 +11,3 @@
align-items: center;
justify-content: space-between;
}
-
-.logo {
- width: 50px;
- height: 50px;
-}
-
-.logo-container {
- display: flex;
- align-items: center;
-}
-.logo-container img {
- margin-right: 10px;
-}
diff --git a/frontend/src/bundles/common/components/loader/loader.tsx b/frontend/src/bundles/common/components/loader/loader.tsx
index 96e4e85eb..a397dcbd5 100644
--- a/frontend/src/bundles/common/components/loader/loader.tsx
+++ b/frontend/src/bundles/common/components/loader/loader.tsx
@@ -8,12 +8,16 @@ import {
import { SPIN_ANIMATION } from './libs/constants/constants.js';
-const Loader = (): JSX.Element => {
+type Properties = {
+ isDark?: boolean;
+};
+
+const Loader: React.FC = ({ isDark = false }) => {
return (
-
+
{
animation={`${SPIN_ANIMATION} 1s linear infinite`}
/>
-
+
Loading...
diff --git a/frontend/src/bundles/common/components/logo/logo.tsx b/frontend/src/bundles/common/components/logo/logo.tsx
index b8331a93c..cf604999d 100644
--- a/frontend/src/bundles/common/components/logo/logo.tsx
+++ b/frontend/src/bundles/common/components/logo/logo.tsx
@@ -1,25 +1,29 @@
import { type ChakraProps as ChakraProperties, Box } from '@chakra-ui/react';
-import logo from '~/assets/img/logo.svg';
-import logoTxt from '~/assets/img/logo-text.svg';
-import { Image } from '~/bundles/common/components/components.js';
+import { Icon } from '~/bundles/common/components/components.js';
+import { IconName } from '~/bundles/common/icons/icons.js';
type Properties = {
textSize?: string;
logoSize: string;
+ isDark?: boolean;
} & ChakraProperties;
-const Logo: React.FC = ({ logoSize, textSize, ...rest }) => {
+const Logo: React.FC = ({
+ logoSize,
+ textSize,
+ isDark = false,
+ ...rest
+}) => {
return (
-
-
+
+
{textSize && (
-
+
)}
);
diff --git a/frontend/src/bundles/common/components/video-modal/components/video-modal-content/components/generate-script-placeholder/generate-script-placeholder.tsx b/frontend/src/bundles/common/components/video-modal/components/video-modal-content/components/generate-script-placeholder/generate-script-placeholder.tsx
index 8a11392e3..751c1b0e6 100644
--- a/frontend/src/bundles/common/components/video-modal/components/video-modal-content/components/generate-script-placeholder/generate-script-placeholder.tsx
+++ b/frontend/src/bundles/common/components/video-modal/components/video-modal-content/components/generate-script-placeholder/generate-script-placeholder.tsx
@@ -19,7 +19,7 @@ const GenerateScriptPlaceholder: React.FC = ({ videoScripts }) => {
const renderLoadingState = (): React.ReactNode => (
-
+
);
diff --git a/frontend/src/bundles/common/icons/custom-icons/custom-icons.ts b/frontend/src/bundles/common/icons/custom-icons/custom-icons.ts
index 028aeacb2..00c4034e8 100644
--- a/frontend/src/bundles/common/icons/custom-icons/custom-icons.ts
+++ b/frontend/src/bundles/common/icons/custom-icons/custom-icons.ts
@@ -1 +1,3 @@
+export { Logo } from './logo.js';
+export { LogoText } from './logo-text.js';
export { OpenAi } from './open-ai.js';
diff --git a/frontend/src/bundles/common/icons/custom-icons/logo-text.tsx b/frontend/src/bundles/common/icons/custom-icons/logo-text.tsx
new file mode 100644
index 000000000..48a5d1f58
--- /dev/null
+++ b/frontend/src/bundles/common/icons/custom-icons/logo-text.tsx
@@ -0,0 +1,14 @@
+import { createIcon } from '@chakra-ui/react';
+
+const LogoText = createIcon({
+ displayName: 'LogoText',
+ viewBox: '0 0 169 26',
+ path: (
+
+ ),
+});
+
+export { LogoText };
diff --git a/frontend/src/bundles/common/icons/custom-icons/logo.tsx b/frontend/src/bundles/common/icons/custom-icons/logo.tsx
new file mode 100644
index 000000000..1123d3a0d
--- /dev/null
+++ b/frontend/src/bundles/common/icons/custom-icons/logo.tsx
@@ -0,0 +1,116 @@
+import { createIcon } from '@chakra-ui/react';
+
+const Logo = createIcon({
+ displayName: 'Logo',
+ viewBox: '0 0 187 188',
+ path: (
+ <>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ >
+ ),
+});
+
+export { Logo };
diff --git a/frontend/src/bundles/common/icons/icon-name.ts b/frontend/src/bundles/common/icons/icon-name.ts
index b42fa4f2e..d7129229a 100644
--- a/frontend/src/bundles/common/icons/icon-name.ts
+++ b/frontend/src/bundles/common/icons/icon-name.ts
@@ -8,7 +8,7 @@ import {
ViewOffIcon,
} from '@chakra-ui/icons';
-import { OpenAi } from './custom-icons/custom-icons.js';
+import { Logo, LogoText, OpenAi } from './custom-icons/custom-icons.js';
import {
BackwardStep,
CircleUser,
@@ -59,6 +59,8 @@ const IconName = {
ADD: AddIcon,
CLOSE: CloseIcon,
OPEN_AI: OpenAi,
+ LOGO: Logo,
+ LOGO_TEXT: LogoText,
} as const;
export { IconName };