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.

Sign up for GitHub

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

Jump to bottom

Fix regressions in my-account sub menu and sub titles #3031

Merged
merged 3 commits into from
Aug 3, 2020
Merged

Fix regressions in my-account sub menu and sub titles #3031

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b690bb1
Fix regressions sub-menu titles on mobile-view
kimsible Aug 3, 2020
989cf45
Fix regression subscriptions icon in dropdown sub-menu
kimsible Aug 3, 2020
82ddb94
Fix regression blocklist-accounts icon in sub-title
kimsible Aug 3, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 6 additions & 3 deletions ...t/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
<h1 class="d-flex justify-content-between">
<h1>
<span>
<my-global-icon iconName="channel" aria-hidden="true"></my-global-icon>
<ng-container i18n>My channels</ng-container>
<span class="badge badge-secondary">{{ totalItems }}</span>
</span>
</h1>

<div class="video-channels-header d-flex justify-content-between">
<div class="has-feedback has-clear">
<input type="text" placeholder="Search your channels" i18n-placeholder [(ngModel)]="channelsSearch" (ngModelChange)="onChannelsSearchChanged()" />
<input type="text" placeholder="Search your channels" i18n-placeholder [(ngModel)]="channelsSearch"
(ngModelChange)="onChannelsSearchChanged()" />
<a class="glyphicon glyphicon-remove-sign form-control-feedback form-control-clear" (click)="resetSearch()"></a>
<span class="sr-only" i18n>Clear filters</span>
</div>
Expand All @@ -15,7 +18,7 @@ <h1 class="d-flex justify-content-between">
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Create video channel</ng-container>
</a>
</h1>
</div>

<div class="video-channels">
<div *ngFor="let videoChannel of videoChannels; let i = index" class="video-channel">
Expand Down
15 changes: 15 additions & 0 deletions ...t/src/app/+my-account/+my-account-video-channels/my-account-video-channels.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,10 @@ input[type=text] {
top: 1px;
}

.video-channels-header {
margin-bottom: 30px;
}

