Show and tell - UFC MMA Predictor Web App

Hi @chriddyp can you please add my web app to the show and tell mega thread :slight_smile: ?

Description: A web app to predict upcoming UFC fights

Application: https://ufcmmapredictor.herokuapp.com/

GitHub: https://github.com/jasonchanhku/UFC-MMA-Predictor

Thanks ! Let me know if you need any other info.

Regards,
Jason

2 Likes

Hi Jason, how did you ensure a consistent font family across the app? Including the dropdowns… I wasnt able to find anything that specified font family explicitly in your code?
Thanks a lot!

I believe this is controlled by the CSS part of the app.
If you look at Jason’s file “app.py” in line 666 (:metal:) you see that he is appending a css-stylesheet.
If you open this css file (you can do this in your browser) you will see that in a section named “Base Styles” where the font families are defined.

I am no expert in css but I believe this is the place to look :slight_smile:

aah ok! I missed that. Thank you!

1 Like

Hi @shivanit , thanks for your interest in the project. Apologies for the late reply, a bit flattened at work these days.

Excellent explanation by @Blaceus . It is indeed from the appending css style sheet that gave the whole web app a uniform font. However, do note that different section’s attributes such as font size and color should be specified in the style parameter of the function.

Also, there is no significance of the code being on line 666. It was purely coincidental :slight_smile: . I’m sure Batman agrees !

1 Like

Thanks for the explanation :slight_smile: Love the app! Especially the design. Its beautiful!

1 Like