Updates homepage styling

app/src/assets/css/tailwind.css

@@ -213,16 +213,37 @@
     width: 24px;
   }
 
-  .value-prop-cards {
+  .dev-tools-cards {
     background: #f1f3f4;
   }
 
+  .dev-tools-cards .card,
+  .value-prop-cards .card {
+    justify-content: flex-start;
+  }
+
+  .dev-tools-cards .card button,
+  .value-prop-cards .card button {
+    margin-block: auto 16px;
+  }
+
+  .section-inner {
+    max-width: 1488px;
+    margin: 0 auto;
+  }
+
+  .dev-tools-image img {
+    height: 96px;
+    width: auto;
+    margin-block: 16px 24px;
+  }
+
   .value-prop-image {
     margin-bottom: 33px;
   }
 
   .value-prop-image img {
-    width: 200px;
+    width: 80px;
   }
 
   .value-prop-cards button {
@@ -264,8 +285,12 @@
     font-weight: 500;
   }
 
+  .no-projects-link {
+    color: rgb(26, 115, 232);
+  }
+
   @screen lg {
-    .homepage-header h1, 
+    .homepage-header h1,
     .full-bleed-header-image h1 {
       font-size: 44px;
       line-height: 52px;
@@ -300,7 +325,7 @@
     }
 
     .repo-item {
-      border-radius: 4px;   
+      border-radius: 4px;
       padding: 4px 6px;
     }
 
@@ -323,10 +348,15 @@
       top: 44px;
     }
 
+    .ai-hero-clipart {
+      width: 308px;
+      top: 0;
+    }
+
     .impact-number {
       font-size: 64px;
     }
-  
+
     .impact-text {
       font-size: 20px;
     }

app/src/components/NavBar.vue

@@ -59,10 +59,6 @@
             <span class="header">Authors</span>
           </router-link>
 
-          <router-link to="/featured-content" class="section">
-            <span class="header">Featured Content</span>
-          </router-link>
-
           <router-link to="/about" class="section">
             <span class="header">About</span>
           </router-link>
@@ -123,10 +119,6 @@
         ><span>Authors</span></router-link
       >
 
-      <router-link class="block nav-item nav-item-link" to="/featured-content"
-        ><span class="header">Featured Content</span>
-      </router-link>
-
       <router-link class="block nav-item nav-item-link" to="/about"
         ><span>About</span></router-link
       >
@@ -140,7 +132,7 @@
           type="primary"
           v-if="!showSideMenu"
         >
-          Submit your content
+          Submit your AI project
         </MaterialButton>
       </transition>
     </div>

app/src/components/SubmitDialog.vue

@@ -54,7 +54,7 @@ export default class SubmitDialog extends Vue {
 
   mounted() {
     EVENT_BUS.$on(NAME_SHOW_SUBMIT_DIALOG, () => {
-      this.show = true;
+      this.goToForm()
     });
   }
 
@@ -66,7 +66,7 @@ export default class SubmitDialog extends Vue {
     this.show = false;
     conversionEvent("submit");
     window.open(
-      "https://devlibrary.advocu.com/home/applications/form",
+      "https://forms.gle/S61NStowwwTjVrHT7",
       "_blank"
     );
   }

app/src/router/index.ts

@@ -17,7 +17,6 @@
 import Vue from "vue";
 import VueRouter, { RouteConfig } from "vue-router";
 import Home from "../views/Home.vue";
-import FeaturedContent from "../views/FeaturedContent.vue";
 import About from "../views/About.vue";
 import ContentPolicy from "../views/ContentPolicy.vue";
 import Product from "../views/Product.vue";
@@ -50,11 +49,6 @@ const routes: Array<RouteConfig> = [
     name: "RepoPage",
     component: Repo,
   },
-  {
-    path: "/featured-content",
-    name: "Featured Content",
-    component: FeaturedContent,
-  },
   {
     path: "/authors",
     name: "Authors",

app/src/views/About.vue

@@ -47,15 +47,10 @@
             <li>Blog posts</li>
           </ul>
 
-          <p class="mt-4">
-            We are currently not accepting new submissions from the community, please check back later!
-          </p>
           <p class="mt-8 flex flex-wrap gap-4">
-            <a href="mailto:[email protected]">
-              <MaterialButton @click.native="showSubmitDialog" type="primary"
-                >Submit your content</MaterialButton
-              >
-            </a>
+            <MaterialButton @click.native="showSubmitDialog" type="primary"
+              >Submit your AI project</MaterialButton
+            >
           </p>
         </div>
       </div>
@@ -144,7 +139,7 @@
           </div>
           <div v-show="FaqData[3]" class="pb-2 border-b">
             <p class="mt-4">
-              <a target="_blank" href="https://devlibrary.withgoogle.com/featured-content"> Check out</a> our Featured Content page to stay up to date with the latest projects added to the platform. This page features some of the best submissions from each product every month. Also, you can check out the <a href="https://developers.googleblog.com/search/label/Google%20Dev%20Library">Dev Library blog archives</a> for past highlights.
+              <a target="_blank" href="https://devlibrary.withgoogle.com/products/ml"> Check out</a> our AI products page to stay up to date with the latest projects added to the platform. Also, you can check out the <a href="https://developers.googleblog.com/search/label/Google%20Dev%20Library">Dev Library blog archives</a> for past highlights.
             </p>
           </div>
           <p class="mt-6 font-bold">Contributing to Dev Library</p>
@@ -166,7 +161,6 @@
               <ol class="ml-6 mt-2 list-disc">
                 <li>Their own author profile page</li>
                 <li>A shiny contributor badge for their Google Developer profile</li>
-                <li>Spotlights in the Dev Library Featured Content page</li>
                 <li>Inspiring developers to build with Google!</li>
               </ol>
             </p>
@@ -324,7 +318,7 @@
           </div>
           <div v-show="FaqData[12]" class="pb-2 border-b">
             <p class="mt-4">
-              To remove or update your content, please open a Pull request or raise an issue on the 
+              To remove or update your content, please open a Pull request or raise an issue on the
               <a target="_blank" href="https://github.com/google/devlibrary/issues/new">
                 Dev Library's GitHub repo</a>.
             </p>