From 7f6137983385f23c820d01c9a0918b9b90928dd0 Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Mon, 4 Mar 2019 13:01:54 +0100 Subject: Replace about box backdrop. --- .../branding/unstable/content/about-background.jpg | Bin 0 -> 115006 bytes .../branding/unstable/content/about-background.png | Bin 330757 -> 0 bytes 2 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 application/palemoon/branding/unstable/content/about-background.jpg delete mode 100644 application/palemoon/branding/unstable/content/about-background.png (limited to 'application/palemoon/branding/unstable') diff --git a/application/palemoon/branding/unstable/content/about-background.jpg b/application/palemoon/branding/unstable/content/about-background.jpg new file mode 100644 index 000000000..a33b33183 Binary files /dev/null and b/application/palemoon/branding/unstable/content/about-background.jpg differ diff --git a/application/palemoon/branding/unstable/content/about-background.png b/application/palemoon/branding/unstable/content/about-background.png deleted file mode 100644 index 3d20e0658..000000000 Binary files a/application/palemoon/branding/unstable/content/about-background.png and /dev/null differ -- cgit v1.2.3 From f0c57ac5f22022bc42fc1763297c3bcbf42c45fe Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Mon, 4 Mar 2019 13:02:25 +0100 Subject: Update about box design. Tag #963. --- .../branding/unstable/content/about-wordmark.svg | 8 ---- .../branding/unstable/content/aboutDialog.css | 51 +++++++++++----------- .../palemoon/branding/unstable/content/jar.mn | 2 +- 3 files changed, 27 insertions(+), 34 deletions(-) delete mode 100644 application/palemoon/branding/unstable/content/about-wordmark.svg (limited to 'application/palemoon/branding/unstable') diff --git a/application/palemoon/branding/unstable/content/about-wordmark.svg b/application/palemoon/branding/unstable/content/about-wordmark.svg deleted file mode 100644 index fd0f1745e..000000000 --- a/application/palemoon/branding/unstable/content/about-wordmark.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/application/palemoon/branding/unstable/content/aboutDialog.css b/application/palemoon/branding/unstable/content/aboutDialog.css index 9af49ba10..4529c22b6 100644 --- a/application/palemoon/branding/unstable/content/aboutDialog.css +++ b/application/palemoon/branding/unstable/content/aboutDialog.css @@ -3,45 +3,46 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ #aboutPMDialogContainer { - background-image: url("chrome://branding/content/about-background.png"); + background-image: url("chrome://branding/content/about-background.jpg"); background-repeat: no-repeat; - background-color: #100000; - background-size: cover; - color: #E0E0FF; + background-color: #D5BC9A; + color: #202010; } -#PMleftBox { - background-image: url("chrome://branding/content/about-logo.png"); +#aboutHeaderBox { + background-image: url("chrome://branding/content/about-wordmark.png"); background-repeat: no-repeat; - /* min-width and min-height create room for the logo */ - min-width: 210px; - min-height: 210px; - margin-top:20px; - -moz-margin-start: 30px; + background-position: center center; + height: 44px; } -#PMrightBox { - margin-left: 30px; - margin-right: 30px; +#aboutVersionBox { + font-family: Arial, helvetica; + text-shadow: 1px 1px 0px #D5BC9A; } -#detailsBox > description > .text-link { - color: #CDC36F; +#aboutTextBox { + font-family: Arial, helvetica; + font-size: 14px; + text-shadow: 1px 1px 0px #D5BC9A; + padding: 0px 10px; + background: linear-gradient(to bottom, + transparent 0%, + rgba(255, 255, 255, .3) 20%, + rgba(255, 255, 255, .5) 75%, + transparent 100%); } -#PMbottomBox { +#aboutLinkBox { padding: 15px 10px 0; - background-color: rgba(240,240,255,.7); -} - -#PMupdateDeck > hbox > label:not([class="text-link"]) { - color: #909090; + font-family: Arial, helvetica; } -#PMtrademark { - font-size: xx-small; +#aboutPMtrademark { + font-size: 10px; text-align: center; - color: #333333; + color: #C0C0C0; + text-shadow: 1px 1px 0px #000000; margin-top: 10px; margin-bottom: 10px; } diff --git a/application/palemoon/branding/unstable/content/jar.mn b/application/palemoon/branding/unstable/content/jar.mn index 6903e9ac5..fcb789031 100644 --- a/application/palemoon/branding/unstable/content/jar.mn +++ b/application/palemoon/branding/unstable/content/jar.mn @@ -5,7 +5,7 @@ browser.jar: % content branding %content/branding/ contentaccessible=yes content/branding/about.png (about.png) - content/branding/about-background.png (about-background.png) + content/branding/about-background.jpg (about-background.jpg) content/branding/about-logo.png (about-logo.png) content/branding/about-logo@2x.png (about-logo@2x.png) content/branding/about-wordmark.png (about-wordmark.png) -- cgit v1.2.3 From a7bca40ad5044a55358fe1c839a613da644a2bd2 Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Tue, 5 Mar 2019 14:41:20 +0100 Subject: Tweak the about box layout a bit. - Put the Licensing link in the center - Strengthen the "fog" background for the credits text for readability - Add CSS animation to fade it in. --- .../branding/unstable/content/aboutDialog.css | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) (limited to 'application/palemoon/branding/unstable') diff --git a/application/palemoon/branding/unstable/content/aboutDialog.css b/application/palemoon/branding/unstable/content/aboutDialog.css index 4529c22b6..7ae040b05 100644 --- a/application/palemoon/branding/unstable/content/aboutDialog.css +++ b/application/palemoon/branding/unstable/content/aboutDialog.css @@ -22,17 +22,31 @@ } #aboutTextBox { + animation: 3s fadeIn; + animation-fill-mode: forwards; font-family: Arial, helvetica; font-size: 14px; text-shadow: 1px 1px 0px #D5BC9A; - padding: 0px 10px; + padding: 15px 10px 5px; background: linear-gradient(to bottom, transparent 0%, - rgba(255, 255, 255, .3) 20%, - rgba(255, 255, 255, .5) 75%, + rgba(255, 255, 255, .6) 15%, + rgba(255, 255, 255, .7) 85%, transparent 100%); } +@keyframes fadeIn { + 0% { + opacity: 0; + } + 50% { + opacity: 0; + } + 100% { + opacity: 1; + } +} + #aboutLinkBox { padding: 15px 10px 0; font-family: Arial, helvetica; -- cgit v1.2.3 From 403605efb578527388f4af523eefaebaeb7e10ae Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Wed, 6 Mar 2019 00:51:39 +0100 Subject: Tweak the about box styling some more and clean up styles. --- .../palemoon/branding/unstable/content/aboutDialog.css | 11 +---------- 1 file changed, 1 insertion(+), 10 deletions(-) (limited to 'application/palemoon/branding/unstable') diff --git a/application/palemoon/branding/unstable/content/aboutDialog.css b/application/palemoon/branding/unstable/content/aboutDialog.css index 7ae040b05..de71f259c 100644 --- a/application/palemoon/branding/unstable/content/aboutDialog.css +++ b/application/palemoon/branding/unstable/content/aboutDialog.css @@ -17,22 +17,14 @@ } #aboutVersionBox { - font-family: Arial, helvetica; text-shadow: 1px 1px 0px #D5BC9A; } #aboutTextBox { animation: 3s fadeIn; animation-fill-mode: forwards; - font-family: Arial, helvetica; - font-size: 14px; text-shadow: 1px 1px 0px #D5BC9A; - padding: 15px 10px 5px; - background: linear-gradient(to bottom, - transparent 0%, - rgba(255, 255, 255, .6) 15%, - rgba(255, 255, 255, .7) 85%, - transparent 100%); + color: #202010; } @keyframes fadeIn { @@ -49,7 +41,6 @@ #aboutLinkBox { padding: 15px 10px 0; - font-family: Arial, helvetica; } #aboutPMtrademark { -- cgit v1.2.3 From a49d052afea11bb93498356c102d94fb22075f4d Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Wed, 6 Mar 2019 03:39:44 +0100 Subject: =?UTF-8?q?Adjust=20Pale=20Moon=E2=84=A2=20wordmark=20for=20better?= =?UTF-8?q?=20contrast?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../branding/unstable/content/about-wordmark.png | Bin 2197 -> 11708 bytes 1 file changed, 0 insertions(+), 0 deletions(-) (limited to 'application/palemoon/branding/unstable') diff --git a/application/palemoon/branding/unstable/content/about-wordmark.png b/application/palemoon/branding/unstable/content/about-wordmark.png index deb60b6b9..bf09f15a0 100644 Binary files a/application/palemoon/branding/unstable/content/about-wordmark.png and b/application/palemoon/branding/unstable/content/about-wordmark.png differ -- cgit v1.2.3