Spaces:
Sleeping
Sleeping
{% extends 'base.html' %} | |
{% block content %} | |
{% if cast_info %} | |
<div style="display: flex;"> | |
<div style="max-width: 30%;"> | |
<img src="{{ cast_info.image }}" alt="{{ title }}" style="width: 300px; object-fit: contain;"> | |
</div> | |
<div style="max-width: 70%; padding-left: 20px;"> | |
<h2>{{ cast_info.name }}</h2> | |
<p>{{ cast_info.bio }}</p> | |
</div> | |
</div> | |
<h2>{{ title }}</h2> | |
{% else %} | |
<h1>{{ title }}</h1> | |
{% endif %} | |
<div> | |
{% for movie in movies %} | |
<div class="tile-element" onclick="showDetails({{ movie.id }})"> | |
<img src="https://image.tmdb.org/t/p/w500{{ movie.poster_path }}" alt="{{ movie.title }}"> | |
<h4>{{ movie.title }}</h4> | |
</div> | |
{% endfor %} | |
</div> | |
<div> | |
{% if page > 1 %} | |
<a href="?page={{ page - 1 }}">Previous</a> | |
{% endif %} | |
{% if page < total_pages %} <a href="?page={{ page + 1 }}">Next</a> | |
{% endif %} | |
</div> | |
<div id="overlay" onclick="closePanel()"></div> <!-- Overlay for closing panel --> | |
<div id="side-panel"> | |
<img id="movie-poster" src="" alt="${movie.title} Poster" style="max-width: 150px;"> | |
<div id="movie-details"> | |
<!-- Movie details will be injected here --> | |
</div> | |
<span id="close-button" onclick="closePanel()">×</span> | |
</div> | |
{% endblock %} |