CR Styling

by timum

HTML

<div id="bookingjs" style="margin: 32px"></div>
<script type="module">
  import * as timum from 'https://cdn.timum.de/bookingjs/1/booking.js';

	const appConfig = {
  	ref: "booking-widget-demo-resource@timum",
    calendarFrontend: "pureListView"
  }
  
  const muiTheme = {
    palette: {
      common: {
        black: '#000000',
      },
      primary: {
      	light: '#ff524c',
        main: '#b61b20',
      },
      secondary: {
        light: '#ff524c',
        main: '#b61b20',
      },
      background: {
      	default:'#f1fcff',
        paper: '#f1fcff'
      }
     },
     components: {
      MuiCssBaseline: {
        styleOverrides: {
          body: {
            scrollbarColor: '#bfbfbf #ffffff',
            '&::-webkit-scrollbar, & *::-webkit-scrollbar': {
              backgroundColor: 'transparent',
            },
          }
        }
      },
     	MuiButton: {
     	 styleOverrides: {
          outlined: {
            '&:hover': {
              color: '#ff524c',
              borderColor: '#ff524c',
              backgroundColor: 'transparent',
            }
          },
          contained: {
           '&:hover': {
              backgroundColor: '#ff524c'
            }
          }
        }
     	},
      MuiListItem: {
      	styleOverrides: {
        	root: {
						//borderColor: '#bfbfbf !important',
          	'&:hover': {
            	backgroundColor: 'transparent',
            	borderColor:'#ff524c !important',
              color: '#ff524c',
            }
          }
        }
      },
      MuiListItemButton: {
        styleOverrides: {
          root: {
            color: '#b61b20',
            paddingTop: '10px',
            paddingBottom: '10px',
            '&:hover': {
              color: '#ff524c',
              backgroundColor: 'transparent',
            },
          },
        },
      },
      MuiListItemText: {
        styleOverrides: {
          primary: {
            color: '#212121',
          },
        },
      },
     ...