repo sync

content/developers/github-marketplace/about-github-marketplace.md

@@ -20,7 +20,7 @@ To learn about publishing {% data variables.product.prodname_actions %} in {% da
 
 Anyone can share their apps with other users for free on {% data variables.product.prodname_marketplace %} but only apps owned by organizations can sell their app. 
 
-To publish paid plans for your app and display the verified creator badge, you must complete the publisher verification process. For more information, see "[Applying for publisher verification for your organization](/developers/github-marketplace/applying-for-publisher-verification-for-your-organization)" or "[Requirements for listing an app](/developers/github-marketplace/requirements-for-listing-an-app)."
+To publish paid plans for your app and display a marketplace badge, you must complete the publisher verification process. For more information, see "[Applying for publisher verification for your organization](/developers/github-marketplace/applying-for-publisher-verification-for-your-organization)" or "[Requirements for listing an app](/developers/github-marketplace/requirements-for-listing-an-app)."
 
 Once the organization meets the requirements, someone with owner permissions in the organization can publish paid plans for any of their apps. Each app with a paid plan also goes through a financial onboarding process to enable payments.
 

content/developers/github-marketplace/about-verified-creator-badges.md → content/developers/github-marketplace/about-marketplace-badges.md

@@ -1,17 +1,22 @@
 ---
-title: About verified creator badges
-intro: 'Learn about the verified creator badges that are shown for some listings for apps and actions on {% data variables.product.prodname_marketplace %}.'
+title: About marketplace badges
+intro: 'Learn about the badges that you may see for some apps and actions listings on {% data variables.product.prodname_marketplace %}.'
+redirect_from:
+  - /developers/github-marketplace/about-verified-creator-badges
 versions:
   free-pro-team: '*'
 ---
 
 ### For GitHub Apps
 
-Apps with the {% octicon "verified" aria-label="The verified badge" %}, or verified creator badge, are owned by an organization that has completed the publisher verification process. 
+Apps with the {% octicon "verified" aria-label="The verified badge" %}, are owned by an organization that has:
+- Confirmed their domain
+- Confirmed their email address so {% data variables.product.prodname_dotcom %} Support can reach the organization
+- Required two-factor authentication for their organization. For more information, see "[Requiring two-factor authentication in your organization](/github/setting-up-and-managing-organizations-and-teams/requiring-two-factor-authentication-in-your-organization)."
 
-![Verified creator badge for GitHub Apps](/assets/images/marketplace/apps-with-verified-creator-badges.png)
+![Marketplace badge for GitHub Apps](/assets/images/marketplace/apps-with-verified-publisher-badge.png)
 
-To learn more about the publisher verification process, see "[Applying for publisher verification for your organization](/developers/github-marketplace/applying-for-publisher-verification-for-your-organization)."
+To learn how you can add this badge to your app, see "[Applying for publisher verification for your organization](/developers/github-marketplace/applying-for-publisher-verification-for-your-organization)."
 
 For more information about the requirements for listing an app on {% data variables.product.prodname_marketplace %}, see "[Requirements for listing an app on {% data variables.product.prodname_marketplace %}](/marketplace/getting-started/requirements-for-listing-an-app-on-github-marketplace/)."
 

content/developers/github-marketplace/applying-for-publisher-verification-for-your-organization.md

@@ -1,6 +1,6 @@
 ---
 title: Applying for publisher verification for your organization
-intro: 'To offer paid plans for your app or to include the verified creator badge in your app listing, you must complete the publisher verification process for your organization.'
+intro: 'To offer paid plans for your app or to include a marketplace badge in your app listing, you must complete the publisher verification process for your organization.'
 versions:
   free-pro-team: '*'
 ---

content/developers/github-marketplace/index.md

@@ -11,7 +11,7 @@ versions:
 
 {% topic_link_in_list /github-marketplace-overview %}
     {% link_in_list /about-github-marketplace %}
-    {% link_in_list /about-verified-creator-badges %}
+    {% link_in_list /about-marketplace-badges %}
     {% link_in_list /applying-for-publisher-verification-for-your-organization %}
 
 {% topic_link_in_list /creating-apps-for-github-marketplace %}

content/github/customizing-your-github-workflow/about-github-marketplace.md

@@ -19,7 +19,7 @@ You can discover, browse, and install apps and actions created by others on {% d
 
 {% data reusables.actions.actions-not-verified %}
 
-Anyone can list a free {% data variables.product.prodname_github_app %} or {% data variables.product.prodname_oauth_app %} on {% data variables.product.prodname_marketplace %}. Publishers of paid apps are verified by {% data variables.product.company_short %} and listings for these apps are shown with a verified creator badge {% octicon "verified" aria-label="Verified creator badge" %}. You will also see badges for unverified and verified apps. These apps were published using the previous method for verifying individual apps. For more information about the current process, see "[About GitHub Marketplace](/developers/github-marketplace/about-github-marketplace)" and "[Requirements for listing an app](/developers/github-marketplace/requirements-for-listing-an-app)."
+Anyone can list a free {% data variables.product.prodname_github_app %} or {% data variables.product.prodname_oauth_app %} on {% data variables.product.prodname_marketplace %}. Publishers of paid apps are verified by {% data variables.product.company_short %} and listings for these apps are shown with a marketplace badge {% octicon "verified" aria-label="Verified creator badge" %}. You will also see badges for unverified and verified apps. These apps were published using the previous method for verifying individual apps. For more information about the current process, see "[About GitHub Marketplace](/developers/github-marketplace/about-github-marketplace)" and "[Requirements for listing an app](/developers/github-marketplace/requirements-for-listing-an-app)."
 
 ### Building and listing a tool on {% data variables.product.prodname_marketplace %}
 

data/reusables/marketplace/launch-with-free.md

@@ -1 +1 @@
-You can request publication with or without verification. Requesting publication without verification allows you to launch a free version of your app quickly. If you then request publication with verification, your listing will be updated to include the verified creator badge and any paid pricing plans when you complete verification and financial onboarding.
+You can request publication with or without verification. Requesting publication without verification allows you to launch a free version of your app quickly. If you then request publication with verification, your listing will be updated to include the marketplace badge and any paid pricing plans when you complete verification and financial onboarding.

data/ui.yml

@@ -161,5 +161,5 @@ product_sublanding:
     how_to: How-to guide
     reference: Reference
 learning_track_nav:
-  prevGuide: Previous Guide
-  nextGuide: Next Guide
+  prevGuide: Previous guide
+  nextGuide: Next guide

layouts/product-sublanding.html

@@ -26,8 +26,8 @@ <h1 class="my-3 font-mktg">{{ page.shortTitle }}</h1>
             <ul class="list-style-none d-flex flex-nowrap overflow-x-scroll px-2 feature-track">
               <li class="px-2 d-flex flex-shrink-0">
                 <div class="d-inline-block Box p-5 bg-gradient--blue-purple text-white">
-                  <div class="circle bg-white text-blue border border-white d-inline-flex">{% octicon "star-fill" height="24" class="v-align-middle m-2"%}</div>
-                  <h3 class="font-mktg h2-mktg my-4">{{ featuredTrack.title }}</h3>
+                  <div class="circle text-white d-inline-flex" style="border: 2px white solid;">{% octicon "star-fill" height="24" class="v-align-middle m-2"%}</div>
+                  <h3 class="font-mktg h3-mktg my-4">{{ featuredTrack.title }}</h3>
                   <div class="lead-mktg text-white f5 my-4">{{ featuredTrack.description }}</div>
                   <a class="d-inline-block border border-white text-white px-4 py-2 f5 no-underline text-bold" role="button" href="{{ featuredTrack.guides[0].href }}?learn={{ featuredTrack.trackName }}">
                     <span class="mr-2">{% octicon "arrow-right" height="20" %}</span>
@@ -44,8 +44,8 @@ <h3 class="font-mktg h2-mktg my-4">{{ featuredTrack.title }}</h3>
                       </div>
                       <div class="text-gray-light h6 text-uppercase">{{ guideTypes[guide.page.type] }}</div>
                     </div>
-                    <h3 class="font-mktg h2-mktg my-4 text-gray-dark">{{ guide.title }}</h3>
-                    <div class="lead-mktg text-gray f5 my-4">{{ guide.intro }}</div>
+                    <h3 class="font-mktg h3-mktg my-4 text-gray-dark">{{ guide.title }}</h3>
+                    <div class="lead-mktg text-gray f5 my-4 truncate-overflow-8">{{ guide.intro }}</div>
                   </a>
                 </li>
               {% endfor %}
@@ -59,23 +59,20 @@ <h2 class="mb-3 font-mktg">{% data ui.product_sublanding.learning_paths %}</h2>
             <div class="lead-mktg text-gray f4">{% data ui.product_sublanding.learning_paths_desc %}</div>
 
             <!-- Learning tracks -->
-            <div class="d-flex flex-wrap flex-items-start my-5">
+            <div class="d-flex flex-wrap flex-items-start my-5 gutter">
               {% for track in page.learningTracks offset:1 %}
-                <div class="my-3 px-0 px-4 col-12 col-md-6 learning-track">
-                  <div class="Box js-show-more-container">
-                    <div class="Box-header bg-gradient--purple-pink py-4 d-flex flex-auto flex-items-start flex-wrap">
+                <div class="my-3 px-4 col-12 col-md-6 learning-track">
+                  <div class="Box js-show-more-container d-flex flex-column">
+                    <div class="Box-header bg-gradient--purple-pink p-4 d-flex flex-1 flex-items-start flex-wrap">
                       <div class="d-flex flex-auto flex-items-start col-8 col-md-12 col-xl-8">
-                        <div class="circle bg-white text-purple border border-white d-inline-flex mr-4">
-                          {% octicon "star-fill" height="20" class="v-align-middle m-2"%}
-                        </div>
                         <div class="my-xl-0 mr-xl-3">
-                          <h4 class="mb-3 text-white font-mktg h3-mktg ">
+                          <h5 class="mb-3 text-white font-mktg h3-mktg ">
                             {{ track.title }}
-                          </h4>
-                          <p class="text-white">{{ track.description }}</p>
+                          </h5>
+                          <p class="text-white truncate-overflow-3 learning-track--description">{{ track.description }}</p>
                         </div>
                       </div>
-                      <a class="d-inline-block border border-white text-white px-3 py-2 f5 no-underline text-bold no-wrap" role="button" href="{{ track.guides[0].href }}?learn={{ track.trackName }}">
+                      <a class="d-inline-block border border-white text-white px-3 py-2 f5 no-underline text-bold no-wrap mt-3 mt-md-0" role="button" href="{{ track.guides[0].href }}?learn={{ track.trackName }}">
                         {% data ui.product_sublanding.start %}
                         <span class="ml-2">{% octicon "arrow-right" height="20" %}</span>
                       </a>
@@ -86,7 +83,7 @@ <h4 class="mb-3 text-white font-mktg h3-mktg ">
                           <div class="circle bg-gray d-inline-flex mr-4">
                             <span class="m-2 f3 lh-condensed-ultra text-center text-bold text-gradient--purple-pink" style="min-width: 20px; height: 20px;">{{ forloop.index }}</span>
                           </div>
-                          <h4 class="flex-auto">{{ guide.title }}</h4>
+                          <h5 class="flex-auto pr-2">{{ guide.title }}</h5>
                           <div class="text-gray-light h6 text-uppercase">{{ guideTypes[guide.page.type] }}</div>
                         </a>
                       {% endfor %}

stylesheets/product-sublanding.scss

@@ -2,4 +2,23 @@
   li {
     width: 280px;
   }
-}
+}
+
+.learning-track {
+  &--description {
+    min-height: 1em * $body-line-height * 3
+  }
+}
+
+@mixin truncate($maxLine) {
+  .truncate-overflow-#{$maxLine} {
+    display: -webkit-box;
+    -webkit-line-clamp: $maxLine;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+
+@include truncate(3);
+@include truncate(8);