Skip to content

Commit 43bef11

Browse files
Fix: System-message and shutdown message render fix in new-dashboard-view
1 parent 2b18b7c commit 43bef11

File tree

6 files changed

+110
-52
lines changed

6 files changed

+110
-52
lines changed

core/src/main/resources/hudson/model/View/index.jelly

Lines changed: 0 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -39,38 +39,6 @@ THE SOFTWARE.
3939
<st:include page="view-index-top.jelly" it="${it.owner}" optional="true">
4040
<!-- allow the owner to take over the top section, but we also need the default to be backward compatible -->
4141
<div id="view-message">
42-
<j:if test="${app.systemMessage!=null}">
43-
<j:set var="severity" value="${app.systemMessageSeverity}"/>
44-
45-
<div class="system-message system-message--${severity.toLowerCase()}" id="systemmessage">
46-
<div class="system-message__icon">
47-
<j:choose>
48-
<j:when test="${severity == 'INFO'}">
49-
<l:icon src="symbol-information-circle"/>
50-
</j:when>
51-
<j:when test="${severity == 'WARNING'}">
52-
<l:icon src="symbol-warning-outline"/>
53-
</j:when>
54-
<j:when test="${severity == 'DANGER'}">
55-
<l:icon src="symbol-close-circle"/>
56-
</j:when>
57-
<j:when test="${severity == 'SUCCESS'}">
58-
<l:icon src="symbol-check"/>
59-
</j:when>
60-
<j:when test="${severity == 'MAINTENANCE'}">
61-
<l:icon src="symbol-construct-outline"/>
62-
</j:when>
63-
<j:otherwise>
64-
<l:icon src="symbol-information-circle"/>
65-
</j:otherwise>
66-
</j:choose>
67-
</div>
68-
69-
<div class="system-message__content">
70-
<j:out value="${app.markupFormatter.translate(app.systemMessage)}" />
71-
</div>
72-
</div>
73-
</j:if>
7442
<t:editableDescription permission="${it.CONFIGURE}"/>
7543
</div>
7644
</st:include>

core/src/main/resources/hudson/model/View/new-view-page.jelly

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -134,9 +134,10 @@ THE SOFTWARE.
134134
</div>
135135
</div>
136136

137-
<div class="app-build-content" style="padding-top: var(--section-padding)">
138-
<t:editableDescription permission="${it.CONFIGURE}" hideButton="true" />
139-
137+
<div class="app-build-content">
138+
<j:if test="${it.description != null and !it.description.trim().isEmpty()}">
139+
<t:editableDescription permission="${it.CONFIGURE}" hideButton="true" />
140+
</j:if>
140141
<j:set var="items" value="${it.items}"/>
141142
<st:include page="main.jelly" />
142143
</div>

core/src/main/resources/lib/layout/layout.jelly

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -168,7 +168,6 @@ THE SOFTWARE.
168168
searchHelpUrl="${%searchBox.url}"
169169
logout="${%logout}"/>
170170
</j:if>
171-
172171
<div id="page-body" class="app-page-body app-page-body--${layoutType} clear">
173172
<j:if test="${layoutType=='two-column'}">
174173
<j:set var="mode" value="side-panel" />

core/src/main/resources/lib/layout/main-panel.jelly

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ THE SOFTWARE.
2323
-->
2424

2525
<?jelly escape-by-default='true'?>
26-
<j:jelly xmlns:j="jelly:core" xmlns:x="jelly:xml" xmlns:st="jelly:stapler" xmlns:d="jelly:define">
26+
<j:jelly xmlns:j="jelly:core" xmlns:x="jelly:xml" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout">
2727
<st:documentation>
2828
Generates the body as the main content part of a Jenkins page.
2929
</st:documentation>
@@ -57,6 +57,38 @@ THE SOFTWARE.
5757
</j:otherwise>
5858
</j:choose>
5959
</j:if>
60+
<j:if test="${app.systemMessage!=null}">
61+
<j:set var="severity" value="${app.systemMessageSeverity}"/>
62+
63+
<div class="system-message system-message--${severity.toLowerCase()}" id="systemmessage">
64+
<div class="system-message__icon">
65+
<j:choose>
66+
<j:when test="${severity == 'INFO'}">
67+
<l:icon src="symbol-information-circle"/>
68+
</j:when>
69+
<j:when test="${severity == 'WARNING'}">
70+
<l:icon src="symbol-warning-outline"/>
71+
</j:when>
72+
<j:when test="${severity == 'DANGER'}">
73+
<l:icon src="symbol-close-circle"/>
74+
</j:when>
75+
<j:when test="${severity == 'SUCCESS'}">
76+
<l:icon src="symbol-check"/>
77+
</j:when>
78+
<j:when test="${severity == 'MAINTENANCE'}">
79+
<l:icon src="symbol-construct-outline"/>
80+
</j:when>
81+
<j:otherwise>
82+
<l:icon src="symbol-information-circle"/>
83+
</j:otherwise>
84+
</j:choose>
85+
</div>
86+
87+
<div class="system-message__content">
88+
<j:out value="${app.markupFormatter.translate(app.systemMessage)}" />
89+
</div>
90+
</div>
91+
</j:if>
6092
<a id="skip2content" />
6193
<x:comment>&#10;start of main content ⇒&#10;</x:comment>
6294
<d:invokeBody />

