pancake-toolkit
pancake-toolkit copied to clipboard
Cannot find any way to change Logo in header
I can't find a way to change logo of pancake swap in navbar. On digging in the library i found out that static logo is used. There should be an option to change though.
我找不到在导航栏中更改煎饼交换徽标的方法。在库中挖掘时,我发现使用了静态徽标。不过应该有一个选项可以改变。
Hello,I'm also bothered about it,doyou have some idea ?
I have figured it out, to customize any icon, color etc for this pancake ui-kit
To change the logo follow the following steps:
- Clone this pancake-toolkit repo. Make sure you clone the repo of same version as your npm library installed. Check here: releases to get your specific version
- Open the cloned repo, go into packages -> pancake-uikit and do
npm i
andnpm start
. This will open up the storybook with all the default pancake components. The pancake-uikit folder consists of all the components, icons, colors etc. - To change the logo go into folder src\widgets\Menu\components\Logo.tsx. In the file you'll find a innerLogo variable with two logos, pancake logo and pancake text logo. We have replace these logos with our logo. Just ctrl&right-click on the Logo component and it will take you to that icon file and there change the svg content as per your requirement. You can explore more to change colors and other styles as per your need. After making changes save the changes. You can see the changes in the storybook opened.
- Now open the terminal and enter the command
npm run build
. This will create a dist folder. - Copy the dist folder, Now in your project go to node_modules -> @pancakeswap -> uikit, here replace the dist folder with your new dist folder.
- restart your project, and the uikit changes should get reflected.
Each time you have to make any change to core uikit, you'll have to repeat the above process.
I can't find a way to change logo of pancake swap in navbar. On digging in the library i found out that static logo is used. There should be an option to change though.Check the answer below
I can't find a way to change logo of pancake swap in navbar. On digging in the library i found out that static logo is used. There should be an option to change though.
Please Check this Solution: https://github.com/pancakeswap/pancake-toolkit/issues/411#issuecomment-1323914675