diff --git a/client/src/app/+about/about-instance/about-instance.component.html b/client/src/app/+about/about-instance/about-instance.component.html index 043f63354..1df1ef2ad 100644 --- a/client/src/app/+about/about-instance/about-instance.component.html +++ b/client/src/app/+about/about-instance/about-instance.component.html @@ -96,9 +96,8 @@
-
- STATISTICS -
+
+
STATISTICS
diff --git a/client/src/app/+about/about-instance/about-instance.component.ts b/client/src/app/+about/about-instance/about-instance.component.ts index c8c156105..e1809d7b7 100644 --- a/client/src/app/+about/about-instance/about-instance.component.ts +++ b/client/src/app/+about/about-instance/about-instance.component.ts @@ -1,17 +1,18 @@ -import { Component, OnInit, ViewChild } from '@angular/core' +import { Component, OnInit, ViewChild, AfterViewChecked } from '@angular/core' import { Notifier, ServerService } from '@app/core' import { ContactAdminModalComponent } from '@app/+about/about-instance/contact-admin-modal.component' import { InstanceService } from '@app/shared/instance/instance.service' import { ServerConfig } from '@shared/models' import { ActivatedRoute } from '@angular/router' import { ResolverData } from './about-instance.resolver' +import { ViewportScroller } from '@angular/common' @Component({ selector: 'my-about-instance', templateUrl: './about-instance.component.html', styleUrls: [ './about-instance.component.scss' ] }) -export class AboutInstanceComponent implements OnInit { +export class AboutInstanceComponent implements OnInit, AfterViewChecked { @ViewChild('contactAdminModal', { static: true }) contactAdminModal: ContactAdminModalComponent shortDescription = '' @@ -35,8 +36,8 @@ export class AboutInstanceComponent implements OnInit { serverConfig: ServerConfig constructor ( + private viewportScroller: ViewportScroller, private route: ActivatedRoute, - private notifier: Notifier, private serverService: ServerService, private instanceService: InstanceService ) {} @@ -72,6 +73,10 @@ export class AboutInstanceComponent implements OnInit { this.html = await this.instanceService.buildHtml(about) } + ngAfterViewChecked () { + if (window.location.hash) this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + } + openContactModal () { return this.contactAdminModal.show() } diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html index be89d8294..b3b4f7728 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html @@ -1,8 +1,8 @@
- + - + @@ -210,7 +210,7 @@
-
2vCore 2GB RAM/or directly the link to the server you rent etc
+
i.e. 2vCore 2GB RAM, a direct the link to the server you rent, etc.
- +
APPEARANCE
- Use plugins & themes for more involved changes. + Use plugins & themes for more involved changes, or add slight customizations.
@@ -391,6 +391,9 @@
FEDERATION
+
+ Manage relations with other instances. +
@@ -489,7 +492,7 @@ - +
@@ -542,7 +545,7 @@ - +
@@ -718,6 +721,7 @@
+
CUSTOMIZATIONS
Slight modifications to your PeerTube instance for when creating a plugin or theme is overkill. diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts index c88e81c01..c3eac68bb 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts +++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core' +import { Component, OnInit, AfterViewChecked, ViewChild } from '@angular/core' import { ConfigService } from '@app/+admin/config/shared/config.service' import { ServerService } from '@app/core/server/server.service' import { CustomConfigValidatorsService, FormReactive, UserValidatorsService } from '@app/shared' @@ -9,13 +9,18 @@ import { FormValidatorService } from '@app/shared/forms/form-validators/form-val import { SelectItem } from 'primeng/api' import { forkJoin } from 'rxjs' import { ServerConfig } from '@shared/models' +import { ViewportScroller } from '@angular/common' +import { NgbTabset } from '@ng-bootstrap/ng-bootstrap' @Component({ selector: 'my-edit-custom-config', templateUrl: './edit-custom-config.component.html', styleUrls: [ './edit-custom-config.component.scss' ] }) -export class EditCustomConfigComponent extends FormReactive implements OnInit { +export class EditCustomConfigComponent extends FormReactive implements OnInit, AfterViewChecked { + @ViewChild('tabs') private tabs: NgbTabset + + initDone = false customConfig: CustomConfig resolutions: { id: string, label: string, description?: string }[] = [] @@ -27,6 +32,7 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit { private serverConfig: ServerConfig constructor ( + private viewportScroller: ViewportScroller, protected formValidatorService: FormValidatorService, private customConfigValidatorsService: CustomConfigValidatorsService, private userValidatorsService: UserValidatorsService, @@ -226,6 +232,13 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit { this.checkTranscodingFields() } + ngAfterViewChecked () { + if (!this.initDone) { + this.initDone = true + this.gotoAnchor() + } + } + isTranscodingEnabled () { return this.form.value['transcoding']['enabled'] === true } @@ -272,6 +285,18 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit { return this.i18n('No category') } + gotoAnchor () { + const hashToTab = { + 'customizations': 'advanced-configuration' + } + const hash = window.location.hash.replace('#', '') + + if (hash && Object.keys(hashToTab).includes(hash)) { + this.tabs.select(hashToTab[hash]) + setTimeout(() => this.viewportScroller.scrollToAnchor(hash), 100) + } + } + private updateForm () { this.form.patchValue(this.customConfig) } diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html index 164afb4ea..87296bc19 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html +++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html @@ -34,6 +34,7 @@
+
diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts index e314cdbea..ada98401c 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts +++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts @@ -1,17 +1,18 @@ -import { Component, OnInit } from '@angular/core' +import { Component, OnInit, AfterViewChecked } from '@angular/core' import { Notifier } from '@app/core' import { BytesPipe } from 'ngx-pipes' import { AuthService } from '../../core' import { User } from '../../shared' import { UserService } from '../../shared/users' import { I18n } from '@ngx-translate/i18n-polyfill' +import { ViewportScroller } from '@angular/common' @Component({ selector: 'my-account-settings', templateUrl: './my-account-settings.component.html', styleUrls: [ './my-account-settings.component.scss' ] }) -export class MyAccountSettingsComponent implements OnInit { +export class MyAccountSettingsComponent implements OnInit, AfterViewChecked { user: User = null userVideoQuota = '0' @@ -21,6 +22,7 @@ export class MyAccountSettingsComponent implements OnInit { userVideoQuotaUsedDaily = 0 constructor ( + private viewportScroller: ViewportScroller, private userService: UserService, private authService: AuthService, private notifier: Notifier, @@ -57,6 +59,10 @@ export class MyAccountSettingsComponent implements OnInit { }) } + ngAfterViewChecked () { + if (window.location.hash) this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + } + onAvatarChange (formData: FormData) { this.userService.changeAvatar(formData) .subscribe( diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss index f76a82243..89957704b 100644 --- a/client/src/sass/application.scss +++ b/client/src/sass/application.scss @@ -246,6 +246,11 @@ table { } } +.anchor { + position: relative; + top: #{-($header-height + 20px)}; +} + @media screen and (max-width: #{map-get($grid-breakpoints, xxl)}) { .main-col { &.expanded {