diff --git a/src/routes/Addons/styles.less b/src/routes/Addons/styles.less index 11d139dad..315baef0c 100644 --- a/src/routes/Addons/styles.less +++ b/src/routes/Addons/styles.less @@ -103,6 +103,7 @@ .placeholder { display: flex; + flex-direction: row; position: relative; z-index: 0; width: var(--addon-width); @@ -175,7 +176,7 @@ width: 500%; margin-left: -250%; animation: placeholderAnimation 1s linear infinite; - background: linear-gradient(to right, rgba(255, 255, 255, 0) 46%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 54%) 50% 50%; + background: linear-gradient(to right, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 58%); } @keyframes placeholderAnimation { diff --git a/src/routes/Board/styles.less b/src/routes/Board/styles.less index 92174354b..2b65afd6e 100644 --- a/src/routes/Board/styles.less +++ b/src/routes/Board/styles.less @@ -48,7 +48,9 @@ .placeholder { flex: 1; margin: 1em; + padding: 0.4em; position: relative; + z-index: 0; overflow: hidden; background-color: var(--color-backgroundlighter); @@ -78,10 +80,10 @@ right: 0; bottom: 0; left: 50%; - width: 600%; - margin-left: -300%; - animation: placeholderAnimation 0.8s linear infinite; - background: linear-gradient(to right, rgba(255, 255, 255, 0) 42%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 58%) 50% 50%; + width: 800%; + margin-left: -400%; + animation: placeholderAnimation 1s linear infinite; + background: linear-gradient(to right, rgba(255, 255, 255, 0) 44%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 56%); } @keyframes placeholderAnimation { @@ -94,7 +96,7 @@ } } - &:nth-child(n+8) { + &:nth-child(n+7) { display: none; } } diff --git a/src/routes/Detail/StreamsList/StreamsList.js b/src/routes/Detail/StreamsList/StreamsList.js index dee270eb7..a70faa00b 100644 --- a/src/routes/Detail/StreamsList/StreamsList.js +++ b/src/routes/Detail/StreamsList/StreamsList.js @@ -9,9 +9,8 @@ const renderStreamPlaceholders = () => { for (let placeholderNumber = 0; placeholderNumber < 20; placeholderNumber++) { streamPlaceholders.push(