From 30de4e4dfccfde6e8fffce40fb7c1e47b06dc3be Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 17 Dec 2018 21:32:27 +0100 Subject: [Glitch] Minor scrollable list fixes * Make sure loading indicator has enough vertical space * Respect reduce_motion setting for loading indicator Port 4ede51743e5b9121a49e9131f91cf012fab410f8 to glitch-soc --- .../flavours/glitch/styles/components/index.scss | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) (limited to 'app/javascript/flavours/glitch/styles') diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index 873dfa98d..8e90aa545 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -606,6 +606,7 @@ &__append { flex: 1 1 auto; position: relative; + min-height: 120px; } } @@ -992,7 +993,6 @@ transform: translateX(-50%); margin: 82px 0 0 50%; white-space: nowrap; - animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.610, 0.355, 1.000); } } @@ -1001,11 +1001,20 @@ top: 50%; left: 50%; transform: translate(-50%, -50%); - width: 0; - height: 0; + width: 42px; + height: 42px; box-sizing: border-box; + background-color: transparent; border: 0 solid lighten($ui-base-color, 26%); + border-width: 6px; border-radius: 50%; +} + +.no-reduce-motion .loading-indicator span { + animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.610, 0.355, 1.000); +} + +.no-reduce-motion .loading-indicator__figure { animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.610, 0.355, 1.000); } -- cgit