Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Video list filters labelling, button and sort select UI improvements #6128

Closed
wants to merge 1 commit into from

Conversation

rigelk
Copy link
Collaborator

@rigelk rigelk commented Dec 20, 2023

Description

Displays labels for languages and categories instead of the raw ids.
Changes radio buttons to checkboxes for scope selection.
Clearer sort selection with description and grouping by type of sort.
Rely on peertube-checkbox whenever possible for uniformity of style and conciseness.

This PR might be improved by applying the same treatement as scope radio buttons to the type of video (live/vod) radio buttons.

Screenshots

Capture d’écran 2023-12-21 à 15 04 46

@rigelk rigelk force-pushed the feat/filter-labels branch from 0cbd9c4 to 3f05a65 Compare December 20, 2023 14:44
and rounded/uniformized border for filter/select
@rigelk rigelk force-pushed the feat/filter-labels branch from 3f05a65 to f644701 Compare December 21, 2023 14:00
Copy link
Owner

@Chocobozzz Chocobozzz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks and sorry for the late review!

<input formControlName="scope" type="radio" name="scope" id="scopeLocal" value="local" />
<label for="scopeLocal" i18n>Local videos (this instance)</label>
</div>

<div class="peertube-radio-container">
<div class="peertube-radio-container" [hidden]="true">
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is it hidden and note removed?

@@ -42,16 +42,22 @@
formControlName="sort"
[clearable]="false"
[searchable]="false"
[bindValue]="null"
[items]="getSortOptions()"
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[items] must be immutable or the component will rebuild options indefinitely

@@ -109,7 +114,9 @@

::ng-deep {
.ng-select-container {
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we have the same padding as other pastilles?

}

.filters-toggle {
border: 2px solid pvar(--mainForegroundColor);
border: 1px solid;
border-color: #adadad #C6C6C6 lightgray;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we use peertube css variables to not break themes?

@Chocobozzz
Copy link
Owner

Closing due to inactivity. Does not hesitate to ask for the reopening :)

@Chocobozzz Chocobozzz closed this Feb 23, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants