You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
<!DOCTYPE html>
|
|
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<meta charset="utf-8">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title> {{ title }}</title>
|
|
|
|
<link rel="stylesheet" type="text/css" href="static/style.css">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div class="container">
|
|
|
|
<div class ="heading">
|
|
|
|
<h1 class = "title">{{ title }}</h1>
|
|
|
|
</div>
|
|
|
|
<div class="gallery">
|
|
|
|
{% for item in playlist %}
|
|
|
|
<a class = "{{item.type}}" href="{{ item.link }}">
|
|
|
|
<img src="img/{{ item.img }}" alt="{{ item.title }}">
|
|
|
|
</a>
|
|
|
|
|
|
|
|
<div class = "label-container">
|
|
|
|
<div class ="title"> <p> Title: {{item.title}}</p></div>
|
|
|
|
<div class ="type"> <p> Category: {{item.type}}</p></div>
|
|
|
|
<div class ="content"> <p> Content: {{item.content}}</p></div>
|
|
|
|
<div class ="annotation"> <p> Annotation: {{item.onText}}</p></div>
|
|
|
|
</div>
|
|
|
|
{% endfor %}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</body>
|
|
|
|
</html>
|