Merge pull request #7487 from N-Shar-ma/news-banner

Updated position and content of news banner

microsite/pages/en/index.js

@@ -20,6 +20,20 @@ class Index extends React.Component {
 
     return (
       <main className="MainContent">
+        <Banner.Container>
+          <Banner.Dismissable storageKey="2021-10-07-software-templates-techdocs-beta">
+            🚀 Feature updates!{' '}
+            <a href="https://backstage.io/blog/2021/07/26/software-templates-are-now-in-beta">
+              Software Templates
+            </a>{' '}
+            and{' '}
+            <a href="https://backstage.io/blog/2021/09/16/the-techdocs-beta-has-landed">
+              TechDocs
+            </a>{' '}
+            are now in beta.
+          </Banner.Dismissable>
+        </Banner.Container>
+
         <Block small className="bg-black-grey stripe-bottom">
           <Block.Container>
             <Block.TextBox>
@@ -54,15 +68,6 @@ class Index extends React.Component {
           </Block.Container>
         </Block>
 
-        <Banner.Container>
-          <Banner.Dismissable storageKey="k8s-launch">
-            🎉 New feature: Kubernetes for service owners.{' '}
-            <a href="https://backstage.io/blog/2021/01/12/new-backstage-feature-kubernetes-for-service-owners">
-              Learn more.
-            </a>
-          </Banner.Dismissable>
-        </Banner.Container>
-
         <Block small className="stripe-top bg-black">
           <Block.Container wrapped>
             <Block.TextBox>

microsite/static/css/custom.css

@@ -1094,10 +1094,27 @@ code {
   position: relative;
   overflow: visible;
   z-index: 100;
-
+  margin: 25px auto 0 auto;
   max-width: 1430px;
   height: 0;
-  margin: -14px auto 14px auto;
+}
+
+@media only screen and (max-width: 1024px) {
+  .Banner__Container {
+    margin-top: 20px;
+  }
+}
+
+@media only screen and (max-width: 645px) {
+  .Banner__Container {
+    margin-top: 60px;
+  }
+}
+
+@media only screen and (max-width: 335px) {
+  .Banner__Container {
+    margin-top: 90px;
+  }
 }
 
 .Banner__DismissButton {