Project Configuration

Search…
Configuration option for whole Berry Template
Berry has a single source of truth for default configuration which lets users manage it effectively. It also makes it scalable for new configurations. you can set config like font, border, theme layout, locale, etc. All those can be configured at ..src/config.js
Option
Default
Data Type
Description
basename
/
String
build time set subdomain or path of project directory
defaultPath
/dashboard/default
string
default path once login success
fontFamily
'Roboto', sans-serif
String
set font family
borderRadius
12
number
border-radius for card and textboxes
outlinedFilled
true
boolean
defines backfill color for textboxes. setting it false will show transparent background for outline textboxes
theme
light
String
light, dark
18n
en
String
en - English
fr - français
ro - Română
zh - 中国人
rtlLayout
false
boolean
set layout from right to left.
jwt
-
Object
JSON web token configuration
firebase
-
Object
Firebase Authentication config
auth0
-
Object
auth0 login config
JavaScript
TypeScript
const config = {
    // basename: only at build time to set, and don't add '/' at end off BASENAME for breadcrumbs,  like '/berry-material-react/react/default'
    basename: '/',
    defaultPath: '/dashboard/default',
    fontFamily: `'Roboto', sans-serif`,
    borderRadius: 12,
    outlinedFilled: true,
    theme: 'light',
    i18n: 'en', // 'en' - English, 'fr' - French, 'ro' - Romanian, 'zh' - Chinese
    rtlLayout: false,
    jwt: {
        secret: 'SECRET-KEY',
        timeout: '1 days'
    },
    firebase: {
        apiKey: 'apiKey',
        authDomain: 'authDomain',
        projectId: 'berry-material-react',
        storageBucket: 'berry-material-react.appspot.com',
        messagingSenderId: 'messagingSenderId',
        appId: 'appId',
        measurementId: 'measurementId'
    },
    auth0: {
        client_id: 'client_id',
        domain: 'demo-localhost.us.auth0.com'
    }
};
​
export default config;
import { PaletteMode } from '@material-ui/core';
​
const config: {
    basename: string;
    defaultPath: string;
    fontFamily: string;
    borderRadius: number;
    outlinedFilled: boolean;
    theme: PaletteMode;
    presetColor: string;
    i18n: string;
    rtlLayout: boolean;
    jwt: {
        secret: string;
        timeout: string;
    };
    firebase: {
        apiKey: string;
        authDomain: string;
        projectId: string;
        storageBucket: string;
        messagingSenderId: string;
        appId: string;
        measurementId: string;
    };
    auth0: {
        client_id: string;
        domain: string;
    };
} = {
    // basename: only at build time to set, and Don&apos;t add '/' at end off 
    // BASENAME for breadcrumbs, also Don&apos;t put only '/' use blank('') instead
    // like '/berry-material-react/react/default'
    basename: '',
    defaultPath: '/dashboard/default',
    fontFamily: `'Roboto', sans-serif`,
    borderRadius: 12,
    outlinedFilled: true,
    theme: 'light', // light, dark
    presetColor: 'default', // default, theme1, theme2, theme3, theme4, theme5
    // 'en' - English, 'fr' - French, 'ro' - Romanian, 'zh' - Chinese
    i18n: 'en',
    rtlLayout: false,
    jwt: {
        ...
    },
    firebase: {
        ...
    },
    auth0: {
        ...
    }
};
​
export default config;
Routing
Color Presets
Last modified 4mo ago
Copy link