From 275933e22476f600a0a28d93c01becad76bb5933 Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Wed, 9 Aug 2017 13:14:59 +1000 Subject: [PATCH 1/7] Temporarily disable hiding the loading animation So it's easier to inspect its state. --- src/main/window-manager.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/main/window-manager.js b/src/main/window-manager.js index 261b089ce18..e82b5bd656b 100644 --- a/src/main/window-manager.js +++ b/src/main/window-manager.js @@ -147,13 +147,13 @@ var createWindow = module.exports.create = function(opts) { ipc.respondTo('window:renderer-ready', () => { if (_loading) { - if (_loading.isFullScreen()) { - _window.setFullScreen(true); - } - _loading.hide(); - _loading.close(); - _loading = null; - _window.show(); + // if (_loading.isFullScreen()) { + // _window.setFullScreen(true); + // } + // _loading.hide(); + // _loading.close(); + // _loading = null; + // _window.show(); } }); From 76d430d1a7c404cd1fc0f43923d68049a07d2a0a Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Wed, 9 Aug 2017 13:15:35 +1000 Subject: [PATCH 2/7] Remove default 8px margin --- src/app/loading/style.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/app/loading/style.css b/src/app/loading/style.css index e62b505d660..2b063a02cad 100644 --- a/src/app/loading/style.css +++ b/src/app/loading/style.css @@ -15,6 +15,7 @@ html, body { color: #333; font-weight: bold; -webkit-font-smoothing: antialiased; + margin: 0; position: relative; } From 797f194d296fcfe3f70a23497a56ee5389e0841b Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Wed, 9 Aug 2017 13:27:02 +1000 Subject: [PATCH 3/7] Use standard top/left pattern from .sq CSS class --- src/app/loading/style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/loading/style.css b/src/app/loading/style.css index 2b063a02cad..96620160fee 100644 --- a/src/app/loading/style.css +++ b/src/app/loading/style.css @@ -61,8 +61,8 @@ html, body { span { position: absolute; top: 50%; - width: 100%; - padding-left: 6px; + left: 50%; + margin-left: -26px; text-align: center; font-size: 11px; line-height: 1; From 5bef663af237573ae330b0482c2047beb92cd90f Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Thu, 10 Aug 2017 12:04:29 +1000 Subject: [PATCH 4/7] Go back to width: 100% removing margin/padding No flexbox needed in this context. --- src/app/loading/style.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/app/loading/style.css b/src/app/loading/style.css index 96620160fee..877d102cce5 100644 --- a/src/app/loading/style.css +++ b/src/app/loading/style.css @@ -61,12 +61,11 @@ html, body { span { position: absolute; top: 50%; - left: 50%; - margin-left: -26px; text-align: center; font-size: 11px; line-height: 1; text-transform: uppercase; text-align: center; -moz-osx-font-smoothing: grayscale; + width: 100%; } From a070569cfb809993825a30530b6d23195668d566 Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Thu, 10 Aug 2017 12:05:58 +1000 Subject: [PATCH 5/7] Remove duplicate text-align --- src/app/loading/style.css | 1 - 1 file changed, 1 deletion(-) diff --git a/src/app/loading/style.css b/src/app/loading/style.css index 877d102cce5..24faba1a01c 100644 --- a/src/app/loading/style.css +++ b/src/app/loading/style.css @@ -65,7 +65,6 @@ span { font-size: 11px; line-height: 1; text-transform: uppercase; - text-align: center; -moz-osx-font-smoothing: grayscale; width: 100%; } From 8455762e10d46f0a179cb37a5eb5a7bb06266cac Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Thu, 10 Aug 2017 13:12:24 +1000 Subject: [PATCH 6/7] Abstract towards a reusable loading animation component CSS animation appears to be special enough I don't know how to handle it in this context, perhaps it needs another wrapper? --- src/app/loading/loading.html | 8 +++++--- src/app/loading/style.css | 16 +++++++++------- 2 files changed, 14 insertions(+), 10 deletions(-) diff --git a/src/app/loading/loading.html b/src/app/loading/loading.html index fb2b7e3a75e..47dc3f3473d 100644 --- a/src/app/loading/loading.html +++ b/src/app/loading/loading.html @@ -4,8 +4,10 @@ -
-
- loading… +
+
+
+ loading… +
diff --git a/src/app/loading/style.css b/src/app/loading/style.css index 24faba1a01c..dfb5269da0f 100644 --- a/src/app/loading/style.css +++ b/src/app/loading/style.css @@ -9,8 +9,6 @@ } html, body { - height: 100%; - width: 100%; font-family: "Akzidenz", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #333; font-weight: bold; @@ -19,13 +17,20 @@ html, body { position: relative; } +.loading-animation { + align-items: center; + display: flex; + height: 100vh; + justify-content: center; + width: 100vw; +} + .sq { background: #43B1E5; position: absolute; - top: 50%; - left: 50%; height: 12px; width: 12px; + /* So animation does not overlap with loading text */ margin-top: -36px; } @@ -59,12 +64,9 @@ html, body { } span { - position: absolute; - top: 50%; text-align: center; font-size: 11px; line-height: 1; text-transform: uppercase; - -moz-osx-font-smoothing: grayscale; width: 100%; } From dbc568df69ef413f8610b0b9cf881e7465048d81 Mon Sep 17 00:00:00 2001 From: Peter Schmidt Date: Wed, 9 Aug 2017 13:30:26 +1000 Subject: [PATCH 7/7] Revert "Temporarily disable hiding the loading animation" --- src/main/window-manager.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/main/window-manager.js b/src/main/window-manager.js index e82b5bd656b..261b089ce18 100644 --- a/src/main/window-manager.js +++ b/src/main/window-manager.js @@ -147,13 +147,13 @@ var createWindow = module.exports.create = function(opts) { ipc.respondTo('window:renderer-ready', () => { if (_loading) { - // if (_loading.isFullScreen()) { - // _window.setFullScreen(true); - // } - // _loading.hide(); - // _loading.close(); - // _loading = null; - // _window.show(); + if (_loading.isFullScreen()) { + _window.setFullScreen(true); + } + _loading.hide(); + _loading.close(); + _loading = null; + _window.show(); } });