Skip to content

Theming

Khalifa Lame edited this page Oct 18, 2020 · 2 revisions

Alt Storefront was built with Ant Design UI components and UmiJS. That means we can easily control the look of the entire website by editing the theme variable in .umirc.ts in the project root folder. The theme variable overrides the Less variables used by the Ant Design components. Here's an example.

// .umirc.ts
// ...
export default defineConfig({
  // ...
  theme: {
    "layout-header-background": "#fff",
    "layout-body-background": "#fff",
    "layout-footer-background": "#eee",
    "text-color-secondary": "#0009",
  },
  // ...
});

For a full list of the available Less variables, refer to this file. If you need a variable that isn't available in the file, feel free to open an issue on Ant Design and let them know.

Clone this wiki locally