Fixes #2351 - New promote banner for newsletter

* New promote banner for newsletter

- new function that returns the url for old newsletter in the user
  language
- new image used in the banner
- new style for the newsletter banner and changes on the app promote
  banner

admin/themes/default/theme.css

@@ -7423,7 +7423,7 @@ color:#FF7B00;
   color: black !important;
 }
 
-.promote-apps {
+.promote-apps{
   display: flex;
   flex-direction: column;
   justify-content: flex-end;
@@ -7438,6 +7438,71 @@ color:#FF7B00;
   box-shadow: 0px 5px 10px 5px rgba(0,0,0,0.1)
 }
 
+.promote-newsletter{
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+
+  border-radius: 5px;
+  margin: 0 20px 15px 20px;
+
+  background: #f5d8b0;
+  position: relative;
+
+  box-shadow: 0px 5px 10px 5px rgba(0,0,0,0.1)
+}
+
+.promote-newsletter-content{
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  flex: 2;
+
+  margin-left: 8.45%;
+  margin-right: 16.32%;
+}
+
+.promote-link {
+  color: #E18C32;
+  font-size: 15px;
+  margin-block: 3.5%;
+  font-weight: 700;
+}
+
+.promote-newsletter-title{
+  font-size: 24px;
+  font-weight: 700;
+  text-align: left;
+  margin-top: 3.5%;
+  margin-bottom: 1.75%;
+  color: #493C21;
+}
+
+.subscribe-newsletter{
+  font-size: 15px;
+  max-height: 17.5%;
+  display: flex;
+  gap: 4.64%;
+  margin-block: 1.75%;
+}
+
+.promote-image{
+  height: auto;
+  width: 25%;
+  object-fit: contain;
+}
+
+#newsletterSubscribeInput{
+  font-weight: 700;
+  background-color: #FFFFFF;
+  color: #000000;
+  padding-inline: 4%;
+  padding-block: 2%;
+  border-radius: 2px;
+  border-width: 2px;
+  border-color: #D3D3D3;
+}
+
 .close-apps {
   padding: 1px;
   margin-left: auto;
@@ -7493,7 +7558,7 @@ color:#FF7B00;
   flex-direction: column;
   font-size: 30px;
   font-weight: 700;
-  color: #000;
+  color: #493C21;
   justify-content: center;
   flex: 2;
 }
@@ -7511,11 +7576,11 @@ color:#FF7B00;
 .go-to-porg {
   cursor: pointer;
   padding: 7px 14px;
-  font-size: 18px;
+  font-size: 15px;
   font-weight: bold;
-  background-color: #ffa744;
+  max-width: 41.06%;
+  background-color: #f4ab4f;
   color: #3c3c3c;
-  width: 150px;
   text-align: center;
   white-space: nowrap;
 }
@@ -7523,6 +7588,9 @@ color:#FF7B00;
 .go-to-porg::before {
   margin-right: 10px;
 }
+.go-to-porg:hover {
+  color: #3c3c3c;
+}
 
 .promote-content .right-side .promote-text {
   display: flex;
@@ -7698,6 +7766,40 @@ color:#FF7B00;
   }
 }
 
+@media (max-width: 393px) {
+  .promote-content{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    gap: 15%;
+    flex: 2;
+  }
+
+  .promote-newsletter-content {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex: 2;
+    margin-inline: 3.8%;
+  }
+
+  .promote-image{
+    height: auto;
+    width: 77%;
+    object-fit: contain;
+    align-self: center;
+  }
+
+  .go-to-porg{
+    max-width: 100%;
+    margin-top: 5%;
+  }
+
+  .promote-link{
+    margin-block: 10%;
+  }
+}
+
 /* Css for whats new popin */
 #whats_new{
   display: none;