Various dark mode bug

Fix issue #553 - Dark mode of burndown chart is incorrect
Fix issue #555 - Dark mode of statistics of various report is incorrect
This commit is contained in:
Robin Shen 2022-02-10 20:38:50 +08:00
parent 5066833f29
commit cc07c33bda
7 changed files with 59 additions and 26 deletions

View File

@ -1258,10 +1258,14 @@ public class DefaultJobManager implements JobManager, Runnable, CodePullAuthoriz
VariableInterpolator interpolator = new VariableInterpolator(build, build.getParamCombination());
Map<String, String> placeholderValues = new HashMap<>();
placeholderValues.put(BUILD_VERSION, build.getVersion());
for (PostBuildAction action: build.getJob().getPostBuildActions()) {
action = interpolator.interpolateProperties(action);
if (ActionCondition.parse(build.getJob(), action.getCondition()).matches(build))
action.execute(build);
if (build.getJob() != null) {
for (PostBuildAction action: build.getJob().getPostBuildActions()) {
action = interpolator.interpolateProperties(action);
if (ActionCondition.parse(build.getJob(), action.getCondition()).matches(build))
action.execute(build);
}
} else {
throw new ExplicitException("Job not found");
}
} catch (Throwable e) {
String message = String.format("Error processing post build actions (project: %s, commit: %s, job: %s)",

View File

@ -2591,8 +2591,8 @@ h6, .h6 {
box-shadow: 0px 0px 8px 2px rgba(0,0,0,0.1);
}
.dark-mode .popover {
background-color: var(--dark-mode-dark);
border-color: var(--dark-mode-dark);
background-color: var(--dark-mode-light-dark);
border-color: var(--dark-mode-lighter-dark);
box-shadow: 0 0 30px rgb(0 0 0 / 50%);
}
.bs-popover-auto[x-placement^=right]>.arrow::before, .bs-popover-right>.arrow::before {
@ -2609,28 +2609,28 @@ h6, .h6 {
}
.dark-mode .bs-popover-auto[x-placement^=right]>.arrow::before, .dark-mode .bs-popover-right>.arrow::before {
border-right-color: var(--dark-mode-dark);
border-right-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=left]>.arrow::before, .dark-mode .bs-popover-left>.arrow::before {
border-left-color: var(--dark-mode-dark);
border-left-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=top]>.arrow::before, .dark-mode .bs-popover-top>.arrow::before {
border-top-color: var(--dark-mode-dark);
border-top-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=bottom]>.arrow::before, .dark-mode .bs-popover-bottom>.arrow::before {
border-bottom-color: var(--dark-mode-dark);
border-bottom-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=right]>.arrow::after, .dark-mode .bs-popover-right>.arrow::after {
border-right-color: var(--dark-mode-dark);
border-right-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=left]>.arrow::after, .dark-mode .bs-popover-left>.arrow::after {
border-left-color: var(--dark-mode-dark);
border-left-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=top]>.arrow::after, .dark-mode .bs-popover-top>.arrow::after {
border-top-color: var(--dark-mode-dark);
border-top-color: var(--dark-mode-lighter-dark);
}
.dark-mode .bs-popover-auto[x-placement^=bottom]>.arrow::after, .dark-mode .bs-popover-bottom>.arrow::after {
border-bottom-color: var(--dark-mode-dark);
border-bottom-color: var(--dark-mode-lighter-dark);
}
.popover-header {
@ -2643,7 +2643,7 @@ h6, .h6 {
}
.dark-mode .popover-header {
color: var(--light);
background-color: var(--dark-mode-dark);
background-color: var(--dark-mode-light-dark);
border-bottom-color: var(--dark-mode-lighter-dark);
}
.popover-body {

View File

@ -12,6 +12,7 @@ import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import io.onedev.server.OneDev;
import io.onedev.server.web.page.base.BasePage;
@SuppressWarnings("serial")
public class LineChartPanel extends GenericPanel<LineSeries> {
@ -33,9 +34,10 @@ public class LineChartPanel extends GenericPanel<LineSeries> {
try {
ObjectMapper mapper = OneDev.getInstance(ObjectMapper.class);
String script = String.format("onedev.server.lineChart.onDomReady('%s', %s, %s);",
BasePage page = (BasePage) getPage();
String script = String.format("onedev.server.lineChart.onDomReady('%s', %s, %s, %b);",
getMarkupId(true), mapper.writeValueAsString(getSeries()),
getSeries().getYAxisValueFormatter());
getSeries().getYAxisValueFormatter(), page.isDarkMode());
response.render(OnDomReadyHeaderItem.forScript(script));
} catch (JsonProcessingException e) {
throw new RuntimeException(e);

View File

@ -1,5 +1,5 @@
onedev.server.lineChart = {
onDomReady: function(containerId, lineSeries, yAxisValueFormatter) {
onDomReady: function(containerId, lineSeries, yAxisValueFormatter, darkMode) {
var $chart = $("#" + containerId + ">.line-chart");
if (lineSeries) {
@ -7,14 +7,25 @@ onedev.server.lineChart = {
option = {
xAxis: {
type: 'category',
data: []
data: [],
axisLabel: {
color: darkMode?'#cdcdde':'#3F4254'
}
},
yAxis: {
type: 'value',
minInterval: 1,
splitLine: {
lineStyle: {
color: darkMode?'#535370':'#E4E6EF'
}
},
axisLine: {
show:false
},
axisLabel: {
color: darkMode?'#cdcdde':'#3F4254'
},
},
tooltip: {
trigger: 'axis'
@ -25,7 +36,10 @@ onedev.server.lineChart = {
option.legend = {
show: true,
x: "center",
data: []
data: [],
textStyle: {
color: darkMode?'#cdcdde':'#3F4254'
}
}
for (const i in lineSeries.lines)
option.legend.data.push(lineSeries.lines[i].name);
@ -35,7 +49,10 @@ onedev.server.lineChart = {
}
option.title = {
text: lineSeries.seriesName,
left: 'center'
left: 'center',
textStyle: {
color: darkMode?'#cdcdde':'#3F4254'
}
}
option.legend.top = 30;
}
@ -45,7 +62,10 @@ onedev.server.lineChart = {
title = lineSeries.seriesName + " / " + title;
option.title = {
text: title,
left: 'center'
left: 'center',
textStyle: {
color: darkMode?'#cdcdde':'#3F4254'
}
}
}

View File

@ -18,6 +18,7 @@ import com.fasterxml.jackson.databind.ObjectMapper;
import io.onedev.server.OneDev;
import io.onedev.server.web.behavior.AbstractPostAjaxBehavior;
import io.onedev.server.web.page.base.BasePage;
@SuppressWarnings("serial")
public abstract class PieChartPanel extends GenericPanel<List<PieSlice>> {
@ -63,10 +64,11 @@ public abstract class PieChartPanel extends GenericPanel<List<PieSlice>> {
throw new RuntimeException(e);
}
BasePage page = (BasePage) getPage();
CallbackParameter param = CallbackParameter.explicit("sliceName");
String callback = selectionBehavior.getCallbackFunction(param).toString();
String script = String.format("onedev.server.pieChart.onDomReady('%s', %s, %s);",
getMarkupId(true), jsonOfSlices, callback);
String script = String.format("onedev.server.pieChart.onDomReady('%s', %s, %s, %b);",
getMarkupId(true), jsonOfSlices, callback, page.isDarkMode());
response.render(OnDomReadyHeaderItem.forScript(script));
}

View File

@ -1,5 +1,5 @@
onedev.server.pieChart = {
onDomReady: function(containerId, pieSlices, selectionCallback) {
onDomReady: function(containerId, pieSlices, selectionCallback, darkMode) {
var $chart = $("#" + containerId + ">.pie-chart");
if (pieSlices) {
var chart = echarts.init($chart[0]);
@ -35,6 +35,9 @@ onedev.server.pieChart = {
}
return `${name} ${value}`;
},
textStyle: {
color: darkMode?'#cdcdde':'#3F4254'
}
},
series: [{
type: "pie",

View File

@ -231,7 +231,9 @@ public class MilestoneBurndownPage extends MilestoneDetailPage {
guidelineYAxisValues.put(xAxisValues.get(0), initialIssueWeight);
guidelineYAxisValues.put(xAxisValues.get(xAxisValues.size()-1), 0);
}
lines.add(new Line("Guide Line", guidelineYAxisValues, "black", null, "dashed"));
String color = isDarkMode()?"white":"black";
lines.add(new Line("Guide Line", guidelineYAxisValues, color, null, "dashed"));
String yAxisValueFormatter;
if (field != null && getIssueSetting().getFieldSpec(field) instanceof WorkingPeriodField) {