diff --git a/popup.html b/popup.html
index d90375fd..b22cab7c 100644
--- a/popup.html
+++ b/popup.html
@@ -88,6 +88,7 @@
+
@@ -215,9 +216,9 @@
+
diff --git a/popup/search-results.css b/popup/search-results.css
index 0e1f4403..f77ed449 100755
--- a/popup/search-results.css
+++ b/popup/search-results.css
@@ -26,7 +26,7 @@ body.search-results-shown {
font-weight: bold;
padding: 5px;
text-align: center;
- margin: -.5rem 0 1rem;
+ margin: -.5rem 0 9px;
}
#search-results-list {
@@ -96,6 +96,17 @@ body.search-results-shown {
position: relative;
}
+.search-result[data-installed] .search-result-status {
+ top: 0;
+ left: 0;
+ right: 0;
+ line-height: 18px;
+ text-align: center;
+ position: absolute;
+ background-color: rgba(0, 128, 0, 0.76);
+ color: #fff;
+}
+
.search-result:hover .search-result-actions {
opacity: 1;
}
@@ -127,6 +138,7 @@ body.search-results-shown {
width: 100%;
line-height: 16px;
margin: 0;
+ padding-bottom: 3px;
}
.search-result:hover .search-result-meta {
diff --git a/popup/search-results.js b/popup/search-results.js
index ed6353a7..4b0b0212 100755
--- a/popup/search-results.js
+++ b/popup/search-results.js
@@ -182,6 +182,11 @@ window.addEventListener('showStyles:done', function _() {
t('searchResultNoneFound') :
t('genericErrorOccurred') + '\n' + reason;
dom.error.classList.remove('hidden');
+ dom.container.classList.toggle('hidden', !processedResults.length);
+ document.body.classList.toggle('search-results-shown', processedResults.length > 0);
+ if (dom.error.getBoundingClientRect().bottom > window.innerHeight) {
+ dom.error.scrollIntoView();
+ }
}
/**
@@ -449,9 +454,19 @@ window.addEventListener('showStyles:done', function _() {
}
function renderActionButtons(entry) {
+ const result = entry._result;
+
+ if (result.installed && !('installed' in entry.dataset)) {
+ entry.dataset.installed = '';
+ $('.search-result-status', entry).textContent = t('installButtonInstalled');
+ } else if (!result.installed && 'installed' in entry.dataset) {
+ delete entry.dataset.installed;
+ $('.search-result-status', entry).textContent = '';
+ }
+
const screenshot = $('.search-result-screenshot', entry);
- screenshot.onclick = entry._result.installed ? onUninstallClicked : onInstallClicked;
- screenshot.title = entry._result.installed ? t('deleteStyleLabel') : t('installButton');
+ screenshot.onclick = result.installed ? onUninstallClicked : onInstallClicked;
+ screenshot.title = result.installed ? t('deleteStyleLabel') : t('installButton');
const uninstallButton = $('.search-result-uninstall', entry);
uninstallButton.onclick = onUninstallClicked;
@@ -459,7 +474,6 @@ window.addEventListener('showStyles:done', function _() {
const installButton = $('.search-result-install', entry);
installButton.onclick = onInstallClicked;
- const result = entry._result;
if ((result.style_settings || []).length > 0) {
// Style has customizations
installButton.classList.add('customize');