{%extends 'base.html' %} {%block head %}

<link rel="stylesheet" href="{{url_for('static', filename='css/display.css')}}" />
<title>Display</title>
{%endblock%} {%block nav%}
<a href="{{url_for('home.home')}}">Home</a>
<a href="{{url_for('draw.last')}}">Draw</a>

{%endblock%} {%block contents%}

<h1>Exquisite Branch</h1>

<div class="streams">
	{% for stream in streams %}
	<div
		class="stream"
		style="color: rgb({{ range(0, 255) | random }},{{ range(0, 255) | random }},{{ range(0, 255) | random }}); transform: translate({{ range(-5, 5) | random }}px, {{ range(-5, 5) | random }}px)"
	>
		{% for branch in stream %}
		<div class="svg-container">
			{{branch['content'] | safe}}
			<span
				class="author"
				style="transform: translate({{ range(-50, 50) | random }}px, {{ range(-10, 10) | random }}px"
			>
				{{ branch['username']}}
			</span>
		</div>
		{%endfor%}
	</div>
	{%endfor%}
</div>

{{colors}}

<h2>Branches</h2>
<div class="branches">
	{% for stream in streams %}
	<div class="branch">
		{% for branch in stream %}
		<div class="svg-container">
			{{branch['content'] | safe}}
			<span class="author"> {{ branch['username']}} </span>
		</div>
		{%endfor%}
	</div>
	{%endfor%}
</div>
{%endblock%}