import {createRoot} from 'react-dom/client';
import {AppRegistry} from 'react-native';

import App from './src/App';

// @ts-ignore
import outfitFont from './web/public/fonts/Outfit.ttf';
// @ts-ignore
import FontAwesome from 'react-native-vector-icons/Fonts/FontAwesome.ttf';
// @ts-ignore
import MaterialIcons from 'react-native-vector-icons/Fonts/MaterialIcons.ttf';
// @ts-ignore
import Ionicons from 'react-native-vector-icons/Fonts/Ionicons.ttf';
// @ts-ignore
import MaterialCommunityIcons from 'react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf';

const iconFontStyles = `@font-face {
  src: url(${MaterialCommunityIcons});
  font-family: MaterialCommunityIcons;
}
@font-face {
  src: url(${FontAwesome});
  font-family: FontAwesome;
}
@font-face {
  src: url(${MaterialIcons});
  font-family: MaterialIcons;
}
@font-face {
  src: url(${Ionicons});
  font-family: Ionicons;
}
@font-face {
  font-family: 'Outfit-Thin';
  src: url(${outfitFont});
  font-weight: 100;
}
@font-face {
  font-family: 'Outfit-ExtraLight';
  src: url(${outfitFont});
  font-weight: 200;
}
@font-face {
  font-family: 'Outfit-Light';
  src: url(${outfitFont});
  font-weight: 300;
}
@font-face {
  font-family: 'Outfit-Regular';
  src: url(${outfitFont});
  font-weight: 400;
}
@font-face {
  font-family: 'Outfit-Medium';
  src: url(${outfitFont});
  font-weight: 500;
}
@font-face {
  font-family: 'Outfit-SemiBold';
  src: url(${outfitFont});
  font-weight: 600;
}
@font-face {
  font-family: 'Outfit-Bold';
  src: url(${outfitFont});
  font-weight: 700;
}
@font-face {
  font-family: 'Outfit-ExtraBold';
  src: url(${outfitFont});
  font-weight: 800;
}
@font-face {
  font-family: 'Outfit-Black';
  src: url(${outfitFont});
  font-weight: 900;
}

`;

const style = document.createElement('style');
style.type = 'text/css';

style.appendChild(document.createTextNode(iconFontStyles));

document.head.appendChild(style);

const root = createRoot(document.getElementById('root') as HTMLElement);
root.render(<App />);