github.com/lauslim12/expert-systems@v0.0.0-20221115131159-018513aad29c/web/src/index.tsx (about)

     1  import 'focus-visible/dist/focus-visible';
     2  import './utils/i18n';
     3  
     4  import {
     5    type ThemeOverride,
     6    ChakraProvider,
     7    ColorModeScript,
     8    extendTheme,
     9  } from '@chakra-ui/react';
    10  import React from 'react';
    11  import ReactDOM from 'react-dom/client';
    12  
    13  import App from './App';
    14  import reportWebVitals from './reportWebVitals';
    15  
    16  /**
    17   * Fallback fonts.
    18   */
    19  const fallbackFonts =
    20    '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"';
    21  
    22  /**
    23   * Renders whole application in React 18.
    24   */
    25  ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
    26    <React.StrictMode>
    27      <ChakraProvider
    28        resetCSS
    29        theme={extendTheme({
    30          styles: {
    31            global: {
    32              '::selection': {
    33                backgroundColor: '#FBB6CE',
    34                color: '#000',
    35              },
    36            },
    37          },
    38          fonts: {
    39            body: `Karla, ${fallbackFonts}`,
    40            heading: `Karla, ${fallbackFonts}`,
    41          },
    42          config: {
    43            initialColorMode: 'system',
    44            useSystemColorMode: true,
    45            disableTransitionOnChange: false,
    46          },
    47        } as ThemeOverride)}
    48      >
    49        <ColorModeScript initialColorMode="system" />
    50        <App />
    51      </ChakraProvider>
    52    </React.StrictMode>
    53  );
    54  
    55  // If you want to start measuring performance in your app, pass a function
    56  // to log results (for example: reportWebVitals(console.log))
    57  // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
    58  reportWebVitals();