Add Halloween season check and background

4 files changed, 34 insertions, 0 deletions

diff --git a/palemoon/base/content/aboutDialog.js b/palemoon/base/content/aboutDialog.js
index f2bc53a91..116e3fa9f 100644
--- a/palemoon/base/content/aboutDialog.js
+++ b/palemoon/base/content/aboutDialog.js
@@ -58,4 +58,20 @@ function init(aEvent)
     var relnotes = document.getElementById("releaseNotesURL");
     relnotes.setAttribute("href", releaseNotesURL);
   }
+
+  { // Halloween check, scoped for let
+    let dateObj = new Date();
+    let month = dateObj.getUTCMonth() + 1; //months from 1-12
+    let day = dateObj.getUTCDate();
+    
+    if ((month == 10 && day > 13) ||
+        (month == 11 && day < 5)) {
+      // We're in the second half of Oct or start of Nov
+      try {
+        document.styleSheets[0].addRule('#aboutPMDialogContainer::before','animation: 6s fadeIn;');
+      } catch (e) {
+        Components.utils.reportError(e);
+      }
+    }
+  }
 }
diff --git a/palemoon/branding/official/content/PM-halloween23.jpg b/palemoon/branding/official/content/PM-halloween23.jpg
new file mode 100644
index 000000000..84bba6f34
--- /dev/null
+++ b/palemoon/branding/official/content/PM-halloween23.jpg
diff --git a/palemoon/branding/official/content/aboutDialog.css b/palemoon/branding/official/content/aboutDialog.css
index af12074ee..97cebf9a4 100644
--- a/palemoon/branding/official/content/aboutDialog.css
+++ b/palemoon/branding/official/content/aboutDialog.css
@@ -1,4 +1,5 @@
 #aboutPMDialogContainer {
+  position: relative;
   background-image: url("chrome://branding/content/about-background.jpg");
   background-repeat: no-repeat;
   background-color: #9ABCD5;
@@ -6,6 +7,7 @@
 }
 
 #aboutHeaderBox {
+  position: relative;
   background-image: url("chrome://branding/content/about-wordmark.png");
   background-repeat: no-repeat;
   background-position: center center;
@@ -13,10 +15,12 @@
 }
 
 #aboutVersionBox {
+  position: relative;
   text-shadow: 1px 1px 0px #9ABCD5;
 }
 
 #aboutTextBox {
+  position: relative;
   animation: 3s fadeIn;
   animation-fill-mode: forwards;
   text-shadow: 1px 1px 0px #9ABCD5;
@@ -36,10 +40,12 @@
 }
 
 #aboutLinkBox {
+  position: relative;
   padding: 15px 10px 0;
 }
 
 #aboutPMtrademark {
+  position: relative;
   font-size: 10px;
   text-align: center;
   color: #C0C0C0;
@@ -47,3 +53,14 @@
   margin-top: 10px;
   margin-bottom: 10px;
 }
+
+#aboutPMDialogContainer::before {
+  opacity: 0;
+  animation-fill-mode: forwards;
+  content: "";
+  position: absolute;
+  top: 0; left: 0;
+  width: 100%; height: 100%;
+  background-image: url("chrome://branding/content/PM-halloween23.jpg");
+}
+
diff --git a/palemoon/branding/official/content/jar.mn b/palemoon/branding/official/content/jar.mn
index 5bfa72ff8..0760539aa 100644
--- a/palemoon/branding/official/content/jar.mn
+++ b/palemoon/branding/official/content/jar.mn
@@ -10,3 +10,4 @@ browser.jar:
   content/branding/icon16.png                     (../default16.png)
   content/branding/icon32.png                     (../default32.png)
   content/branding/aboutDialog.css                (aboutDialog.css)
+  content/branding/PM-halloween23.jpg             (PM-halloween23.jpg)