diff --git a/src/action/links.css b/src/action/links.css
index 3a56ba66b..1122f5865 100644
--- a/src/action/links.css
+++ b/src/action/links.css
@@ -1,7 +1,5 @@
#links {
position: relative;
-
- margin: 1em 0;
padding: 0 1em;
}
diff --git a/src/action/popup.css b/src/action/popup.css
index 026877d97..4a6eb654e 100644
--- a/src/action/popup.css
+++ b/src/action/popup.css
@@ -5,15 +5,12 @@
--in-content-primary-button-background: #0061e0;
--in-content-primary-button-background-hover: #0250bb;
--in-content-primary-button-background-active: #053e94;
- --in-content-box-info-background: #f0f0f4;
--black: 21, 20, 25;
--white: 255, 255, 255;
--accent: 10, 132, 255;
--passive-grey: 223, 223, 229;
--active-grey: 207, 207, 216;
-
- --search-highlight: 255, 233, 0;
}
@media (prefers-color-scheme: dark) {
@@ -24,15 +21,12 @@
--in-content-primary-button-background: #00ddff;
--in-content-primary-button-background-hover: #80ebff;
--in-content-primary-button-background-active: #aaf2ff;
- --in-content-box-info-background: #36353e;
--black: 251, 251, 254;
--white: 66, 65, 77;
--accent: 54, 213, 255;
--passive-grey: 83, 83, 94;
--active-grey: 91, 91, 102;
-
- --search-highlight: 0, 62, 170;
}
}
@@ -63,33 +57,22 @@ body {
user-select: none;
}
-#permissions-banner,
-#embedded-banner {
- box-sizing: border-box;
- width: 375px;
- min-width: 100%;
- max-width: 100%;
- padding: 8px 4px;
- border-bottom: 1px solid rgb(var(--active-grey));
+body.standalone {
+ width: 100%;
+ max-width: 632px;
+ margin: 1ch auto;
- text-align: center;
+ outline: 1px solid rgb(var(--active-grey));
}
-#grant-host-permission {
- display: block;
- padding: 0.5ch 1ch;
- border-radius: 0.5ch;
- margin: 8px auto 0;
-
- font-family: 'Courier New', Courier, monospace;
- line-height: 1;
-}
+#embedded-banner {
+ padding: 4px 8px;
+ border-bottom: 1px solid rgb(var(--active-grey));
-#grant-host-permission:focus {
- outline: 2px solid rgb(var(--accent));
+ text-align: center;
}
-#permissions-banner:not([hidden]) + #embedded-banner {
+body:not(.embedded) #embedded-banner {
display: none;
}
@@ -184,3 +167,16 @@ input:not(:first-child),
select:not(:first-child) {
margin-left: 1ch;
}
+
+#non-standalone-footer {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 1ch;
+
+ border-top: 1px dotted rgb(var(--active-grey));
+}
+
+body.standalone #non-standalone-footer {
+ display: none;
+}
diff --git a/src/action/popup.html b/src/action/popup.html
index 094475b32..cb10173f1 100644
--- a/src/action/popup.html
+++ b/src/action/popup.html
@@ -15,13 +15,7 @@
-
- ⚠️ XKit Rewritten needs additional permissions in order to apply its enhancements automatically.
-
-
-
- ℹ️ XKit Rewritten can also be configured via the button in the browser toolbar.
-
+ XKit Rewritten can also be configured via the button in the browser toolbar.
@@ -99,7 +96,6 @@
-
diff --git a/src/action/popup.js b/src/action/popup.js
index 4a5633c11..ef1e0b403 100644
--- a/src/action/popup.js
+++ b/src/action/popup.js
@@ -81,5 +81,9 @@ browser.permissions
.then(updatePermissionsBannerVisibility);
const params = new URLSearchParams(location.search);
-const pageIsEmbedded = params.get('embedded') === 'true';
-document.getElementById('embedded-banner').hidden = !pageIsEmbedded;
+if (params.get('embedded') === 'true') {
+ document.body.classList.add('embedded');
+}
+if (params.get('standalone') === 'true') {
+ document.body.classList.add('standalone');
+}