CIT/Vmeda.Online
3
0
Fork 1
forked from EVOgeek/Vmeda.Online
Code Pull Requests Activity

MOBILE-3076 splash: Use full size splash screen

Browse Source
This commit is contained in:
Pau Ferrer Ocaña 2019-06-14 11:03:50 +02:00
parent 9c7dc76730
commit b66e87b86b
5 changed files with 18 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/img/splash.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 55 KiB

BIN
src/assets/img/splash_logo.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 16 KiB

5
src/core/login/pages/init/init.html
View File

@ -1,8 +1,5 @@
<ion-content> <ion-content>
<div class="core-bglogo"> <div class="core-bglogo">
<div class="core-logo"> <ion-spinner></ion-spinner>
<img src="assets/img/splash_logo.png"/>
<ion-spinner></ion-spinner>
</div>
</div> </div>
</ion-content> </ion-content>

38
src/core/login/pages/init/init.scss
View File

@ -1,34 +1,30 @@
$core-splash-bgsize: 100vmax !default;
$core-splash-spinner-color: $core-init-screen-spinner-color !default;
$core-splash-bgcolor: $core-color-init-screen !default;
ion-app.app-root page-core-login-init { ion-app.app-root page-core-login-init {
.scroll-content { .scroll-content {
background-color: $core-color-init-screen; /* Change this to add a bg image or change color */ background: $core-splash-bgcolor; /* Change this to add a bg image or change color */
background: -webkit-radial-gradient($core-color-init-screen-alt, $core-color-init-screen); overflow: hidden;
background: radial-gradient($core-color-init-screen-alt, $core-color-init-screen);
background-repeat: no-repeat;
background-position: center center;
}
.core-bglogo {
position: absolute; position: absolute;
@include position(0, 0, 0, 0); @include position(0, 0, 0, 0);
height: 100%; height: 100%;
width: 100%; width: 100%;
display: table; display: table;
}
.core-bglogo {
display: table-cell;
text-align: center;
vertical-align: middle;
.core-logo { background-image: url('/assets/img/splash.png');
display: table-cell; background-repeat: no-repeat;
text-align: center; background-size: 100%;
vertical-align: middle; background-size: $core-splash-bgsize;
} background-position: center;
img {
width: $core-init-screen-logo-width;
max-width: $core-init-screen-logo-max-width;
display: block;
margin: 0 auto;
margin-bottom: 30px;
}
.spinner circle, .spinner line { .spinner circle, .spinner line {
stroke: $core-init-screen-spinner-color; stroke: $core-splash-spinner-color;
} }
} }
} }

3
src/theme/variables.scss
View File

@ -133,10 +133,7 @@ $core-star-color: $core-color !default;
// Init screen. // Init screen.
$core-color-init-screen: #ffffff !default; $core-color-init-screen: #ffffff !default;
$core-color-init-screen-alt: #ffffff !default;
$core-init-screen-spinner-color: $core-color !default; $core-init-screen-spinner-color: $core-color !default;
$core-init-screen-logo-width: 60% !default;
$core-init-screen-logo-max-width: 300px !default;
$core-fixed-url: false !default; $core-fixed-url: false !default;