diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
index ca2417e..3246bcb 100644
--- a/src/_locales/en/messages.json
+++ b/src/_locales/en/messages.json
@@ -86,11 +86,11 @@
"description": "Table heading for the column listing websites."
},
"tableHeadingVpnStatus": {
- "message": "VPN Status",
+ "message": "VPN status",
"description": "Table heading for the column indicating whether the VPN is on or off for a website."
},
"tableHeadingLocation": {
- "message": "Location",
+ "message": "VPN location",
"description": "Table heading for the column showing the location of the website."
},
"headlineNoWebsitePreferences": {
diff --git a/src/assets/logos/logo-wide.svg b/src/assets/logos/logo-wide.svg
new file mode 100644
index 0000000..3dcd3a9
--- /dev/null
+++ b/src/assets/logos/logo-wide.svg
@@ -0,0 +1,6 @@
+
diff --git a/src/ui/settingsPage/settingsPage.js b/src/ui/settingsPage/settingsPage.js
index c4b57a9..5cc8fc0 100644
--- a/src/ui/settingsPage/settingsPage.js
+++ b/src/ui/settingsPage/settingsPage.js
@@ -21,6 +21,7 @@ import { settingTypo } from "./styles.js";
export class SettingsPage extends LitElement {
static properties = {
contexts: { type: Object },
+ serverList: { type: Object },
};
constructor() {
super();
@@ -46,24 +47,11 @@ export class SettingsPage extends LitElement {
// Let's render the view!
return html`
-
-
-
-
-
-
- 
-
- ${tr("productName")}
+ 
${tr("headlineWebsitePreferences")}
@@ -130,7 +118,7 @@ export class SettingsPage extends LitElement {
padding: 20px 30px;
border-bottom: 1px solid var(--border-color);
width: 100%;
- margin-bottom: 16px;
+ margin-bottom: 32px;
}
main {
width: calc(min(70%, 920px));
@@ -161,6 +149,19 @@ export class SettingsPage extends LitElement {
flex-direction: column;
justify-content: center;
align-items: center;
+ max-width: 640px;
+ }
+ @media (prefers-color-scheme: dark) {
+ .invert_darkmode {
+ filter: invert();
+ }
+ }
+
+ h3 {
+ margin-top: 32px;
+ }
+ .emptyState p {
+ opacity: 0.8;
}
`;
}