bitbake: toastergui: add the word 'compatible' to 'all' pages

Labels for the 'all' pages don't really convey what's provided in them.
The team has suggested we add the word 'compatible' to them,
to make clear they will show all layers / targets / machines that
can be built with the version of the build system you are
using in a certain project. A link like 'view all targets'
becomes 'view all compatible targets'.

I've also added some help text.

(Bitbake rev: 49d85b7035d12a6e482d608e828f69fcafb59d39)

Signed-off-by: Belen Barros Pena <belen.barros.pena@intel.com>
Signed-off-by: Alexandru DAMIAN <alexandru.damian@intel.com>
Signed-off-by: Richard Purdie <richard.purdie@linuxfoundation.org>

6 files changed, 27 insertions, 19 deletions

diff --git a/bitbake/lib/toaster/toastergui/static/css/default.css b/bitbake/lib/toaster/toastergui/static/css/default.css
index a866773af6..41b73cc826 100644
--- a/bitbake/lib/toaster/toastergui/static/css/default.css
+++ b/bitbake/lib/toaster/toastergui/static/css/default.css
@@ -34,7 +34,7 @@
 .get-help-yellow:hover { color: #B38942; cursor: pointer; }
 .get-help-red { color: #B94A48; font-size: 16px; padding-left: 2px; }
 .get-help-red:hover { color: #943A38; cursor: pointer; }
-.build-form .get-help { margin-left: 5px; }
+.build-form>i:first-of-type { margin-left: 5px; }
 .manual { margin: 11px 15px;}
 .heading-help { font-size: 14px; }
 
diff --git a/bitbake/lib/toaster/toastergui/templates/layerdetails.html b/bitbake/lib/toaster/toastergui/templates/layerdetails.html
index 6705215aae..7a1a22daa2 100644
--- a/bitbake/lib/toaster/toastergui/templates/layerdetails.html
+++ b/bitbake/lib/toaster/toastergui/templates/layerdetails.html
@@ -3,7 +3,7 @@
 {% load humanize %}
 {% load static %}
 {% block localbreadcrumb %}
-<li><a href="{% url 'layers' %}">All layers</a></li>
+<li><a href="{% url 'layers' %}">All compatible layers</a></li>
 <li>
   {{layerversion.layer.name}} ({{layerversion.commit|truncatechars:13}})
 </li>
diff --git a/bitbake/lib/toaster/toastergui/templates/layers.html b/bitbake/lib/toaster/toastergui/templates/layers.html
index 33160e5968..0943c39fde 100644
--- a/bitbake/lib/toaster/toastergui/templates/layers.html
+++ b/bitbake/lib/toaster/toastergui/templates/layers.html
@@ -3,7 +3,7 @@
 {% load humanize %}
 
 {% block localbreadcrumb %}
-<li>Layers</li>
+<li>All compatible layers</li>
 {% endblock %}
 
 {% block projectinfomain %}
@@ -14,9 +14,9 @@
   {% elif request.GET.filter and total_count ==  0 or request.GET.search and total_count == 0 %}
       No layers found
   {%else%}
-      All layers
+      All compatible layers
   {%endif%}
-                        <i class="icon-question-sign get-help heading-help" title="This page lists all the layers compatible with {{project.release.name}} that Toaster knows about."></i>
+                        <i class="icon-question-sign get-help heading-help" title="This page lists all the layers compatible with the release selected for this project, which is {{project.release.description}}"></i>
                      </h1>
                 </div>
 
diff --git a/bitbake/lib/toaster/toastergui/templates/machines.html b/bitbake/lib/toaster/toastergui/templates/machines.html
index 18e7485d50..e0bda51cf5 100644
--- a/bitbake/lib/toaster/toastergui/templates/machines.html
+++ b/bitbake/lib/toaster/toastergui/templates/machines.html
@@ -3,14 +3,14 @@
 {% load humanize %}
 
 {% block localbreadcrumb %}
-<li>Machines</li>
+<li>All compatible machines</li>
 {% endblock %}
 
 {% block projectinfomain %}
                 <div class="page-header">
                     <h1>
-                        All machines
-                        <i class="icon-question-sign get-help heading-help" title="This page lists all the machines compatible with Yocto Project 1.7 'Dxxxx' that Toaster knows about. They include community-created targets suitable for use on top of OpenEmbedded Core and any targets you have imported"></i>
+                        All compatible machines
+                        <i class="icon-question-sign get-help heading-help" title="This page lists all the machines compatible with the release selected for this project, which is {{project.release.description}}"></i>
                      </h1>
                 </div>
                 <!--div class="alert">
diff --git a/bitbake/lib/toaster/toastergui/templates/project.html b/bitbake/lib/toaster/toastergui/templates/project.html
index 3b75d1934c..2c9cd8153c 100644
--- a/bitbake/lib/toaster/toastergui/templates/project.html
+++ b/bitbake/lib/toaster/toastergui/templates/project.html
@@ -1,4 +1,4 @@
-{% extends "baseprojectpage.html" %}
+ {% extends "baseprojectpage.html" %}
 <!--
 vim: expandtab tabstop=2
 -->
@@ -98,9 +98,8 @@ vim: expandtab tabstop=2
       </div>
       <i class="icon-question-sign get-help get-help-blue" title="Type the name of one or more targets you want to build, separated by a space. You can also specify a task by appending a semicolon and a task name to a target name, like so: <code>core-image-minimal:do_build</code>"></i>
       <p>
-        <a href="{% url 'all-targets' %}">
-          View all targets
-        </a>
+        <a href="{% url 'all-targets' %}">View all compatible targets</a>
+        <i class="icon-question-sign get-help get-help-blue heading-help" title="View all the targets you can build with the release selected for this project, which is {[project.release.desc]}"></i>
         {% if completedbuilds.count %}
           | <a href="{% url 'projectbuilds' project.id %}">View all project builds ({{completedbuilds.count}})</a>
         {% endif %}
@@ -256,7 +255,7 @@ vim: expandtab tabstop=2
         <p>
         You can:
           <ul>
-            <li> <a href="{% url 'layers'%}">View all layers available in Toaster</a>
+            <li> <a href="{% url 'layers'%}">View all compatible layers available in Toaster</a>
             <li> <a href="{% url 'importlayer' %}">Import a layer</a>
             <li> <a href="https://www.yoctoproject.org/docs/1.6.1/dev-manual/dev-manual.html#understanding-and-creating-layers" target="_blank">Read about layers in the manual</a>
           </ul>
@@ -270,7 +269,11 @@ vim: expandtab tabstop=2
         </div>
         {% csrf_token %}
       </form>
-      <p><a href="{% url 'layers' %}">View all layers</a> | <a href="{% url 'importlayer' %}">Import layer</a></p>
+      <p>
+        <a href="{% url 'layers' %}">View all compatible layers</a>
+        <i class="icon-question-sign get-help" title="View all the layers you can build with the release selected for this project, which is {[project.release.desc]}"></i>
+        |
+        <a href="{% url 'importlayer' %}">Import layer</a></p>
       <ul class="unstyled configuration-list">
           <li ng-repeat="l in layers track by l.id" class="animate-repeat">
             <a href="{[l.layerdetailurl]}" target="_#" class="layer-info" data-toggle="tooltip" tooltip="{[l.giturl]} | {[l.branch.name]}">{[l.name]}</a>
@@ -295,7 +298,9 @@ vim: expandtab tabstop=2
           {% csrf_token %}
         </form>
         <p>
-          <a href="{% url 'all-targets' %}">View all targets</a></p>
+          <a href="{% url 'all-targets' %}">View all compatible targets</a>
+          <i class="icon-question-sign get-help" title="View all the targets you can build with the release selected for this project, which is {[project.release.desc]}"></i>
+        </p>
         <div ng-if="frequenttargets.length">
         <h4 class="air">
             Most built targets
@@ -332,7 +337,10 @@ vim: expandtab tabstop=2
               <input type="reset" id="cancel-machine" class="btn btn-link" ng-click="toggle('#select-machine')" value="Cancel"></input>
               {% csrf_token %}
         </form>
-        <p><a href="{% url 'machines' %}" class="link">View all machines</a></p>
+        <p>
+          <a href="{% url 'machines' %}" class="link">View all compatible machines</a>
+        <i class="icon-question-sign get-help" title="View all the machines you can set with the release selected for this project, which is {[project.release.desc]}"></i>
+      </p>
       </div>
       <p class="link-action">
             <a href="{% url 'projectconf' project.id %}" class="link">Edit configuration variables</a>
diff --git a/bitbake/lib/toaster/toastergui/templates/targets.html b/bitbake/lib/toaster/toastergui/templates/targets.html
index 3038649303..32c67ea881 100644
--- a/bitbake/lib/toaster/toastergui/templates/targets.html
+++ b/bitbake/lib/toaster/toastergui/templates/targets.html
@@ -3,7 +3,7 @@
 {% load humanize %}
 
 {% block localbreadcrumb %}
-<li>Targets</li>
+<li>All compatible targets</li>
 {% endblock %}
 
 {% block projectinfomain %}
@@ -14,9 +14,9 @@
   {% elif request.GET.filter and objects.paginator.count ==  0 or request.GET.search and objects.paginator.count == 0 %}
       No targets found
   {%else%}
-      All targets
+      All compatible targets
   {%endif%}
-                        <i class="icon-question-sign get-help heading-help" title="This page lists all the targets compatible with " + {{project.release.name}} + " that Toaster knows about."></i>
+                        <i class="icon-question-sign get-help heading-help" title="This page lists all the targets compatible with the release selected for this project, which is {{project.release.description}}"></i>
                      </h1>
                 </div>