diff --git a/index.html b/index.html
index b33764958a..ffd86b972f 100644
--- a/index.html
+++ b/index.html
@@ -33,13 +33,18 @@
mct.run();
});
+
-
-
+
+
+
diff --git a/platform/commonUI/general/res/sass/_about.scss b/platform/commonUI/general/res/sass/_about.scss
index 978ea42078..38c4c59b61 100644
--- a/platform/commonUI/general/res/sass/_about.scss
+++ b/platform/commonUI/general/res/sass/_about.scss
@@ -21,63 +21,30 @@
*****************************************************************************/
// General About dialog styling
+@import "logo-and-bg";
+
.l-about {
- // Layout
&.abs {
-// top: 20px;
overflow: auto;
}
$contentH: 200px;
.l-logo-holder {
position: relative;
height: 45%;
- .l-logo {
- $w: 5%;
- position: absolute;
- &.l-logo-app {
-// @include test(blue);
- top: 0; right: 15%; bottom: 0; left: 15%;
- }
- &.s-logo-nasa {
-// @include test(red);
- $m: 10px;
- background-image: url($dirImgs + 'logo-nasa.svg');
- top: $m; right: auto; bottom: auto; left: $m;
- width: $w * 2; height: auto; padding-bottom: $w; padding-top: $w;
- }
- }
}
.l-content {
-// @include test();
position: relative;
margin-top: $interiorMarginLg;
}
}
.s-about {
- // Styling
line-height: 120%;
a {
color: $colorAboutLink;
}
.s-description,
- .s-info {
-// font-size: 0.8em;
- }
- .s-logo-holder {
- background: url($dirImgs + "bg-about-openmctweb.jpg") no-repeat center; // For OpenMCT Web.
- background-size: cover;
- }
- .s-logo {
- // @include txtShdwLarge(); // text-shadow doesn't work for svg
- background-position: center;
- background-repeat: no-repeat;
- background-size: contain;
- }
- .s-logo-openmctweb {
- background-image: url($dirImgs + 'logo-openmctweb-shdw.svg');
- }
.s-btn {
line-height: 2em;
}
@@ -90,10 +57,6 @@
}
em {
color: pushBack($colorBodyFg, 20%);
-// margin-left: 2em;
- &:first-child {
-// margin-left: 0;
- }
}
h3 {
font-size: 1.25em;
diff --git a/platform/commonUI/general/res/sass/_logo-and-bg.scss b/platform/commonUI/general/res/sass/_logo-and-bg.scss
new file mode 100644
index 0000000000..cb1e033919
--- /dev/null
+++ b/platform/commonUI/general/res/sass/_logo-and-bg.scss
@@ -0,0 +1,30 @@
+.l-logo-holder {
+ position: absolute;
+ top: 0; right: 0; bottom: 0; left: 0;
+ .l-logo {
+ $w: 5%;
+ position: absolute;
+ &.l-logo-app {
+ top: 0; right: 15%; bottom: 0; left: 15%;
+ }
+ &.s-logo-nasa {
+ $m: 10px;
+ background-image: url($dirImgs + 'logo-nasa.svg');
+ top: $m; right: auto; bottom: auto; left: $m;
+ width: $w * 2; height: auto; padding-bottom: $w; padding-top: $w;
+ }
+ }
+}
+
+.s-logo-holder {
+ background: url($dirImgs + "bg-about-openmctweb.jpg") no-repeat center; // For OpenMCT Web.
+ background-size: cover;
+}
+.s-logo {
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: contain;
+}
+.s-logo-openmctweb {
+ background-image: url($dirImgs + 'logo-openmctweb-shdw.svg');
+}
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/startup.scss b/platform/commonUI/general/res/sass/startup.scss
new file mode 100644
index 0000000000..4784926b20
--- /dev/null
+++ b/platform/commonUI/general/res/sass/startup.scss
@@ -0,0 +1,26 @@
+@import "compass";
+@import "compass/css3";
+@import "constants";
+$dirImgs: '../../../general/res/images/';
+@import "logo-and-bg";
+
+body {
+ background: black;
+}
+
+.s-logo-holder {
+ @include transition-property(opacity);
+ @include transition-duration(500ms);
+ @include transition-timing-function(ease-in-out);
+ background-image: url($dirImgs + "bg-about-openmctweb.jpg") no-repeat center; // For OpenMCT Web.
+ z-index: 1000;
+ opacity: 1;
+ &.fadeout {
+ opacity: 0;
+ pointer-events: none;
+ }
+}
+
+.s-logo-openmctweb {
+ background-image: url($dirImgs + 'logo-openmctweb-shdw.svg');
+}