diff --git a/install-usercss.html b/install-usercss.html index 00e71cb8..177431cc 100644 --- a/install-usercss.html +++ b/install-usercss.html @@ -60,13 +60,15 @@
diff --git a/install-usercss/install-usercss.css b/install-usercss/install-usercss.css index f9381981..a86ef582 100644 --- a/install-usercss/install-usercss.css +++ b/install-usercss/install-usercss.css @@ -246,6 +246,18 @@ h2.installed.active { min-width: 0; } +.unavailable-message, +.unavailable .available-message, +.unavailable .svg-icon, +.live-reload.unavailable input, +.set-update-url.unavailable input { + display: none; +} + +.unavailable .unavailable-message { + display: block; +} + .set-update-url { flex-wrap: wrap; } diff --git a/install-usercss/install-usercss.js b/install-usercss/install-usercss.js index 211e4e2f..47194fce 100644 --- a/install-usercss/install-usercss.js +++ b/install-usercss/install-usercss.js @@ -16,8 +16,7 @@ let port; if (params.has('direct')) { - $('.live-reload').textContent = t('liveReloadUnavailable'); - $('.live-reload').classList.add('unavailable'); + setUnavailable('.live-reload'); getCodeDirectly(); } else { port = chrome.tabs.connect(tabId); @@ -310,15 +309,13 @@ // prefer the installation URL unless drag'n'dropped on the manage page const installationUrl = (params.get('updateUrl') || '').replace(/^blob.+/, ''); const updateUrl = new URL(installationUrl || style.updateUrl || DUMMY_URL); - $('.set-update-url > span').textContent = t('installUpdateFromLabel'); if (dup && dup.updateUrl === updateUrl.href) { checker.checked = true; // there is no way to "unset" updateUrl, you can only overwrite it. checker.disabled = true; } else if (updateUrl.href === DUMMY_URL) { // drag'n'dropped on the manage page and the style doesn't have @updateURL - $('.set-update-url').textContent = t('installUpdateUnavailable'); - $('.set-update-url').classList.add('unavailable'); + setUnavailable('.set-update-url'); return; } else if (updateUrl.protocol !== 'file:') { checker.checked = true; @@ -357,6 +354,14 @@ } } + function setUnavailable(label) { + const el = $(label); + el.classList.add('unavailable'); + const input = $('input', el); + input.disabled = true; + input.checked = false; + } + function getAppliesTo(style) { function *_gen() { for (const section of style.sections) {