github.com/pelicanplatform/pelican@v1.0.5/web_ui/frontend/public/theme.tsx (about)

     1  /***************************************************************
     2   *
     3   * Copyright (C) 2023, Pelican Project, Morgridge Institute for Research
     4   *
     5   * Licensed under the Apache License, Version 2.0 (the "License"); you
     6   * may not use this file except in compliance with the License.  You may
     7   * obtain a copy of the License at
     8   *
     9   *    http://www.apache.org/licenses/LICENSE-2.0
    10   *
    11   * Unless required by applicable law or agreed to in writing, software
    12   * distributed under the License is distributed on an "AS IS" BASIS,
    13   * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    14   * See the License for the specific language governing permissions and
    15   * limitations under the License.
    16   *
    17   ***************************************************************/
    18  
    19  'use client'
    20  
    21  import {createTheme, responsiveFontSizes, ThemeProvider} from "@mui/material";
    22  import {FC} from "react";
    23  import {blue} from "@mui/material/colors";
    24  import {Poppins} from "next/font/google";
    25  
    26  const poppins = Poppins({
    27      subsets: ['latin'], style: ['normal'], weight: ['300', '400', '600'], display: 'swap'
    28  })
    29  
    30  let theme = createTheme({
    31      palette: {
    32          primary: {
    33              main: "#0885ff",
    34              light: "#CFE4FF"
    35          },
    36          secondary: {
    37              main: "#FFFFFA"
    38          }
    39      },
    40      typography: {
    41          h1: {
    42              fontFamily: poppins.style.fontFamily
    43          },
    44          h2: {
    45              fontFamily: poppins.style.fontFamily
    46          },
    47          h3: {
    48              fontFamily: poppins.style.fontFamily
    49          },
    50          h4: {
    51              fontFamily: poppins.style.fontFamily
    52          },
    53          h5: {
    54              fontFamily: poppins.style.fontFamily
    55          },
    56          h6: {
    57              fontFamily: poppins.style.fontFamily
    58          },
    59          body1: {
    60              fontSize: "1.2rem",
    61          },
    62          fontFamily: [
    63              "Poppins",
    64              "Helvetica Neue",
    65              "Helvetica",
    66              "Arial",
    67              "Lucida Grande",
    68              "sans-serif"
    69          ].join(",")
    70      },
    71      components: {
    72          MuiContainer: {
    73              defaultProps: {}
    74          },
    75      },
    76  });
    77  
    78  theme = responsiveFontSizes(theme, {factor: 3})
    79  
    80  interface ThemeProviderClientProps {
    81      children: React.ReactNode
    82  }
    83  
    84  export const ThemeProviderClient: FC<ThemeProviderClientProps> = ({children}) => {
    85      return <ThemeProvider theme={theme}>{children}</ThemeProvider>
    86  }