diff --git a/popup/search.css b/popup/search.css index 643d4d7f..4ab1f0b8 100644 --- a/popup/search.css +++ b/popup/search.css @@ -229,6 +229,28 @@ search-result-meta [data-type="rating"][data-class="none"] dd { cursor: help; } +[data-error], +[data-error]:hover { + border: calc(var(--pad) / 2) solid red; + border-radius: var(--pad); + padding: calc(var(--pad) / 2); + background: hsl(0, 90%, 85%); +} +[data-error]::after { + content: attr(data-error); + display: block; + color: hsl(0, 100%, 8%); + font-weight: bold; + padding-top: var(--pad); + hyphens: auto; +} +[data-error] .search-result-description { + display: none; +} +[data-error] .search-result-meta { + background: hsla(0, 100%, 90%, .80); +} + .search-results-nav { flex-direction: row; text-align: center; diff --git a/popup/search.js b/popup/search.js index 13e727e0..4842c69d 100644 --- a/popup/search.js +++ b/popup/search.js @@ -421,6 +421,7 @@ saveScrollPosition(entry); installButton.disabled = true; entry.style.setProperty('pointer-events', 'none', 'important'); + delete entry.dataset.error; if (!isUsw) { // FIXME: move this to background page and create an API like installUSOStyle result.pingbackTimer = setTimeout(download, PINGBACK_DELAY, @@ -434,7 +435,8 @@ const style = await API.usercss.install({sourceCode, updateUrl}); renderFullInfo(entry, style); } catch (reason) { - error(`Error while downloading usoID:${id}\nReason: ${reason}`); + entry.dataset.error = `${t('genericError')}: ${reason}`; + entry.scrollIntoView({behavior: 'smooth', block: 'nearest'}); } $remove('.lds-spinner', entry); installButton.disabled = false;