diff --git a/modules/components/src/components/tooltip/tooltip-container.component.ts b/modules/components/src/components/tooltip/tooltip-container.component.ts
index effd25c..b0fe67f 100644
--- a/modules/components/src/components/tooltip/tooltip-container.component.ts
+++ b/modules/components/src/components/tooltip/tooltip-container.component.ts
@@ -16,7 +16,12 @@ import { FadeInOutAnimation } from '../../animations/fade-in-out'
`,
- animations: [ FadeInOutAnimation ]
+ animations: [ FadeInOutAnimation ],
+ styles: [
+ `:host {
+ z-index: 10000;
+ }`
+ ]
})
export class TooltipContainerComponent {
@Input() scale = 1
diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index 5540a19..39f934c 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -29,5 +29,5 @@
-
+
diff --git a/ui/src/app/app.component.scss b/ui/src/app/app.component.scss
index 5cbf5a8..d63a3cc 100644
--- a/ui/src/app/app.component.scss
+++ b/ui/src/app/app.component.scss
@@ -112,3 +112,12 @@ $noise: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyA
}
+.tooltip-container {
+ position: absolute;
+ pointer-events: none;
+ transform-origin: top left;
+ z-index: 9999;
+ min-width: 400px;
+ top: 0;
+ left: 0;
+}
\ No newline at end of file
diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts
index 64ca05d..d5e2b19 100644
--- a/ui/src/app/app.component.ts
+++ b/ui/src/app/app.component.ts
@@ -53,6 +53,10 @@ export class AppComponent implements OnInit, AfterContentInit {
style.height = `${this.containerHeight / this.ui.scale}px`
style.transform = `scale(${this.ui.scale})`
+ const cdkOverlays = document.getElementsByClassName('cdk-overlay-pane')
+ for (let i = 0; i < cdkOverlays.length; i++) {
+ cdkOverlays[i].setAttribute('style', `transform: scale(${this.ui.scale.toFixed(2)}); max-width: ${Math.round(90 / this.ui.scale)}vw`)
+ }
return style
}
@@ -133,7 +137,7 @@ export class AppComponent implements OnInit, AfterContentInit {
this.ui.getSettings()
])
- if (typeof uiSettings.privacyFormSeen !== 'boolean') {
+ if (typeof uiSettings.privacyFormSeen !== 'boolean' || true) {
let doCollectTelemetry = uiSettings.doCollectTelemetry ?? false
let doCollectCrashReports = await this.settings.getDoCollectCrashReports()
let saving = false
diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts
index 00df21e..75ae38a 100644
--- a/ui/src/app/app.module.ts
+++ b/ui/src/app/app.module.ts
@@ -68,12 +68,13 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { SettingsComponent } from './sections/settings/settings.component'
import { OptionsComponent } from './components/options/options.component'
import { HelpComponent } from './sections/help/help.component'
-import { MatDialogModule } from '@angular/material/dialog'
+import { MatDialogConfig, MatDialogModule, MAT_DIALOG_DEFAULT_OPTIONS } from '@angular/material/dialog'
import { ConfirmDialogComponent } from './components/confirm-dialog/confirm-dialog.component'
import { EqualizerPresetsComponent } from './sections/effects/equalizers/presets/equalizer-presets.component'
import { PromptDialogComponent } from './components/prompt-dialog/prompt-dialog.component'
import { OptionsDialogComponent } from './components/options-dialog/options-dialog.component'
import { MatSnackBarModule } from '@angular/material/snack-bar'
+import { UIService } from './services/ui.service'
@NgModule({
imports: [
@@ -114,7 +115,17 @@ import { MatSnackBarModule } from '@angular/material/snack-bar'
PromptDialogComponent,
OptionsDialogComponent
],
- providers: [],
+ providers: [
+ {
+ provide: MAT_DIALOG_DEFAULT_OPTIONS,
+ useValue: {
+ ...new MatDialogConfig(),
+ hasBackdrop: true,
+ maxWidth: 10,
+ width: '10px'
+ } as MatDialogConfig
+ }
+ ],
bootstrap: [ AppComponent ]
})
export class AppModule {}