Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[JENKINS-65124] Update weather icons #7208

Merged
merged 14 commits into from
Oct 19, 2022
Merged

[JENKINS-65124] Update weather icons #7208

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
8dfbb9a
Squashed commit of the following:
janfaracik Oct 3, 2022
e6a98c5
Remove icon legend hover description
janfaracik Oct 3, 2022
bdd6491
Merge branch 'master' into update-weather-icons
janfaracik Oct 5, 2022
66e57ae
Update thunder icon
janfaracik Oct 5, 2022
2d338f0
Add new icons to icon translation method + remove old icon stylings
janfaracik Oct 5, 2022
279cae4
Fix status icon offset
janfaracik Oct 5, 2022
d5a3646
Update table.less
janfaracik Oct 5, 2022
cfe7ff5
Fix tooltip table cell being incorrectly positioned
janfaracik Oct 5, 2022
24e6d82
Small tweak to icons
janfaracik Oct 5, 2022
d306dde
Update outline of build status icons
janfaracik Oct 13, 2022
9378f60
Update build-status-sprite.svg
janfaracik Oct 13, 2022
de78990
Update build-status-sprite.svg
janfaracik Oct 13, 2022
b855f58
Merge branch 'master' into update-weather-icons
timja Oct 17, 2022
5b5a8c3
Update core/src/main/resources/jenkins/model/Jenkins/legend.jelly
timja Oct 18, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions core/src/main/java/org/jenkins/ui/icon/IconSet.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -582,6 +582,11 @@ private static void initializeSVGs() {
translations.put("icon-folder", "symbol-folder");
translations.put("icon-gear", "symbol-settings");
translations.put("icon-gear2", "symbol-settings");
translations.put("icon-health-00to19", "symbol-weather-icon-health-00to19");
translations.put("icon-health-20to39", "symbol-weather-icon-health-20to39");
translations.put("icon-health-40to59", "symbol-weather-icon-health-40to59");
translations.put("icon-health-60to79", "symbol-weather-icon-health-60to79");
translations.put("icon-health-80plus", "symbol-weather-icon-health-80plus");
translations.put("icon-help", "symbol-help-circle");
translations.put("icon-keys", "symbol-key");
translations.put("icon-monitor", "symbol-terminal");
Expand Down
166 changes: 111 additions & 55 deletions core/src/main/resources/jenkins/model/Jenkins/legend.jelly
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,82 +26,138 @@ THE SOFTWARE.
<!-- show the icon legend -->
<?jelly escape-by-default='true'?>
<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout" xmlns:t="/lib/hudson" xmlns:s="/lib/form">
<l:layout>
<st:include page="sidepanel.jelly" />
<l:layout title="${%Icon legend}">
<l:app-bar title="${title}" />

<st:include page="sidepanel.jelly"/>

<l:main-panel>
<table cellpadding="5" id="legend-table">
<tr><td>
<h2>${%Status}</h2>

<dl class="app-icon-legend">
<dt>
<l:icon class="icon-blue icon-xlg"/>
</dt>
<dd>
${%blue}
</dd>

<dt>
<l:icon class="icon-blue-anime icon-xlg"/>
</dt>
<dd>
${%blue_anime}
</dd>

<dt>
<l:icon class="icon-yellow icon-xlg"/>
</dt>
<dd>
${%yellow}
</dd>

<dt>
<l:icon class="icon-yellow-anime icon-xlg"/>
</dt>
<dd>
${%yellow_anime}
</dd>

<dt>
<l:icon class="icon-red icon-xlg"/>
</dt>
<dd>
${%red}
</dd>

<dt>
<l:icon class="icon-red-anime icon-xlg"/>
</dt>
<dd>
${%red_anime}
</dd>

<dt>
<l:icon class="icon-nobuilt icon-xlg"/>
</dt>
<dd>
${%lightgrey}
</td></tr>
<tr><td>
</dd>

<dt>
<l:icon class="icon-nobuilt-anime icon-xlg"/>
</dt>
<dd>
${%lightgrey_anime}
</td></tr>
</dd>

<tr><td>
<dt>
<l:icon class="icon-disabled icon-xlg"/>
</dt>
<dd>
${%grey}
</td></tr>
<tr><td>
</dd>

<dt>
<l:icon class="icon-disabled-anime icon-xlg"/>
</dt>
<dd>
${%grey_anime}
</td></tr>
</dd>

<tr><td>
<dt>
<l:icon class="icon-aborted icon-xlg"/>
</dt>
<dd>
${%darkgrey}
</td></tr>
<tr><td>
</dd>

<dt>
<l:icon class="icon-aborted-anime icon-xlg"/>
</dt>
<dd>
${%darkgrey_anime}
</td></tr>
</dd>
</dl>

<tr><td>
<l:icon class="icon-blue icon-xlg"/>
${%blue}
</td></tr>
<tr><td>
<l:icon class="icon-blue-anime icon-xlg"/>
${%blue_anime}
</td></tr>
<tr><td>
<l:icon class="icon-yellow icon-xlg"/>
${%yellow}
</td></tr>
<tr><td>
<l:icon class="icon-yellow-anime icon-xlg"/>
${%yellow_anime}
</td></tr>
<tr><td>
<l:icon class="icon-red icon-xlg"/>
${%red}
</td></tr>
<tr><td>
<l:icon class="icon-red-anime icon-xlg"/>
${%red_anime}
</td></tr>
<tr><td>
<l:icon class="icon-health-80plus icon-xlg"/>
<h2>${%Project Health}</h2>

<dl class="app-icon-legend">
<dt>
<l:icon src="symbol-weather-icon-health-80plus" />
</dt>
<dd>
${%health-81plus}
</td></tr>
<tr><td>
<l:icon class="icon-health-60to79 icon-xlg"/>
</dd>

<dt>
<l:icon src="symbol-weather-icon-health-60to79" />
</dt>
<dd>
${%health-61to80}
</td></tr>
<tr><td>
<l:icon class="icon-health-40to59 icon-xlg"/>
</dd>

<dt>
<l:icon src="symbol-weather-icon-health-40to59" />
</dt>
<dd>
${%health-41to60}
</td></tr>
<tr><td>
<l:icon class="icon-health-20to39 icon-xlg"/>
</dd>

<dt>
<l:icon src="symbol-weather-icon-health-20to39" />
</dt>
<dd>
${%health-21to40}
</td></tr>
<tr><td>
<l:icon class="icon-health-00to19 icon-xlg"/>
</dd>

<dt>
<l:icon src="symbol-weather-icon-health-00to19" />
</dt>
<dd>
${%health-00to20}
</td></tr>
</table>
</dd>
</dl>
</l:main-panel>
</l:layout>
</j:jelly>
11 changes: 5 additions & 6 deletions core/src/main/resources/jenkins/model/Jenkins/legend.properties
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,8 @@ yellow=The last build was successful but unstable. \
yellow_anime=The last build was successful but unstable. A new build is in progress.
red=The last build failed.
red_anime=The last build failed. A new build is in progress.
health-81plus=Project health is over 80%. You can hover the mouse over the project’s icon for a more detailed explanation.
health-61to80=Project health is over 60% and up to 80%. You can hover the mouse over the project’s icon for a more detailed explanation.
health-41to60=Project health is over 40% and up to 60%. You can hover the mouse over the project’s icon for a more detailed explanation.
health-21to40=Project health is over 20% and up to 40%. You can hover the mouse over the project’s icon for a more detailed explanation.
health-00to20=Project health is 20% or less. You can hover the mouse over the project’s icon for a more detailed explanation.

health-81plus=Project health is over 80%
health-61to80=Project health is over 60% and up to 80%
health-41to60=Project health is over 40% and up to 60%
health-21to40=Project health is over 20% and up to 40%
health-00to20=Project health is 20% or less
104 changes: 48 additions & 56 deletions core/src/main/resources/lib/hudson/buildHealth.jelly
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,60 +31,52 @@ THE SOFTWARE.
-->
<?jelly escape-by-default='true'?>
<j:jelly xmlns:j="jelly:core" xmlns:x="jelly:xml" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout" xmlns:t="/lib/hudson" xmlns:f="/lib/form">
<j:set var="healthReports" value="${job.buildHealthReports}"/>
<j:new var="emptyHealthReport" className="hudson.model.HealthReport"/>
<j:set var="buildHealth" value="${empty(healthReports) ? emptyHealthReport : healthReports[0]}"/>
<j:if test="${td}"><j:set var="useTdElement" value="x"/></j:if>
<x:element name="${useTdElement!=null?'td':'div'}">
<x:attribute name="data">${buildHealth.score}</x:attribute>
<x:attribute name="class">jenkins-table__cell--tight jenkins-table__icon healthReport</x:attribute>
<j:if test="${buildHealth!=null}">
<div class="jenkins-table__cell__button-wrapper">
<j:if test="${iconSizeClass == null}">
<j:choose>
<j:when test="${iconSize == null}">
<j:set var="iconSizeClass" value="icon-sm"/>
</j:when>
<j:otherwise>
<j:set var="iconSizeClass" value="${icons.toNormalizedIconSizeClass(iconSize)}"/>
</j:otherwise>
</j:choose>
</j:if>
<j:choose>
<j:when test="${!empty(healthReports)}">
<a class="build-health-link jenkins-table__button" href="${empty(link)?'#':link}" style="${attrs.style}">
<l:svgIcon href="${resURL}/images/${icons.getIconByClassSpec(buildHealth.iconClassName + ' icon-md').url}" ariaHidden="true"/>
</a>
</j:when>
<j:otherwise>
<l:svgIcon href="${resURL}/images/${icons.getIconByClassSpec(buildHealth.iconClassName + ' icon-md').url}"/>
</j:otherwise>
</j:choose>
</div>
</j:if>
<j:if test="${!empty(healthReports)}">
<div class="jenkins-tooltip healthReportDetails">
<table class="jenkins-table">
<thead>
<tr>
<th align="left">W</th>
<th align="left">${%Description}</th>
<th align="right">%</th>
</tr>
</thead>
<tbody>
<j:forEach var="rpt" items="${healthReports}">
<tr>
<td align="left">
<l:icon class="${rpt.iconClassName} icon-sm" />
</td>
<td align="left">${rpt.localizableDescription}</td>
<td align="right">${rpt.score}</td>
</tr>
</j:forEach>
</tbody>
</table>
</div>
</j:if>
</x:element>
<j:set var="healthReports" value="${job.buildHealthReports}"/>
<j:new var="emptyHealthReport" className="hudson.model.HealthReport"/>
<j:set var="buildHealth" value="${empty(healthReports) ? emptyHealthReport : healthReports[0]}"/>
<j:if test="${td}"><j:set var="useTdElement" value="x"/></j:if>
<x:element name="${useTdElement!=null?'td':'div'}">
<x:attribute name="data">${buildHealth.score}</x:attribute>
<x:attribute name="class">jenkins-table__cell--tight jenkins-table__icon healthReport</x:attribute>
<j:if test="${buildHealth!=null}">
<div class="jenkins-table__cell__button-wrapper">
<j:choose>
<j:when test="${!empty(healthReports)}">
<a class="build-health-link jenkins-table__button" href="${empty(link)?'#':link}" style="${attrs.style}">
<l:icon src="symbol-weather-${buildHealth.iconClassName}" />
</a>
</j:when>
<j:otherwise>
<l:icon src="symbol-weather-${buildHealth.iconClassName}" tooltip="${buildHealth.score}%" />
</j:otherwise>
</j:choose>
</div>
</j:if>
<j:if test="${!empty(healthReports)}">
<div class="jenkins-tooltip healthReportDetails">
<table class="jenkins-table">
<thead>
<tr>
<th class="jenkins-!-padding-left-0" align="center">W</th>
<th align="left">${%Description}</th>
<th align="right">%</th>
</tr>
</thead>
<tbody>
<j:forEach var="rpt" items="${healthReports}">
<tr>
<td align="left" class="jenkins-table__cell--tight jenkins-table__icon">
<div class="jenkins-table__cell__button-wrapper">
<l:icon src="symbol-weather-${buildHealth.iconClassName}" />
</div>
</td>
<td align="left">${rpt.localizableDescription}</td>
<td align="right">${rpt.score}</td>
</tr>
</j:forEach>
</tbody>
</table>
</div>
</j:if>
</x:element>
</j:jelly>
2 changes: 1 addition & 1 deletion war/src/main/less/abstracts/theme.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -346,7 +346,7 @@
pink: #fb0f45;
purple: #af52de;
red: #e6001f;
yellow: #fc0;
yellow: #ffb31a;
}

@semantics: {
Expand Down
5 changes: 0 additions & 5 deletions war/src/main/less/base/style.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1421,11 +1421,6 @@ td.matrix-cell {
text-align: center;
}

/* ========================= legend.jelly ================== */
table#legend-table td {
vertical-align: middle;
}

/* ========================= select.jelly ================== */
select.select-ajax-pending {
padding-left: 1.5em;
Expand Down
5 changes: 0 additions & 5 deletions war/src/main/less/modules/icons.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,11 +85,6 @@
.status-icon-color(var(--primary));
}

[class*="icon-health-"] {
color: var(--weather-icon-color);
fill: var(--weather-icon-color);
}

.build-status-icon__wrapper {
display: inline-flex;
position: relative;
Expand Down
Loading