Skip to content

UI Remove changing backgrounds on Login page

Victor Tomaili edited this page May 3, 2021 · 1 revision

Basic Building Blocks Series: Within the basic building blocks series over time I will add all the little things which someone who just starts with Serenity Framework would have to spend a lot of time figuring it out him/herself.

What you get with this article:

You will have a "clean" login panel without the nice - but for real business apps mostly unproductive and in Terminal server environments with slow WAN links even really disturbing (because blocking) - backgrounds.

Like this:

clean-loginpanel

To remove the changing backgrounds, open /Modules/Membership/Account/AccountLogin.cshtml and remove the codeblock below.

In SF Version 3.7.7.0 this looks like this:

            $('body').vegas({
                delay: 30000,
                cover: true,
                overlay: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACAQMAAABIeJ9nAAAAA3NCSVQICAjb4U" +
                    "/gAAAABlBMVEX///8AAABVwtN+AAAAAnRSTlMA/1uRIrUAAAAJcEhZcwAAAsQAAALEAVuRnQsAAAAWdEVYdENyZWF0" +
                    "aW9uIFRpbWUAMDQvMTMvMTGrW0T6AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M1cbXjNgAAAAxJREFUCJljaGBgAAABhACBrONIPgAAAABJRU5ErkJggg==",
                slides: [
                    { src: @Html.Raw(ContentHashCache.ResolveWithHash("~/Content/site/slides/slide1.jpg").ToJson()), transition: 'fade' },
                    { src: @Html.Raw(ContentHashCache.ResolveWithHash("~/Content/site/slides/slide2.jpg").ToJson()), transition: 'zoomOut' },
                    { src: @Html.Raw(ContentHashCache.ResolveWithHash("~/Content/site/slides/slide3.jpg").ToJson()), transition: 'swirlLeft' }
                ]
            });

In older versions, this is under Modules/Membership/account/LoginPanel.ts.

In SF Version 2.9.25.1 this looks like this:

            $(function () {
                ($('body') as any).vegas({
                    delay: 10000,
                    cover: true,
                    overlay: Q.resolveUrl("~/Scripts/vegas/overlays/01.png"),
                    slides: [
                        { src: Q.resolveUrl('~/Content/site/slides/slide1.jpg'), transition: 'fade' },
                        { src: Q.resolveUrl('~/Content/site/slides/slide2.jpg'), transition: 'fade' },
                        { src: Q.resolveUrl('~/Content/site/slides/slide3.jpg'), transition: 'zoomOut' },
                        { src: Q.resolveUrl('~/Content/site/slides/slide4.jpg'), transition: 'blur' },
                        { src: Q.resolveUrl('~/Content/site/slides/slide5.jpg'), transition: 'swirlLeft' }
                    ]
                });
            });

In order to delete the pictures out ouf your project, delete the following files: /Content/site/slides/slide*.jpg

Clone this wiki locally