Issue 2844 - Create Microsoft Edge coming soon landing page

static/css/index.css

Index: static/css/index.css
===================================================================
--- a/static/css/index.css
+++ b/static/css/index.css
@@ -69,7 +69,7 @@
   display: inline-block;
 }
 
-#video, #maxthon-instruction
+#video, #maxthon-instruction, #edge-teaser
 {
   background: #ffffff;
   padding: 10px;
@@ -80,7 +80,7 @@
 #maxthon-instruction,
 html[lang^="zh_"] #content.maxthon #video,
 #content.maxthon #feature-free,
-#feature-maxthon
+#feature-maxthon, #edge-subscription, #edge-teaser
 {
   display: none;
 }
@@ -96,6 +96,16 @@
   display: inline-block;
 }
 
+#content.edge #video

[saroyanm, 2015/09/30 12:33:03]

Detail: This rule can be merged with the rules above, same way it has been done
for Maxthon page "html[lang^="zh_"] #content.maxthon #video".

+{
+  display: none;
+}
+
+#content.edge #edge-subscription
+{
+  display: block;
+}
+
 #summary h1, #summary h2
 {
   font-weight: normal;
@@ -417,6 +427,88 @@
   background-position: -128px -109px;
 }
 
+#platform-edge
+{
+  background-position: -68px -171px;
+}
+
+#content.edge #platform-edge
+{
+  background-position: -68px -151px;
+}
+
+#content h3.subscribe-header
+{
+  font-size: 18px;
+  margin-bottom: 0px;
+}
+
+#edge-subscription h3
+{
+  margin: 19px 0px 10px 0px;
+  color: #2d79c0;
+  font-weight: bold;
+  font-family: Arial;
+  font-size: 14px;
+}
+
+#edge-subscription
+{
+  margin: 0px 0px 10px 40px;
+}
+
+html[dir="rtl"] #edge-subscription
+{
+  margin: 0px 40px 10px 0px;
+}
+
+#edge-subscription input[type=email]
+{
+  border: solid 2px #a5a5a5;
+  padding: 0px 10px;
+  font-size: 14px;
+  font-family: Arial;
+  line-height: 36px;
+  height: 36px; /* IE 8 */
+}
+
+#edge-subscription input[type=email].placeholder
+{
+  color: #a5a5a5;
+}
+
+#edge-subscription button[type=submit]
+{
+  border: solid 1px #357ebd;
+  border-radius: 3px;
+  background-color: #428bca;
+  color: #ffffff;
+  font-size: 14px;
+  font-weight: bold;
+  width: 146px;
+  height: 40px;
+}
+
+
+#edge-subscription form .sucess-label, #edge-subscription form .response-error,

[saroyanm, 2015/09/30 12:33:04]

Please wrap messages in the div and hide them individually inside of that div,
or at least please use #edge-subscription form > span rule and merge with other
rule as mentioned above

+#edge-subscription form .invalid-label, #edge-subscription form.success input,
+#edge-subscription form.success button, #other-browsers
+{
+  display: none;
+}
+
+#edge-subscription form .invalid-label
+{
+  margin-top: 15px;
+}
+
+#edge-subscription form.success .sucess-label,

[saroyanm, 2015/09/30 12:33:04]

After updating the request mentioned above you can merge this rule this
"#content.edge #edge-subscription"

+#edge-subscription form.invalid .invalid-label,
+#edge-subscription form.error .response-error
+{
+  display: block;
+}
+
 .warning-platform,
 .disclaimer,
 #maxthon-notification
@@ -609,7 +701,8 @@
 #more-container.internet-explorer #tab-internet-explorer,
 #more-container.safari #tab-safari,
 #more-container.yandex-browser #tab-yandex-browser,
-#more-container.maxthon #tab-maxthon
+#more-container.maxthon #tab-maxthon,
+#more-container.edge #tab-edge
 {
   display: inline-block;
 }
@@ -622,6 +715,7 @@
 #more-container.safari #more-safari,
 #more-container.yandex-browser #more-yandex-browser,
 #more-container.maxthon #more-maxthon
+#more-container.edge #more-edge
 {
   background-color: #dbd4c7;
-}
+}