diff --git a/src/app/organizations/manage/manage.component.html b/src/app/organizations/manage/manage.component.html index c54f1a117f..49b87986de 100644 --- a/src/app/organizations/manage/manage.component.html +++ b/src/app/organizations/manage/manage.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src/app/organizations/manage/manage.component.ts b/src/app/organizations/manage/manage.component.ts index c6042bfbb3..2cfe7ba94c 100644 --- a/src/app/organizations/manage/manage.component.ts +++ b/src/app/organizations/manage/manage.component.ts @@ -5,6 +5,7 @@ import { import { ActivatedRoute } from '@angular/router'; import { UserService } from 'jslib/abstractions/user.service'; +import { StorageService } from 'jslib/abstractions/storage.service'; import { Organization } from 'jslib/models/domain/organization'; @@ -17,11 +18,13 @@ export class ManageComponent implements OnInit { accessPolicies = false; accessGroups = false; accessEvents = false; + scaleUIWidth: boolean = false; - constructor(private route: ActivatedRoute, private userService: UserService) { } + constructor(private route: ActivatedRoute, private userService: UserService, private storageService: StorageService) { } ngOnInit() { this.route.parent.params.subscribe(async (params) => { + this.scaleUIWidth = await this.storageService.get('enableUIScaling'); this.organization = await this.userService.getOrganization(params.organizationId); this.accessPolicies = this.organization.usePolicies; this.accessEvents = this.organization.useEvents; diff --git a/src/app/organizations/settings/settings.component.html b/src/app/organizations/settings/settings.component.html index 2dac5ac185..e7cce8e587 100644 --- a/src/app/organizations/settings/settings.component.html +++ b/src/app/organizations/settings/settings.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src/app/organizations/settings/settings.component.ts b/src/app/organizations/settings/settings.component.ts index c2db836085..ff5441e32f 100644 --- a/src/app/organizations/settings/settings.component.ts +++ b/src/app/organizations/settings/settings.component.ts @@ -3,6 +3,7 @@ import { ActivatedRoute } from '@angular/router'; import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service'; import { UserService } from 'jslib/abstractions/user.service'; +import { StorageService } from 'jslib/abstractions/storage.service'; @Component({ selector: 'app-org-settings', @@ -11,12 +12,14 @@ import { UserService } from 'jslib/abstractions/user.service'; export class SettingsComponent { access2fa = false; selfHosted: boolean; + scaleUIWidth: boolean = false; constructor(private route: ActivatedRoute, private userService: UserService, - private platformUtilsService: PlatformUtilsService) { } + private platformUtilsService: PlatformUtilsService, private storageService: StorageService) { } ngOnInit() { this.route.parent.params.subscribe(async (params) => { + this.scaleUIWidth = await this.storageService.get('enableUIScaling'); this.selfHosted = await this.platformUtilsService.isSelfHost(); const organization = await this.userService.getOrganization(params.organizationId); this.access2fa = organization.use2fa; diff --git a/src/app/organizations/tools/tools.component.html b/src/app/organizations/tools/tools.component.html index 0ffb712568..1f24beaa67 100644 --- a/src/app/organizations/tools/tools.component.html +++ b/src/app/organizations/tools/tools.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src/app/organizations/tools/tools.component.ts b/src/app/organizations/tools/tools.component.ts index 4df7d2523b..a31fed0c0f 100644 --- a/src/app/organizations/tools/tools.component.ts +++ b/src/app/organizations/tools/tools.component.ts @@ -5,6 +5,7 @@ import { Organization } from 'jslib/models/domain/organization'; import { MessagingService } from 'jslib/abstractions/messaging.service'; import { UserService } from 'jslib/abstractions/user.service'; +import { StorageService } from 'jslib/abstractions/storage.service'; @Component({ selector: 'app-org-tools', @@ -13,12 +14,14 @@ import { UserService } from 'jslib/abstractions/user.service'; export class ToolsComponent { organization: Organization; accessReports = false; + scaleUIWidth: boolean = false; constructor(private route: ActivatedRoute, private userService: UserService, - private messagingService: MessagingService) { } + private messagingService: MessagingService, private storageService: StorageService) { } ngOnInit() { this.route.parent.params.subscribe(async (params) => { + this.scaleUIWidth = await this.storageService.get('enableUIScaling'); this.organization = await this.userService.getOrganization(params.organizationId); // TODO: Maybe we want to just make sure they are not on a free plan? Just compare useTotp for now // since all paid plans include useTotp diff --git a/src/app/organizations/vault/vault.component.html b/src/app/organizations/vault/vault.component.html index 3f836dee51..a54060e95f 100644 --- a/src/app/organizations/vault/vault.component.html +++ b/src/app/organizations/vault/vault.component.html @@ -1,4 +1,4 @@ -
+
{ + this.scaleUIWidth = await this.storageService.get('enableUIScaling'); this.organization = await this.userService.getOrganization(params.organizationId); this.groupingsComponent.organization = this.organization; this.ciphersComponent.organization = this.organization; diff --git a/src/app/settings/options.component.ts b/src/app/settings/options.component.ts index 4d78395849..87f6ec6fb2 100644 --- a/src/app/settings/options.component.ts +++ b/src/app/settings/options.component.ts @@ -25,6 +25,7 @@ export class OptionsComponent implements OnInit { vaultTimeoutAction: string = 'lock'; disableIcons: boolean; enableGravatars: boolean; + enableUIScaling: boolean; locale: string; vaultTimeouts: any[]; localeOptions: any[]; @@ -66,6 +67,7 @@ export class OptionsComponent implements OnInit { this.vaultTimeoutAction = await this.storageService.get(ConstantsService.vaultTimeoutActionKey); this.disableIcons = await this.storageService.get(ConstantsService.disableFaviconKey); this.enableGravatars = await this.storageService.get('enableGravatars'); + this.enableUIScaling = await this.storageService.get('enableUIScaling'); this.locale = this.startingLocale = await this.storageService.get(ConstantsService.localeKey); } @@ -76,6 +78,8 @@ export class OptionsComponent implements OnInit { await this.stateService.save(ConstantsService.disableFaviconKey, this.disableIcons); await this.storageService.save('enableGravatars', this.enableGravatars); await this.stateService.save('enableGravatars', this.enableGravatars); + await this.storageService.save('enableUIScaling', this.enableUIScaling); + await this.stateService.save('enableUIScaling', this.enableUIScaling); await this.storageService.save(ConstantsService.localeKey, this.locale); this.analytics.eventTrack.next({ action: 'Saved Options' }); if (this.locale !== this.startingLocale) { diff --git a/src/app/settings/settings.component.html b/src/app/settings/settings.component.html index 2ed3911852..a20066853a 100644 --- a/src/app/settings/settings.component.html +++ b/src/app/settings/settings.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src/app/settings/settings.component.ts b/src/app/settings/settings.component.ts index 083c538bc7..cf79e8d78e 100644 --- a/src/app/settings/settings.component.ts +++ b/src/app/settings/settings.component.ts @@ -9,6 +9,7 @@ import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service'; import { TokenService } from 'jslib/abstractions/token.service'; import { BroadcasterService } from 'jslib/angular/services/broadcaster.service'; +import { StorageService } from 'jslib/abstractions/storage.service'; const BroadcasterSubscriptionId = 'SettingsComponent'; @@ -19,11 +20,13 @@ const BroadcasterSubscriptionId = 'SettingsComponent'; export class SettingsComponent implements OnInit, OnDestroy { premium: boolean; selfHosted: boolean; + scaleUIWidth: boolean = false; constructor(private tokenService: TokenService, private broadcasterService: BroadcasterService, - private ngZone: NgZone, private platformUtilsService: PlatformUtilsService) { } + private ngZone: NgZone, private platformUtilsService: PlatformUtilsService, private storageService: StorageService) { } async ngOnInit() { + this.scaleUIWidth = await this.storageService.get('enableUIScaling'); this.broadcasterService.subscribe(BroadcasterSubscriptionId, async (message: any) => { this.ngZone.run(async () => { switch (message.command) { diff --git a/src/app/tools/tools.component.html b/src/app/tools/tools.component.html index 69c6263efd..841c14a92f 100644 --- a/src/app/tools/tools.component.html +++ b/src/app/tools/tools.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src/app/tools/tools.component.ts b/src/app/tools/tools.component.ts index f9ecdbe7a1..3665a60bbf 100644 --- a/src/app/tools/tools.component.ts +++ b/src/app/tools/tools.component.ts @@ -5,6 +5,7 @@ import { import { MessagingService } from 'jslib/abstractions/messaging.service'; import { UserService } from 'jslib/abstractions/user.service'; +import { StorageService } from 'jslib/abstractions/storage.service'; @Component({ selector: 'app-tools', @@ -12,10 +13,12 @@ import { UserService } from 'jslib/abstractions/user.service'; }) export class ToolsComponent implements OnInit { canAccessPremium = false; + scaleUIWidth: boolean = false; - constructor(private userService: UserService, private messagingService: MessagingService) { } + constructor(private userService: UserService, private messagingService: MessagingService, private storageService: StorageService) { } async ngOnInit() { + this.scaleUIWidth = await this.storageService.get('enableUIScaling'); this.canAccessPremium = await this.userService.canAccessPremium(); } diff --git a/src/app/vault/vault.component.html b/src/app/vault/vault.component.html index 3b5ace702e..27b1d47cd2 100644 --- a/src/app/vault/vault.component.html +++ b/src/app/vault/vault.component.html @@ -1,4 +1,4 @@ -
+
('enableUIScaling'); this.showVerifyEmail = !(await this.tokenService.getEmailVerified()); this.showBrowserOutdated = window.navigator.userAgent.indexOf('MSIE') !== -1; diff --git a/src/services/htmlStorage.service.ts b/src/services/htmlStorage.service.ts index 041463e14c..bff1a7dcef 100644 --- a/src/services/htmlStorage.service.ts +++ b/src/services/htmlStorage.service.ts @@ -4,7 +4,7 @@ import { ConstantsService } from 'jslib/services'; export class HtmlStorageService implements StorageService { private localStorageKeys = new Set(['appId', 'anonymousAppId', 'rememberedEmail', 'passwordGenerationOptions', - ConstantsService.disableFaviconKey, 'rememberEmail', 'enableGravatars', ConstantsService.localeKey, + ConstantsService.disableFaviconKey, 'rememberEmail', 'enableGravatars', 'enableUIScaling', ConstantsService.localeKey, ConstantsService.autoConfirmFingerprints, ConstantsService.vaultTimeoutKey, ConstantsService.vaultTimeoutActionKey]); private localStorageStartsWithKeys = ['twoFactorToken_', ConstantsService.collapsedGroupingsKey + '_'];