Add classifier FAQ, link to from filters (#3484)

* Add classifier FAQ, link to from filters

* Update text and positioning based on feedback

Author: nlhkabu

warehouse/static/sass/blocks/_tooltip.scss

@@ -15,11 +15,13 @@ $tooltip-duration: 0.1s !default;
 
 // This is the tooltip bubble
 .tooltipped::after {
+  content: attr(aria-label);
   position: absolute;
   z-index: 1000000;
   display: none;
   padding: 5px 8px;
-  font-size: 11px/1.5;
+  font-size: $base-font-size;
+  font-weight: normal;
   -webkit-font-smoothing: subpixel-antialiased;
   color: $tooltip-text-color;
   text-align: center;
@@ -30,7 +32,6 @@ $tooltip-duration: 0.1s !default;
   word-wrap: break-word;
   white-space: pre;
   pointer-events: none;
-  content: attr(aria-label);
   background: $tooltip-background-color;
   border-radius: 2px;
   opacity: 0;

warehouse/templates/pages/help.html

@@ -23,6 +23,7 @@
 {% macro packages() %}What's a package, project, or release?{% endmacro %}
 {% macro installing() %}How do I install a file (package) from PyPI?{% endmacro %}
 {% macro publishing() %}How do I package and publish my code for PyPI?{% endmacro %}
+{% macro trove_classifier() %}What's a trove classifier?{% endmacro %}
 {% macro verified_email() %}Why do I need a verified email address?{% endmacro %}
 {% macro mirroring() %}How can I run a mirror of PyPI?{% endmacro %}
 {% macro APIs() %}Does PyPI have APIs I can use?{% endmacro %}
@@ -58,6 +59,7 @@ <h2 class="faq-group__first"><a href="#basics">Basics</a></h2>
           <li><a href="#packages">{{ packages() }}</a></li>
           <li><a href="#installing">{{ installing() }}</a></li>
           <li><a href="#publishing">{{ publishing() }}</a></li>
+          <li><a href="#trove-classifier">{{ trove_classifier() }}</a></li>
           <li><a href="#verified-email">{{ verified_email() }}</a></li>
         </ul>
       </section>
@@ -128,6 +130,12 @@ <h3 id="publishing">{{ publishing() }}</h3>
           For full instructions on configuring, packaging and distributing your Python project, refer to the <a href="https://packaging.python.org/distributing/">packaging tutorial</a> on the <a href="https://packaging.python.org">Python Packaging User Guide</a>.
         </p>
 
+        <h3 id="trove-classifier">{{ trove_classifier() }}</h3>
+
+        <p>Each project's maintainers provide PyPI with a list of "trove classifiers" to categorize each release, describing who it's for, what systems it can run on, and how mature it is.</p>
+        <p>These standardized classifiers can then be used by community members to find projects based on their desired criteria.</p>
+        <p>Instructions for how to add trove classifiers to a project can be found on the <a href="https://packaging.python.org/tutorials/distributing-packages/#classifiers">Python Packaging User Guide</a>. To read the original classifier specification, refer to <a href="https://www.python.org/dev/peps/pep-0301/#distutils-trove-classification">PEP 301</a>.</p>
+
         <h3 id="verified-email">{{ verified_email() }}</h3>
         <p>
           Currently, PyPI requires a verified email address to perform the following operations:

warehouse/templates/search/results.html

@@ -100,7 +100,16 @@ <h3 class="package-snippet__title">
           <i class="fa fa-close" aria-hidden="true"></i>
           <span class="sr-only">Close</span>
         </a>
-        <h2 class="no-top-padding">Filter Projects</h2>
+        <h2 class="no-top-padding">
+          Filter by classifier
+          <a href="{{ request.route_path('help')}}#trove-classifier"
+             class="tooltipped tooltipped-s"
+             aria-label="What's a trove classifier?"
+             data-original-label="What's a trove classifier?">
+            <i class="fa fa-question-circle" aria-hidden="true"></i>
+            <span class="sr-only">Classifier information<span>
+          </a>
+        </h2>
         <form id="classifiers">
         <input id="search" type="hidden" name="q" value="{{ term }}">
         <input type="hidden" name="o" value="{{ order }}">