fix(admin): dashboard logo and colours bugfixes

darta 2022-01-19 13:13:42 +01:00
parent 8cb4a3475b
commit 6a54e92d09
2 changed files with 38 additions and 24 deletions

View File

@ -11,26 +11,42 @@ $(document).ready(function() {
return $('<span><i class="fa ' + $(icon.element).data('icon') + '"></i> ' + icon.text + '</span>');
};
// Update background input when colorpicker is used
$('#colorpicker-background').colorpicker().on('changeColor', function (e) {
$('#colorpicker-background-input').val(e.color.toHex());
$('.right_col').css('background-color', e.color.toHex());
});
$('#colorpicker-background-input').on('keyDown', function (e) {
$('#colorpicker-background').val(e.color.toHex());
// Update background colorpicker when input is used
$('#colorpicker-background-input').on('keyup', function (e) {
if ($('#colorpicker-background-input').val()[0] == '#' && $('#colorpicker-background-input').val().length == 7) {
$('#colorpicker-background').colorpicker('setValue', $('#colorpicker-background-input').val());
}
})
// Update primary input when colorpicker is used
$('#colorpicker-primary').colorpicker().on('changeColor', function (e) {
$('#colorpicker-primary-input').val(e.color.toHex());
$('.left_col').css('background-color', e.color.toHex());
$('body').css('background-color', e.color.toHex());
});
// Update primary colorpicker when input is used
$('#colorpicker-primary-input').on('keyup', function (e) {
if ($('#colorpicker-primary-input').val()[0] == '#' && $('#colorpicker-primary-input').val().length == 7) {
$('#colorpicker-primary').colorpicker('setValue', $('#colorpicker-primary-input').val());
}
})
// Update secondary input when colorpicker is used
$('#colorpicker-secondary').colorpicker().on('changeColor', function (e) {
$('#colorpicker-secondary-input').val(e.color.toHex());
$('.left_col').css('color', e.color.toHex());
});
// Update primary colorpicker when input is used
$('#colorpicker-secondary-input').on('keyup', function (e) {
if ($('#colorpicker-secondary-input').val()[0] == '#' && $('#colorpicker-secondary-input').val().length == 7) {
$('#colorpicker-secondary').colorpicker('setValue', $('#colorpicker-secondary-input').val());
}
})
init_logo_cropper()
init_background_cropper()
@ -235,7 +251,7 @@ function init_logo_cropper() {
});
// Import image
var $inputImage = $('#inputImage');
var $inputImage = $('#inputImageLogo');
var URL = window.URL || window.webkitURL;
var blobURL;
@ -406,7 +422,7 @@ function init_background_cropper() {
});
// Import image
var $inputImage = $('#inputImage');
var $inputImage = $('#inputImageBackground');
var URL = window.URL || window.webkitURL;
var blobURL;

View File

@ -110,7 +110,7 @@
</style>
<div class="row">
<!-- form color picker -->
<div class="col-lg-2 col-md-12 col-sm-12 col-xs-12">
<div class="col-lg-3 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2>System colors</h2>
@ -144,7 +144,7 @@
</div>
<!-- /form color picker -->
<!-- custom menu -->
<div class="col-lg-10 col-md-12 col-sm-12 col-xs-12">
<div class="col-lg-9 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2>Custom menu</h2>
@ -168,22 +168,22 @@
</div>
</div>
<div class="form-group row">
<div class="col-md-3 col-xs-12">
<div hidden>
<label class="control-label" for="apps_external-{{ menu_item.shortname }}-shortname">Shortname
</label>
<input readonly="readonly" id="apps_external-{{ menu_item.shortname }}-shortname" value="{{ menu_item.shortname }}" class="roundbox form-control" name="apps_external-{{ menu_item.shortname }}-shortname" placeholder="" type="text" required style="width: 100%;">
</div>
<div class="col-md-4 col-xs-12">
<label class="control-label" for="apps_external-{{ menu_item.shortname }}-name">Name <span class="required">*</span>
</label>
<input id="apps_external-{{ menu_item.shortname }}-name" value="{{ menu_item.name }}" class="roundbox" name="apps_external-{{ menu_item.shortname }}-name" placeholder="" type="text" required style="width: 100%;">
</div>
<div class="col-md-3 col-xs-12">
<label class="control-label" for="apps_external-{{ menu_item.shortname }}-shortname">Shortname <span class="required">*</span>
</label>
<input id="apps_external-{{ menu_item.shortname }}-shortname" value="{{ menu_item.shortname }}" class="roundbox" name="apps_external-{{ menu_item.shortname }}-shortname" placeholder="" type="text" required style="width: 100%;">
</div>
<div class="col-md-3 col-xs-12">
<div class="col-md-4 col-xs-12">
<label class="control-label" for="apps_external-{{ menu_item.shortname }}-href">Url <span class="required">*</span>
</label>
<input id="apps_external-{{ menu_item.shortname }}-href" value="{{ menu_item.href }}" class="roundbox" name="apps_external-{{ menu_item.href }}-href" placeholder="" type="text" required style="width: 100%;">
</div>
<div class="col-md-3 col-xs-12">
<div class="col-md-4 col-xs-12">
<label class="control-label" for="apps_external-{{ menu_item.shortname }}-icon">Icon <span class="required">*</span>
</label>
<select class="icon-dropdown" id="apps_external-{{ menu_item.shortname }}-icon" name="apps_external-{{ menu_item.shortname }}-icon">
@ -288,8 +288,8 @@
<span class="fa fa-refresh"></span>
</span>
</button>
<label class="btn btn-primary btn-upload" for="inputImage" title="Upload image file">
<input type="file" class="sr-only" id="inputImage" name="file" accept="image/*">
<label class="btn btn-primary btn-upload" for="inputImageLogo" title="Upload image file">
<input type="file" class="sr-only" id="inputImageLogo" name="file" accept="image/*">
<span class="docs-tooltip" data-toggle="tooltip" title="Import image with Blob URLs">
<span class="fa fa-upload"></span>
</span>
@ -391,8 +391,8 @@
<span class="fa fa-refresh"></span>
</span>
</button>
<label class="btn btn-primary btn-upload" for="inputImage" title="Upload image file">
<input type="file" class="sr-only" id="inputImage" name="file" accept="image/*">
<label class="btn btn-primary btn-upload" for="inputImageBackground" title="Upload image file">
<input type="file" class="sr-only" id="inputImageBackground" name="file" accept="image/*">
<span class="docs-tooltip" data-toggle="tooltip" title="Import image with Blob URLs">
<span class="fa fa-upload"></span>
</span>
@ -413,8 +413,6 @@
</div>
</div>
{% include 'pages/modals/groups_modals.html' %}
{% endblock %}
{% block pagescript %}