modified: templates/playlists.html

This commit is contained in:
SimolZimol
2025-06-04 17:45:13 +02:00
parent 63fd03fc8f
commit fbd0552985

View File

@@ -112,16 +112,55 @@
margin-top: 18px;
word-break: break-all;
}
.top-bar {
width: 100%;
padding: 10px 0;
background: rgba(25, 20, 20, 0.85);
position: fixed;
top: 0;
left: 0;
display: flex;
justify-content: space-between;
align-items: center;
z-index: 100;
}
.top-bar-section {
display: flex;
align-items: center;
}
.top-bar-section.left {
margin-left: 30px;
}
.top-bar-section.center {
flex-grow: 1;
justify-content: center;
}
.top-bar-section.right {
margin-right: 30px;
}
</style>
</head>
<body>
<a href="{{ url_for('logout') }}" class="logout-btn" style="position:absolute;top:20px;right:30px;">
{{ translations['logout'] if translations['logout'] else 'Logout' }}
</a>
<button class="btn" onclick="openInvitePopup()" style="position:absolute;top:20px;left:30px;">
{{ translations['invite_guest'] if translations['invite_guest'] else 'Invite Guest' }}
</button>
<div class="playlist-container">
<div class="top-bar">
<div class="top-bar-section left">
<button class="btn" onclick="openInvitePopup()">
{{ translations['invite_guest'] if translations['invite_guest'] else 'Invite Guest' }}
</button>
</div>
<div class="top-bar-section center">
{% if user %}
<img src="{{ user.images[0].url if user.images and user.images[0] }}" style="width:32px;border-radius:50%;vertical-align:middle;margin-right:8px;">
<span>{{ user.display_name }}</span>
{% endif %}
</div>
<div class="top-bar-section right">
<a href="{{ url_for('logout') }}" class="btn btn-danger">
{{ translations['logout'] if translations['logout'] else 'Logout' }}
</a>
</div>
</div>
<div class="playlist-container" style="margin-top:80px;">
<h2>{{ translations['choose_playlist'] }}</h2>
<ul>
{% for pl in playlists %}
@@ -143,13 +182,6 @@
</div>
</div>
{% if user %}
<div style="text-align:right;">
<img src="{{ user.images[0].url if user.images and user.images[0] }}" style="width:32px;border-radius:50%;vertical-align:middle;">
<span>{{ user.display_name }}</span>
</div>
{% endif %}
<script>
function openInvitePopup() {
document.getElementById('invitePopup').style.display = 'flex';