mirror of
https://github.com/hkalexling/Mango.git
synced 2025-08-02 10:55:30 -04:00
Add color to labels in dark mode (#70)
This commit is contained in:
parent
b70fad13a7
commit
ef0e3fd346
1
.gitignore
vendored
1
.gitignore
vendored
@ -9,3 +9,4 @@ dist
|
||||
mango
|
||||
.env
|
||||
*.md
|
||||
public/css/uikit.css
|
||||
|
@ -1,6 +1,7 @@
|
||||
const gulp = require('gulp');
|
||||
const minify = require("gulp-babel-minify");
|
||||
const minifyCss = require('gulp-minify-css');
|
||||
const less = require('gulp-less');
|
||||
|
||||
gulp.task('minify-js', () => {
|
||||
return gulp.src('public/js/*.js')
|
||||
@ -10,6 +11,12 @@ gulp.task('minify-js', () => {
|
||||
.pipe(gulp.dest('dist/js'));
|
||||
});
|
||||
|
||||
gulp.task('less', () => {
|
||||
return gulp.src('src/assets/*.less')
|
||||
.pipe(less())
|
||||
.pipe(gulp.dest('public/css'));
|
||||
});
|
||||
|
||||
gulp.task('minify-css', () => {
|
||||
return gulp.src('public/css/*.css')
|
||||
.pipe(minifyCss())
|
||||
@ -26,4 +33,4 @@ gulp.task('favicon', () => {
|
||||
.pipe(gulp.dest('dist'));
|
||||
});
|
||||
|
||||
gulp.task('default', gulp.parallel('minify-js', 'minify-css', 'img', 'favicon'));
|
||||
gulp.task('default', gulp.parallel('minify-js', gulp.series('less', 'minify-css'), 'img', 'favicon'));
|
||||
|
@ -8,9 +8,14 @@
|
||||
"devDependencies": {
|
||||
"gulp": "^4.0.2",
|
||||
"gulp-babel-minify": "^0.5.1",
|
||||
"gulp-minify-css": "^1.2.4"
|
||||
"gulp-less": "^4.0.1",
|
||||
"gulp-minify-css": "^1.2.4",
|
||||
"less": "^3.11.3"
|
||||
},
|
||||
"scripts": {
|
||||
"uglify": "gulp"
|
||||
},
|
||||
"dependencies": {
|
||||
"uikit": "^3.5.4"
|
||||
}
|
||||
}
|
||||
|
@ -24,44 +24,48 @@ const loadConfig = () => {
|
||||
const remove = (id) => {
|
||||
var url = base_url + 'api/admin/mangadex/queue/delete';
|
||||
if (id !== undefined)
|
||||
url += '?' + $.param({id: id});
|
||||
url += '?' + $.param({
|
||||
id: id
|
||||
});
|
||||
console.log(url);
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: url,
|
||||
dataType: 'json'
|
||||
})
|
||||
.done(data => {
|
||||
if (!data.success && data.error) {
|
||||
alert('danger', `Failed to remove job from download queue. Error: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
load();
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to remove job from download queue. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
});
|
||||
type: 'POST',
|
||||
url: url,
|
||||
dataType: 'json'
|
||||
})
|
||||
.done(data => {
|
||||
if (!data.success && data.error) {
|
||||
alert('danger', `Failed to remove job from download queue. Error: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
load();
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to remove job from download queue. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
});
|
||||
};
|
||||
const refresh = (id) => {
|
||||
var url = base_url + 'api/admin/mangadex/queue/retry';
|
||||
if (id !== undefined)
|
||||
url += '?' + $.param({id: id});
|
||||
url += '?' + $.param({
|
||||
id: id
|
||||
});
|
||||
console.log(url);
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: url,
|
||||
dataType: 'json'
|
||||
})
|
||||
.done(data => {
|
||||
if (!data.success && data.error) {
|
||||
alert('danger', `Failed to restart download job. Error: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
load();
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to restart download job. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
});
|
||||
type: 'POST',
|
||||
url: url,
|
||||
dataType: 'json'
|
||||
})
|
||||
.done(data => {
|
||||
if (!data.success && data.error) {
|
||||
alert('danger', `Failed to restart download job. Error: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
load();
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to restart download job. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
});
|
||||
};
|
||||
const toggle = () => {
|
||||
$('#pause-resume-btn').attr('disabled', '');
|
||||
@ -69,50 +73,52 @@ const toggle = () => {
|
||||
const action = paused ? 'resume' : 'pause';
|
||||
const url = `${base_url}api/admin/mangadex/queue/${action}`;
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: url,
|
||||
dataType: 'json'
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to ${action} download queue. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
})
|
||||
.always(() => {
|
||||
load();
|
||||
$('#pause-resume-btn').removeAttr('disabled');
|
||||
});
|
||||
type: 'POST',
|
||||
url: url,
|
||||
dataType: 'json'
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to ${action} download queue. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
})
|
||||
.always(() => {
|
||||
load();
|
||||
$('#pause-resume-btn').removeAttr('disabled');
|
||||
});
|
||||
};
|
||||
const load = () => {
|
||||
if (loading) return;
|
||||
loading = true;
|
||||
console.log('fetching');
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: base_url + 'api/admin/mangadex/queue',
|
||||
dataType: 'json'
|
||||
})
|
||||
.done(data => {
|
||||
if (!data.success && data.error) {
|
||||
alert('danger', `Failed to fetch download queue. Error: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
console.log(data);
|
||||
const btnText = data.paused ? "Resume download" : "Pause download";
|
||||
$('#pause-resume-btn').text(btnText);
|
||||
$('#pause-resume-btn').removeAttr('hidden');
|
||||
const rows = data.jobs.map(obj => {
|
||||
var cls = 'uk-label ';
|
||||
if (obj.status === 'Completed')
|
||||
cls += 'uk-label-success';
|
||||
if (obj.status === 'Error')
|
||||
cls += 'uk-label-danger';
|
||||
if (obj.status === 'MissingPages')
|
||||
cls += 'uk-label-warning';
|
||||
type: 'GET',
|
||||
url: base_url + 'api/admin/mangadex/queue',
|
||||
dataType: 'json'
|
||||
})
|
||||
.done(data => {
|
||||
if (!data.success && data.error) {
|
||||
alert('danger', `Failed to fetch download queue. Error: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
console.log(data);
|
||||
const btnText = data.paused ? "Resume download" : "Pause download";
|
||||
$('#pause-resume-btn').text(btnText);
|
||||
$('#pause-resume-btn').removeAttr('hidden');
|
||||
const rows = data.jobs.map(obj => {
|
||||
var cls = 'label ';
|
||||
if (obj.status === 'Pending')
|
||||
cls += 'label-pending';
|
||||
if (obj.status === 'Completed')
|
||||
cls += 'label-success';
|
||||
if (obj.status === 'Error')
|
||||
cls += 'label-danger';
|
||||
if (obj.status === 'MissingPages')
|
||||
cls += 'label-warning';
|
||||
|
||||
const info = obj.status_message.length > 0 ? '<span uk-icon="info"></span>' : '';
|
||||
const statusSpan = `<span class="${cls}">${obj.status} ${info}</span>`;
|
||||
const dropdown = obj.status_message.length > 0 ? `<div uk-dropdown>${obj.status_message}</div>` : '';
|
||||
const retryBtn = obj.status_message.length > 0 ? `<a onclick="refresh('${obj.id}')" uk-icon="refresh"></a>` : '';
|
||||
return `<tr id="chapter-${obj.id}">
|
||||
const info = obj.status_message.length > 0 ? '<span uk-icon="info"></span>' : '';
|
||||
const statusSpan = `<span class="${cls}">${obj.status} ${info}</span>`;
|
||||
const dropdown = obj.status_message.length > 0 ? `<div uk-dropdown>${obj.status_message}</div>` : '';
|
||||
const retryBtn = obj.status_message.length > 0 ? `<a onclick="refresh('${obj.id}')" uk-icon="refresh"></a>` : '';
|
||||
return `<tr id="chapter-${obj.id}">
|
||||
<td><a href="${baseURL}/chapter/${obj.id}">${obj.title}</a></td>
|
||||
<td><a href="${baseURL}/manga/${obj.manga_id}">${obj.manga_title}</a></td>
|
||||
<td>${obj.success_count}/${obj.pages}</td>
|
||||
@ -123,16 +129,16 @@ const load = () => {
|
||||
${retryBtn}
|
||||
</td>
|
||||
</tr>`;
|
||||
});
|
||||
});
|
||||
|
||||
const tbody = `<tbody>${rows.join('')}</tbody>`;
|
||||
$('tbody').remove();
|
||||
$('table').append(tbody);
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to fetch download queue. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
})
|
||||
.always(() => {
|
||||
loading = false;
|
||||
});
|
||||
const tbody = `<tbody>${rows.join('')}</tbody>`;
|
||||
$('tbody').remove();
|
||||
$('table').append(tbody);
|
||||
})
|
||||
.fail((jqXHR, status) => {
|
||||
alert('danger', `Failed to fetch download queue. Error: [${jqXHR.status}] ${jqXHR.statusText}`);
|
||||
})
|
||||
.always(() => {
|
||||
loading = false;
|
||||
});
|
||||
};
|
||||
|
33
src/assets/uikit.less
Normal file
33
src/assets/uikit.less
Normal file
@ -0,0 +1,33 @@
|
||||
@import "node_modules/uikit/src/less/uikit.theme.less";
|
||||
|
||||
.label {
|
||||
display: inline-block;
|
||||
padding: @label-padding-vertical @label-padding-horizontal;
|
||||
background: @label-background;
|
||||
line-height: @label-line-height;
|
||||
font-size: @label-font-size;
|
||||
color: @label-color;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
.hook-label;
|
||||
}
|
||||
|
||||
.label-success {
|
||||
background-color: @label-success-background;
|
||||
color: @label-success-color;
|
||||
}
|
||||
|
||||
.label-warning {
|
||||
background-color: @label-warning-background;
|
||||
color: @label-warning-color;
|
||||
}
|
||||
|
||||
.label-danger {
|
||||
background-color: @label-danger-background;
|
||||
color: @label-danger-color;
|
||||
}
|
||||
|
||||
.label-pending {
|
||||
background-color: @global-secondary-background;
|
||||
color: @global-inverse-color;
|
||||
}
|
@ -4,7 +4,7 @@
|
||||
<title>Mango</title>
|
||||
<meta name="description" content="Mango - Manga Server and Web Reader">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
|
||||
<link rel="stylesheet" href="<%= base_url %>css/uikit.css" />
|
||||
<link rel="stylesheet" href="<%= base_url %>css/mango.css" />
|
||||
<link rel="icon" href="<%= base_url %>favicon.ico">
|
||||
<script defer src="<%= base_url %>js/fontawesome.min.js"></script>
|
||||
|
Loading…
x
Reference in New Issue
Block a user