<!DOCTYPE html>
<html>
<head>
	<title>KUKapp</title>
	<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
	<script src="{{ url_for('static', filename='script.js') }}"></script>
	<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
	<script src="https://use.fontawesome.com/2fef7be393.js"></script>
	<style type="text/css">
		html {
			background-image: url({{url_for('static', filename='burger.jpg')}});
			background-position: left top;
			background-repeat: no-repeat;
			background-size: 100% auto;
			background-color: #aeaeac;
		}
	</style>
</head>
<body>
	<div class="leaderboard">
		<h1 style="text-align: center">Leaderboard</h1>
		<div class="leaderboard-contiainer">
			{% for person in leaderboard %}
			<div class="lb-entry">
				<img src="{{url_for('static', filename=person['name'] + '.png')}}">
				<span class="name">{{ person['name'] }}</span>
				<span class="score">{{ person['score'] }}</span>
			</div>
			{% endfor %}
		</div>
	</div>
	<div class="next-meal">
		<h1 style="padding-left: 40pt">Next Meal</h1>
		<h2>Cook</h2>
			<div class="cook-entry">
				Davide
			</div>
		<h2>Eaters</h2>
			<div class="eater-entry">
				Marek
			</div>
			<div class="eater-entry">
				Sven
			</div>
			
	</div>
	<div class="user-info">
		<div class="user-card">
			<img src="{{url_for('static', filename=current_user_name + '.png')}}">
			<span>{{current_user_name}}</span>
			<div class="logout-button" onclick="location.href='/logout';"><span>LOGOUT</span></div>
		</div>
	</div>
</body>
</html>