tubearchivist/tubearchivist-frontend
1
0
Fork 0
mirror of https://github.com/tubearchivist/tubearchivist-frontend.git synced 2024-12-23 02:10:15 +00:00
Code Issues Projects Releases Wiki Activity

simplify the subscribe buttons

Browse Source
This commit is contained in:
simon 2022-01-01 17:25:57 +07:00
parent 4915aa0c11
commit f7fce001c4
No known key found for this signature in database
GPG Key ID: 2C15AA5E89985DD4
5 changed files with 38 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
tubearchivist/home/forms.py
View File

@ -116,7 +116,7 @@ class SubscribeToChannelForm(forms.Form):
"""text area form to subscribe to multiple channels"""
subscribe = forms.CharField(
label=False,
label="Subscribe to channels",
widget=forms.Textarea(
attrs={
"rows": 3,
@ -130,11 +130,11 @@ class SubscribeToPlaylistForm(forms.Form):
"""text area form to subscribe to multiple playlists"""
subscribe = forms.CharField(
label=False,
label="Subscribe to playlists",
widget=forms.Textarea(
attrs={
"rows": 3,
"placeholder": "Input playlist IDs",
"placeholder": "Input playlist IDs or URLs",
}
),
)

17
tubearchivist/home/templates/home/channel.html
View File

@ -3,14 +3,12 @@
{% load humanize %}
{% block content %}
<div class="boxed-content">
<div class="title-bar">
<h1>Channels</h1>
</div>
<div id="notifications" data="channel"></div>
<div class="info-box info-box-2">
<div class="icon-text">
<img id="add-icon" onclick="showForm()" src="{% static 'img/icon-add.svg' %}" alt="add-icon">
<p>Subscribe to Channels</p>
<div class="title-split">
<div class="title-bar">
<h1>Channels</h1>
</div>
<div class="title-split-form">
<img id="add-icon" onclick="showForm()" src="{% static 'img/icon-add.svg' %}" alt="add-icon" title="Subscribe to Channels">
<div class="show-form">
<form id="hidden-form" action="/channel/" method="post">
{% csrf_token %}
@ -20,9 +18,10 @@
</div>
</div>
</div>
<div id="notifications" data="channel"></div>
<div class="view-controls">
<div class="toggle">
<span>Show only subscribed channels:</span>
<span>Show subscribed only:</span>
<div class="toggleBox">
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
{% if show_subed_only %}

17
tubearchivist/home/templates/home/playlist.html
View File

@ -2,14 +2,12 @@
{% load static %}
{% block content %}
<div class="boxed-content">
<div class="title-bar">
<h1>Playlists</h1>
</div>
<div id="notifications" data="playlist"></div>
<div class="info-box info-box-2">
<div class="icon-text">
<img id="add-icon" onclick="showForm()" src="{% static 'img/icon-add.svg' %}" alt="add-icon">
<p>Subscribe to Playlist</p>
<div class="title-split">
<div class="title-bar">
<h1>Playlists</h1>
</div>
<div class="title-split-form">
<img id="add-icon" onclick="showForm()" src="{% static 'img/icon-add.svg' %}" alt="add-icon" title="Subscribe to Playlists">
<div class="show-form">
<form id="hidden-form" action="/playlist/" method="post">
{% csrf_token %}
@ -19,9 +17,10 @@
</div>
</div>
</div>
<div id="notifications" data="playlist"></div>
<div class="view-controls">
<div class="toggle">
<span>Show only subscribed playlists:</span>
<span>Show subscribed only:</span>
<div class="toggleBox">
<input id="show_subed_only" onclick="toggleCheckbox(this)" type="checkbox" {% if show_subed_only %}checked{% endif %}>
{% if show_subed_only %}

2
tubearchivist/home/views.py
View File

@ -517,7 +517,7 @@ class PlaylistView(ArchivistResultsView):
self.context.update(
{
"title": "Playlists",
"subscribe_form": SubscribeToChannelForm(),
"subscribe_form": SubscribeToPlaylistForm(),
}
)

23
tubearchivist/static/css/style.css
View File

@ -275,7 +275,7 @@ button:hover {
.sort {
display: flex;
flex-wrap: wrap;
align-content: center;
align-items: center;
}
.padding-box {
@ -467,6 +467,23 @@ button:hover {
/* info box */
.title-split {
display: grid;
grid-template-columns: 1fr 1fr;
}
.title-split img {
width: 40px;
filter: var(--img-filter);
cursor: pointer;
margin: 0 10px;
}
.title-split-form {
padding-top: 30px;
display: flex;
}
.info-box {
display: grid;
grid-gap: 1rem;
@ -505,10 +522,6 @@ button:hover {
margin-bottom: 10px;
}
.sort span {
width: 100%;
}
/* login */
.login-page {
display: flex;