<!DOCTYPE html>
<html lang="ja">
<head>
<title>美人投票ゲーム
</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="background-color:silver; text-align:center;">
<style>
#title{
background-color: darkblue;
color: #fffcfc;
text-shadow:#999;
}
#myResult{
font-size: 50px;
color: red;
}
#order{
border: solid 2px black;
margin: auto;
margin-top: 20px;
margin: 0;
display: flex;
justify-content: center; /* 横方向に中央揃え */
align-items: center; /* 縦方向に中央揃え */
}
#checkButton{
background: hsl(0, 0%, 0%);
color: white;
margin: 0.5em 0;
font-size: 20px;
box-sizing: border-box;
padding: 10px 20px;
width:fit-content;
border-radius: 4px; /* ボタンの角丸 */
cursor: pointer; /* ポインターをボタンに合わせた時のカーソルスタイル */
}
</style>
<div id="title">
<h1>BeautyVoteResult</h1>
<h2>Your Score</h2>
<h2 id = "myResult"> 0pt </h2>
</div>
<div id="order">
<table style="width: 600px">
<tr>
<td>order</td>
<td>player name</td>
<td>score(pt)</td>
</tr>
{% for i in order_table %}
<tr>
{% for j in i %}
<td>{{j}}</td>
{% endfor %}
</tr>
{% endfor %}
</table>
</div>
<script>
// URLからパラメータを取得
const urlParams = new URLSearchParams(window.location.search);
// パラメータ名を指定して値を取得
const valueReceived = urlParams.get('valueENG');
// <h2>要素のテキスト内容を受け取った値に設定
document.getElementById("myResult").innerText = valueReceived;
</script>
<noscript>JavaScriptをONにして起動して下さい</noscript>
</body>
</html>