src/main/scss/components/_system-message.scss

Lines changed: 28 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,44 @@
11
// System message styling for different severity levels
22
.system-message {
3-
display: flex;
4-
align-items: flex-start;
3+
flex-direction: row;
4+
display: flex !important;
5+
align-items: center;
56
gap: 0.75rem;
6-
padding: 1rem;
7-
margin-bottom: 1rem;
8-
border-radius: 0.375rem;
9-
border-left: 4px solid;
7+
padding: 1.25rem 1.75rem;
8+
margin-bottom: 1.25rem;
9+
border: 2.5px solid;
10+
border-radius: var(--form-input-border-radius);
11+
12+
&:last-child {
13+
margin-bottom: 0;
14+
}
1015

1116
&__icon {
1217
flex-shrink: 0;
1318
width: 1.25rem;
1419
height: 1.25rem;
15-
margin-top: 0.125rem;
20+
display: flex;
21+
align-items: center;
22+
justify-content: center;
23+
24+
svg {
25+
display: block;
26+
}
1627
}
1728

1829
&__content {
1930
flex: 1;
20-
min-width: 0;
31+
min-width: 0;
32+
33+
p {
34+
margin: 0;
35+
}
2136
}
2237

2338
// Different colors for each severity type
2439
&--info {
2540
background-color: var(--alert-info-bg-color);
26-
border-left-color: var(--info-color);
41+
border: 2.5px solid #e4effd;
2742
color: var(--alert-info-text-color);
2843

2944
.system-message__icon {
@@ -33,7 +48,7 @@
3348

3449
&--warning {
3550
background-color: var(--alert-warning-bg-color);
36-
border-left-color: var(--warning-color);
51+
border: 2.5px solid #f6d9c3;
3752
color: var(--alert-warning-text-color);
3853

3954
.system-message__icon {
@@ -43,7 +58,7 @@
4358

4459
&--danger {
4560
background-color: color-mix(in sRGB, var(--danger-color) 10%, transparent);
46-
border-left-color: var(--danger-color);
61+
border: 2.5px solid #ffc9c9;
4762
color: var(--danger-color);
4863

4964
.system-message__icon {
@@ -53,7 +68,7 @@
5368

5469
&--success {
5570
background-color: var(--alert-success-bg-color);
56-
border-left-color: var(--success-color);
71+
border: 2.5px solid #c0f6d6;
5772
color: var(--alert-success-text-color);
5873

5974
.system-message__icon {
@@ -63,7 +78,7 @@
6378

6479
&--maintenance {
6580
background-color: color-mix(in sRGB, var(--orange) 10%, transparent);
66-
border-left-color: var(--orange);
81+
border: 2.5px solid rgba(255, 202, 160, 1); //ffdabf
6782
color: color-mix(in sRGB, var(--orange) 80%, var(--text-color));
6883

6984
.system-message__icon {

src/main/scss/pages/_dashboard.scss

Lines changed: 45 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -98,14 +98,16 @@ $min-button-size: 2.375rem;
9898
grid-template-columns: auto 1fr;
9999
gap: 1rem;
100100
text-decoration: none !important;
101-
overflow: hidden;
101+
overflow-x: hidden;
102+
overflow-y: visible;
102103
}
103104

104105
&__details__text {
105106
display: flex;
106107
flex-direction: column;
107108
gap: 0.5rem;
108-
overflow: hidden;
109+
overflow-x: hidden;
110+
overflow-y: visible;
109111
}
110112

111113
&__actions {
@@ -210,3 +212,44 @@ div.listview-jobs {
210212
flex-direction: column;
211213
}
212214
}
215+
216+
#main-panel {
217+
padding-top: .75rem;
218+
}
219+
220+
.app-build-bar {
221+
padding-bottom: 1rem;
222+
}
223+
224+
.app-build-content {
225+
padding-top: 1rem;
226+
}
227+
228+
.app-build-content > *:first-child {
229+
margin-top: 1rem;
230+
}
231+
232+
/* System and shutdown messages styling */
233+
#main-panel #shutdown-msg,
234+
#main-panel #safe-restart-msg {
235+
position: relative;
236+
z-index: 150;
237+
display: block;
238+
visibility: visible;
239+
margin: 1.25rem var(--section-padding);
240+
padding: 1.25rem 1.75rem;
241+
border-radius: var(--form-input-border-radius);
242+
background: var(--alert-danger-bg, #ff0000);
243+
border: 1px solid var(--alert-danger-border, #f1f1f1);
244+
color: var(--alert-danger-text, #721c24);
245+
}
246+
247+
:where(#main-panel) :where(.alert, .jenkins-alert, [class*="message"])
248+
{
249+
position: relative;
250+
z-index: 150;
251+
display: block;
252+
visibility: visible;
253+
overflow: visible;
254+
max-height: none;
255+
}

0 commit comments

Comments
 (0)