From 45e4ac63aa7ef59c9fb8bf75f476049aa009c0d9 Mon Sep 17 00:00:00 2001 From: sameerasw Date: Wed, 23 Apr 2025 20:07:43 +0530 Subject: better header and new header font --- assets/fonts/sugarmagicpersonaluseonly-jemyo.otf | Bin 0 -> 162484 bytes data-viewer/data-viewer.html | 14 ++++++--- popup/popup.css | 38 ++++++++++++++++------- popup/popup.html | 14 ++++++--- popup/popup.js | 2 +- 5 files changed, 46 insertions(+), 22 deletions(-) create mode 100644 assets/fonts/sugarmagicpersonaluseonly-jemyo.otf diff --git a/assets/fonts/sugarmagicpersonaluseonly-jemyo.otf b/assets/fonts/sugarmagicpersonaluseonly-jemyo.otf new file mode 100644 index 0000000..a0716aa Binary files /dev/null and b/assets/fonts/sugarmagicpersonaluseonly-jemyo.otf differ diff --git a/data-viewer/data-viewer.html b/data-viewer/data-viewer.html index 305cb2e..b0d4a5f 100644 --- a/data-viewer/data-viewer.html +++ b/data-viewer/data-viewer.html @@ -14,12 +14,16 @@
-
- ZenInternet Logo -

ZenInternet Settings

+
+
+ ZenInternet Logo +

Zen Internet Settings

+
+
+
+
by @sameerasw
+
-
by @sameerasw
-
diff --git a/popup/popup.css b/popup/popup.css index 67eab43..ba754e0 100644 --- a/popup/popup.css +++ b/popup/popup.css @@ -1,6 +1,12 @@ @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"); @import url("../theme.css"); +@font-face { + font-family: "sugar-magic"; + src: url("../assets/fonts/sugarmagicpersonaluseonly-jemyo.otf") + format("opentype"); +} + body { width: 360px; margin: 0; @@ -30,12 +36,15 @@ body { border-bottom: 1px solid rgba(255, 255, 255, 0.1); box-shadow: var(--shadow); position: relative; + display: flex; + flex-direction: row; + justify-content: space-between; } .logo-container { display: flex; align-items: center; - gap: 8px; + gap: 12px; } .logo-img { @@ -46,16 +55,24 @@ body { } .app-title { + font-family: "sugar-magic", sans-serif; margin: 0; - font-size: 20px; - font-weight: 600; - letter-spacing: -0.5px; + font-size: 30px; } -.author { - font-size: 12px; - margin-top: 4px; - opacity: 0.9; +#header-container{ + display: flex; + justify-content: space-between; + flex-direction: column; + width: 100%; +} + +.miniheader{ + margin-top: 2px; + font-size: 11px; + display: flex; + gap: 4px; + flex-direction: row; } .author a { @@ -70,9 +87,9 @@ body { /* What's New Button */ .whats-new-button { - position: absolute; + /* position: absolute; top: 16px; - right: 16px; + right: 16px; */ background: none; border: none; color: white; @@ -474,7 +491,6 @@ input:checked + .slider:before { margin-right: 4px; } -#addon-version, #last-fetched-time { font-size: 0.75em; } diff --git a/popup/popup.html b/popup/popup.html index bc53134..9d8d042 100644 --- a/popup/popup.html +++ b/popup/popup.html @@ -12,12 +12,16 @@
-
- ZenInternet Logo -

ZenInternet

+
+
+ ZenInternet Logo +

Zen Internet

+
+
+
+
by @sameerasw
+
-
by @sameerasw
-
diff --git a/popup/popup.js b/popup/popup.js index 44123ee..64036a9 100644 --- a/popup/popup.js +++ b/popup/popup.js @@ -593,7 +593,7 @@ new (class ExtensionPopup { const version = manifest.version; document.getElementById( "addon-version" - ).textContent = `Version: ${version}`; + ).textContent = `v${version}`; } setupAutoUpdate() { -- cgit v1.2.3