Personalization

Logo

First of all, change the file logo.png in the public folder.

Using themeConfig.js

Change template to fit your needs. To configure template we will use themeConfig.js file, which have all template configurations listed with their valid values.

const themeConfig = {
  app: {
    name: 'Micleo',
    description: 'Acelerate your SaaS / CRM development....',
    logo: require('@/assets/images/svg/logo.svg'),
    isDark: false,
    isRtl: false,
    contentLayoutNav: 'vertical', // vertical, horizontal
    routeTransition: 'scroll-x-transition', // https://vuetifyjs.com/en/styles/transitions/#api
    skinVariant: 'semi-dark', // default, bordered, semi-dark
    contentWidth: 'content', // boxed, content
    gtag: 'G-G7B6GXP1LX',
  },
  menu: {
    isMenuHidden: false,
    isVerticalNavMini: false, // mini menu
    verticalMenuAccordion: true,
    groupChildIcon: 'mdi-checkbox-blank-circle-outline',
    horizontalNavMenuGroupOpenOnHover: true,
  },
  appBar: {
    type: 'static', // fixed, static, hidden
    isBlurred: true,
  },
  footer: {
    type: 'static', // fixed, static, hidden
  },
  themes: {
    light: {
      primary: '#274dd2', // '#9155FD',
      accent: '#0d6efd',
      secondary: '#8A8D93',
      success: '#56CA00',
      info: '#16B1FF',
      warning: '#FFB400',
      error: '#FF4C51',
    },
    dark: {
      primary: '#274dd2',
      accent: '#0d6efd',
      secondary: '#8A8D93',
      success: '#56CA00',
      info: '#16B1FF',
      warning: '#FFB400',
      error: '#FF4C51',
    },
  },
}