aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorKim <1877318+kimsible@users.noreply.github.com>2020-05-01 20:05:19 +0200
committerGitHub <noreply@github.com>2020-05-01 20:05:19 +0200
commitca4b1594a77d1a31188dde1e5f6f7a900cd29118 (patch)
tree3adce1ae531b66998d71f3ba0bf9db6ac0108108 /client
parentd1261d9a3cef6d3df408c9dce977100ac196f9f8 (diff)
downloadPeerTube-ca4b1594a77d1a31188dde1e5f6f7a900cd29118.tar.gz
PeerTube-ca4b1594a77d1a31188dde1e5f6f7a900cd29118.tar.zst
PeerTube-ca4b1594a77d1a31188dde1e5f6f7a900cd29118.zip
Fix dropdown-user placement and menu-left scroll on touchscreens (#2706)
Diffstat (limited to 'client')
-rw-r--r--client/src/app/menu/menu.component.html2
-rw-r--r--client/src/app/menu/menu.component.scss4
-rw-r--r--client/src/app/menu/menu.component.ts16
3 files changed, 20 insertions, 2 deletions
diff --git a/client/src/app/menu/menu.component.html b/client/src/app/menu/menu.component.html
index 32e48d6b6..1cb51ef55 100644
--- a/client/src/app/menu/menu.component.html
+++ b/client/src/app/menu/menu.component.html
@@ -11,7 +11,7 @@
11 <div class="logged-in-username">{{ user.username }}</div> 11 <div class="logged-in-username">{{ user.username }}</div>
12 </div> 12 </div>
13 13
14 <div class="logged-in-more" ngbDropdown placement="right-top auto" container="body" autoClose="outside"> 14 <div class="logged-in-more" ngbDropdown [placement]="placement" container="body" autoClose="outside">
15 <my-global-icon iconName="more-vertical" ngbDropdownToggle role="button"></my-global-icon> 15 <my-global-icon iconName="more-vertical" ngbDropdownToggle role="button"></my-global-icon>
16 16
17 <div ngbDropdownMenu> 17 <div ngbDropdownMenu>
diff --git a/client/src/app/menu/menu.component.scss b/client/src/app/menu/menu.component.scss
index 9ae40493d..5bff0c328 100644
--- a/client/src/app/menu/menu.component.scss
+++ b/client/src/app/menu/menu.component.scss
@@ -27,6 +27,10 @@ menu {
27 overflow-y: auto; 27 overflow-y: auto;
28 } 28 }
29 29
30 @media not all and (hover: hover) and (pointer: fine) {
31 overflow-y: auto;
32 }
33
30 &.logged-in { 34 &.logged-in {
31 .panel-block { 35 .panel-block {
32 margin-bottom: 20px; 36 margin-bottom: 20px;
diff --git a/client/src/app/menu/menu.component.ts b/client/src/app/menu/menu.component.ts
index 75bae090e..015c14bce 100644
--- a/client/src/app/menu/menu.component.ts
+++ b/client/src/app/menu/menu.component.ts
@@ -8,6 +8,7 @@ import { HotkeysService } from 'angular2-hotkeys'
8import { ServerConfig, VideoConstant } from '@shared/models' 8import { ServerConfig, VideoConstant } from '@shared/models'
9import { QuickSettingsModalComponent } from '@app/modal/quick-settings-modal.component' 9import { QuickSettingsModalComponent } from '@app/modal/quick-settings-modal.component'
10import { I18n } from '@ngx-translate/i18n-polyfill' 10import { I18n } from '@ngx-translate/i18n-polyfill'
11import { ScreenService } from '@app/shared/misc/screen.service'
11 12
12@Component({ 13@Component({
13 selector: 'my-menu', 14 selector: 'my-menu',
@@ -43,8 +44,21 @@ export class MenuComponent implements OnInit {
43 private serverService: ServerService, 44 private serverService: ServerService,
44 private redirectService: RedirectService, 45 private redirectService: RedirectService,
45 private hotkeysService: HotkeysService, 46 private hotkeysService: HotkeysService,
47 private screenService: ScreenService,
46 private i18n: I18n 48 private i18n: I18n
47 ) {} 49 ) { }
50
51 get isInMobileView () {
52 return this.screenService.isInMobileView()
53 }
54
55 get placement () {
56 if (this.isInMobileView) {
57 return 'left-top auto'
58 } else {
59 return 'right-top auto'
60 }
61 }
48 62
49 ngOnInit () { 63 ngOnInit () {
50 this.serverConfig = this.serverService.getTmpConfig() 64 this.serverConfig = this.serverService.getTmpConfig()