Our great sponsors
-
Bootstrap
The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
I wrote this myself and used the Bootstrap CSS framework (Bootstrap gives you lots of ready-made components - see https://getbootstrap.com/) with CSS theme called 'Zephyr' from Bootswatch (see https://bootswatch.com/zephyr/). I then made quite a few of my own CSS and JS modifications to the framework.
The interactive map on the site is done with Leaflet (to display the map in browsers), where I then used a mixture of open datasets and manual drawing for creating the polygons (a set of coordinates that define the 'edges' around a country) for each country in GeoJSON. Once I had the polygons for my map, I placed them into my country's database, and then just used Jinja to loop out the countries onto the page, with the relevant green/red list status, in addition to some modifications/add-ons to the Leaflet JS script to add stuff like pop-ups, legend etc. as well as some additional CSS to style the map to match the overall theme of my site.