modified: templates/playlists.html
This commit is contained in:
@@ -112,16 +112,55 @@
|
|||||||
margin-top: 18px;
|
margin-top: 18px;
|
||||||
word-break: break-all;
|
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>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<a href="{{ url_for('logout') }}" class="logout-btn" style="position:absolute;top:20px;right:30px;">
|
<div class="top-bar">
|
||||||
{{ translations['logout'] if translations['logout'] else 'Logout' }}
|
<div class="top-bar-section left">
|
||||||
</a>
|
<button class="btn" onclick="openInvitePopup()">
|
||||||
<button class="btn" onclick="openInvitePopup()" style="position:absolute;top:20px;left:30px;">
|
|
||||||
{{ translations['invite_guest'] if translations['invite_guest'] else 'Invite Guest' }}
|
{{ translations['invite_guest'] if translations['invite_guest'] else 'Invite Guest' }}
|
||||||
</button>
|
</button>
|
||||||
<div class="playlist-container">
|
</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>
|
<h2>{{ translations['choose_playlist'] }}</h2>
|
||||||
<ul>
|
<ul>
|
||||||
{% for pl in playlists %}
|
{% for pl in playlists %}
|
||||||
@@ -143,13 +182,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</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>
|
<script>
|
||||||
function openInvitePopup() {
|
function openInvitePopup() {
|
||||||
document.getElementById('invitePopup').style.display = 'flex';
|
document.getElementById('invitePopup').style.display = 'flex';
|
||||||
|
|||||||
Reference in New Issue
Block a user