complex-teal
complex-teal13mo ago

Remove default app icon

Hi guys, This should be simple but I must be missing something. I want to replace the default Icon, so I found where in the application it is being used, but even if comment the code, it still persists in the UI? How can iI remove it? Thanks
No description
No description
5 Replies
kapa.ai
kapa.ai13mo ago
Hi @jaco0670. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
kapa.ai
kapa.ai13mo ago
---------------------- To remove the default title and icon in the AuthPage, you can either use the renderContent property or set the title property to false. Here are two examples for Ant Design and Mantine: Ant Design: 1. Using renderContent property:
import { AuthPage } from "@refinedev/antd";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
renderContent={(content: React.ReactNode) => {
return content;
}}
/>
);
};
import { AuthPage } from "@refinedev/antd";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
renderContent={(content: React.ReactNode) => {
return content;
}}
/>
);
};
2. Setting title property to false:
import { AuthPage } from "@refinedev/antd";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
title={false}
/>
);
};
import { AuthPage } from "@refinedev/antd";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
title={false}
/>
);
};
Mantine: 1. Using renderContent property:
import { AuthPage } from "@refinedev/mantine";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
renderContent={(content: React.ReactNode) => {
return content;
}}
/>
);
};
import { AuthPage } from "@refinedev/mantine";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
renderContent={(content: React.ReactNode) => {
return content;
}}
/>
);
};
2. Setting title property to false:
import { AuthPage } from "@refinedev/mantine";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
title={false}
/>
);
};
import { AuthPage } from "@refinedev/mantine";

const MyLoginPage = () => {
return (
<AuthPage
type="login"
title={false}
/>
);
};
These examples should help you remove the default title and icon from the AuthPage. Make sure to replace the relevant parts of your code with the examples provided. Sources: - Ant Design AuthPage (https://refine.dev/docs/api-reference/antd/components/antd-auth-page) - Mantine AuthPage (https://refine.dev/docs/api-reference/mantine/components/mantine-auth-page) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
| refine
component from refine is an authentication page that can be used to login, register, forgot password, and update password.
| refine
component from refine is an authentication page that can be used to login, register, forgot password, and update password.
kapa.ai
kapa.ai13mo ago
<@486442088280358912> kapa.ai is still learning and improving, please let us how it did by reacting below
national-gold
national-gold13mo ago
Hey @jaco0670 its the default icon, you can try passing null or any other empty react node. If the result does not satisfy your needs, you can always try swizzling the themedtitlev2 component and customize 🫶
complex-teal
complex-teal13mo ago
Hey @aliemirs thanks for your help 🙂
More Posts