@media screen and (max-width: $small-view) {
.video-channels-header {
text-align: center;
Expand Down Expand Up @@ -97,6 +101,17 @@ input[type=text] {
}
}

@media screen and (max-width: $mobile-view) {
.video-channels-header {
flex-direction: column;

input[type=text] {
width: 100% !important;
margin-bottom: 12px;
}
}
}

@media screen and (min-width: breakpoint(lg)) {
:host-context(.main-col:not(.expanded)) {
.video-channel-buttons {
Expand Down
9 changes: 6 additions & 3 deletions client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,19 @@
<h1 class="d-flex justify-content-between">
<h1>
<span>
<my-global-icon iconName="subscriptions" aria-hidden="true"></my-global-icon>
<ng-container i18n>My subscriptions</ng-container>
<span class="badge badge-secondary"> {{ pagination.totalItems }}</span>
</span>
</h1>

<div class="video-subscriptions-header d-flex justify-content-between">
<div class="has-feedback has-clear">
<input type="text" placeholder="Search your subscriptions" i18n-placeholder [(ngModel)]="subscriptionsSearch" (ngModelChange)="onSubscriptionsSearchChanged()" />
<input type="text" placeholder="Search your subscriptions" i18n-placeholder [(ngModel)]="subscriptionsSearch"
(ngModelChange)="onSubscriptionsSearchChanged()" />
<a class="glyphicon glyphicon-remove-sign form-control-feedback form-control-clear" (click)="resetSearch()"></a>
<span class="sr-only" i18n>Clear filters</span>
</div>
</h1>
</div>

<div class="no-results" i18n *ngIf="pagination.totalItems === 0">You don't have any subscriptions yet.</div>

Expand Down
18 changes: 14 additions & 4 deletions client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,11 @@ input[type=text] {
}
}

@media screen and (max-width: $small-view) {
.video-channels-header {
text-align: center;
}
.video-subscriptions-header {
margin-bottom: 30px;
}

@media screen and (max-width: $small-view) {
.video-channel {
.video-channel-info {
padding-bottom: 10px;
Expand All @@ -68,4 +68,14 @@ input[type=text] {
}
}

@media screen and (max-width: $mobile-view) {
.video-subscriptions-header {
flex-direction: column;

input[type=text] {
width: 100% !important;
}
}
}


9 changes: 6 additions & 3 deletions .../src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,14 @@
<h1 class="d-flex justify-content-between">
<h1>
<span>
<my-global-icon iconName="playlists" aria-hidden="true"></my-global-icon>
<ng-container i18n>My playlists</ng-container> <span class="badge badge-secondary">{{ pagination.totalItems }}</span>
</span>
</h1>

<div class="video-playlists-header d-flex justify-content-between">
<div class="has-feedback has-clear">
<input type="text" placeholder="Search your playlists" i18n-placeholder [(ngModel)]="videoPlaylistsSearch" (ngModelChange)="onVideoPlaylistSearchChanged()" />
<input type="text" placeholder="Search your playlists" i18n-placeholder [(ngModel)]="videoPlaylistsSearch"
(ngModelChange)="onVideoPlaylistSearchChanged()" />
<a class="glyphicon glyphicon-remove-sign form-control-feedback form-control-clear" (click)="resetSearch()"></a>
<span class="sr-only" i18n>Clear filters</span>
</div>
Expand All @@ -14,7 +17,7 @@ <h1 class="d-flex justify-content-between">
<my-global-icon iconName="add" aria-hidden="true"></my-global-icon>
<ng-container i18n>Create playlist</ng-container>
</a>
</h1>
</div>

<div class="video-playlists" myInfiniteScroller [autoInit]="true" (nearOfBottom)="onNearOfBottom()" [dataObservable]="onDataSubject.asObservable()">
<div *ngFor="let playlist of videoPlaylists" class="video-playlist">
Expand Down
12 changes: 4 additions & 8 deletions .../src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,10 @@ input[type=text] {
}
}

.video-playlists-header {
margin-bottom: 30px;
}

@media screen and (max-width: $small-view) {
.video-playlists-header {
text-align: center;
Expand All @@ -62,14 +66,6 @@ input[type=text] {
}
}

@media only screen and (min-width: $mobile-view) and (max-width: $small-view) {
.video-playlists-header {
input[type=text] {
width: 42% !important;
}
}
}

@media screen and (max-width: $mobile-view) {
.video-playlists-header {
flex-direction: column;
Expand Down
9 changes: 6 additions & 3 deletions client/src/app/+my-account/my-account-videos/my-account-videos.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,19 @@
<h1 class="d-flex justify-content-between">
<h1>
<span>
<my-global-icon iconName="videos" aria-hidden="true"></my-global-icon>
<ng-container i18n>My videos</ng-container>
<span class="badge badge-secondary"> {{ pagination.totalItems }}</span>
</span>
</h1>

<div class="videos-header d-flex justify-content-between">
<div class="has-feedback has-clear">
<input type="text" placeholder="Search your videos" i18n-placeholder [(ngModel)]="videosSearch" (ngModelChange)="onVideosSearchChanged()" />
<input type="text" placeholder="Search your videos" i18n-placeholder [(ngModel)]="videosSearch"
(ngModelChange)="onVideosSearchChanged()" />
<a class="glyphicon glyphicon-remove-sign form-control-feedback form-control-clear" (click)="resetSearch()"></a>
<span class="sr-only" i18n>Clear filters</span>
</div>
</h1>
</div>

<my-videos-selection
[pagination]="pagination"
Expand Down
14 changes: 10 additions & 4 deletions client/src/app/+my-account/my-account-videos/my-account-videos.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,10 +56,6 @@ my-edit-button {
}

@media screen and (max-width: $small-view) {
.videos-header {
flex-direction: column;
}

.action-button {
flex-direction: column;
align-self: center;
Expand Down Expand Up @@ -119,3 +115,13 @@ my-edit-button {
}
}
}

@media screen and (max-width: $mobile-view) {
.videos-header {
flex-direction: column;

input[type=text] {
width: 100% !important;
}
}
}
2 changes: 1 addition & 1 deletion client/src/app/+my-account/my-account.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export class MyAccountComponent implements OnInit {
{
label: this.i18n('My subscriptions'),
routerLink: '/my-account/subscriptions',
iconName: 'inbox-full'
iconName: 'subscriptions'
},
{
label: this.i18n('My history'),
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/shared/shared-moderation/account-blocklist.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<h1>
<my-global-icon iconName="user" aria-hidden="true"></my-global-icon>
<my-global-icon iconName="user-x" aria-hidden="true"></my-global-icon>
<ng-container i18n>Muted accounts</ng-container>
</h1>

Expand Down