diff --git a/apps/fxc-front/src/app/components/loader-element.ts b/apps/fxc-front/src/app/components/loader-element.ts index 0c0371af..0bbc2b4c 100644 --- a/apps/fxc-front/src/app/components/loader-element.ts +++ b/apps/fxc-front/src/app/components/loader-element.ts @@ -1,44 +1,32 @@ import type { CSSResult, PropertyValues, TemplateResult } from 'lit'; import { css, html, LitElement } from 'lit'; -import { customElement, property, state } from 'lit/decorators.js'; -import { connect } from 'pwa-helpers'; - -import type { RootState } from '../redux/store'; -import { store } from '../redux/store'; +import { customElement, property } from 'lit/decorators.js'; @customElement('loader-element') -export class LoaderElement extends connect(store)(LitElement) { +export class LoaderElement extends LitElement { @property() show = true; - @state() - showSponsor = true; - - stateChanged(state: RootState): void { - this.showSponsor = !state.browser.isFromFfvl; - } - static get styles(): CSSResult { return css` :host { - position: absolute; + display: block; + position: fixed; top: 0; left: 0; - width: 100%; - height: 100%; + width: 100vw; + height: 100vh; } - #bkg { - background-color: #222; - opacity: 0.99; - width: 100%; - height: 100%; - display: flex; - align-items: center; - justify-content: center; + .full-screen { + position: fixed; + display: grid; + place-items: center; + width: 100vw; + height: 100vh; } - #bat { - width: 1024px; - max-width: 90%; + #logo { + width: 90%; + max-width: 1000px; } `; } @@ -51,38 +39,170 @@ export class LoaderElement extends connect(store)(LitElement) { protected render(): TemplateResult { return html` -
- - + + + + + + - - - - - - - - - - - - - + + + + + + - - + + - + + + + + + + + + + + + + + + + + + + +
+
`;