JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<title>DarkRP Loadingscreen</title>
<!-- ###################################### START STYLE #################################################### -->
<style>
body {
background-color: #194719;
}
li {
list-style: none;
}
#serverName {
border: 7px solid #009933;
background-color: #009933;
color: white;
font-family: tahoma;
width: 22%;
text-align: center;
margin-left: auto;
margin-right: auto;
margin-top: 15%;
}
#main {
border: 7px solid #336600;
background-color: #336600;
width: 21.75%;
margin-left: auto;
margin-right: auto;
color: white;
font-family: tahoma;
padding-top: 0.5%;
padding-left: 0.25%;
}
#imgbox {
border: 7px solid #336600;
background-color: #336600;
width: 22%;
margin-left: auto;
margin-right: auto;
text-align: center;
}
#statusBox {
border: 7px solid #336600;
background-color: #336600;
width: 22%;
margin-left: auto;
margin-right: auto;
text-align: center;
font-family: tahoma;
color: white;
}
.circular {
margin-left: auto;
margin-right: auto;
width: 25%;
height: 1000%;
border: 1px solid #336600;
border-radius: 50% 50% 50% 50%;
}
</style>
<!-- ###################################### END STYLE #################################################### -->
</head>
<body>
<!-- ###################################### START SCRIPT #################################################### -->
<script src="jquery.js"></script>
<script>
function GameDetails( servername, serverurl, mapname, maxplayers, steamid, gamemode ){
document.getElementById("name").innerHTML = "Server: " + servername;
document.getElementById("map").innerHTML = mapname;
document.getElementById("steamid").innerHTML = steamid;
document.getElementById("slots").innerHTML = maxplayers;
document.getElementById("mode").innerHTML = gamemode;
}
function DownloadingFile(...
CSS
body {
background-color: #194719;
}
li {
list-style: none;
}
#serverName {
border: 7px solid #009933;
background-color: #009933;
color: white;
font-family: tahoma;
width: 22%;
text-align: center;
margin-left: auto;
margin-right: auto;
margin-top: 15%;
}
#main {
border: 7px solid #336600;
background-color: #336600;
width: 21.75%;
margin-left: auto;
margin-right: auto;
color: white;
font-family: tahoma;
padding-top: 0.5%;
padding-left: 0.25%;
}
#imgbox {
border: 7px solid #336600;
background-color: #336600;
width: 22%;
margin-left: auto;
margin-right: auto;
text-align: center;
}
#statusBox {
border: 7px solid #336600;
background-color: #336600;
width: 22%;
margin-left: auto;
margin-right: auto;
text-align: center;
font-family: tahoma;
color: white;
}
.circular {
margin-left: auto;
margin-right: auto;
width: 25%;
height: 1000%;
border: 1px solid #336600;
border-radius: 50% 50% 50% 50%;
}