Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-11-11 16:35:47 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix issues with acp category page

Browse Source 
strange name for background size variable
invalid class selectors
hijacking of background style
This commit is contained in:
yariplus
2015-07-22 04:52:54 -04:00
parent 2b93c01340
commit 67e450a05b
2 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
public/src/admin/manage/category.js
View File

@@ -50,11 +50,11 @@ define('admin/manage/category', [
function enableColorPicker(idx, inputEl) {
var $inputEl = $(inputEl),
previewEl = $inputEl.parents('[data-cid]').find('.preview-box');
previewEl = $inputEl.parents('[data-cid]').find('.category-preview');
colorpicker.enable($inputEl, function(hsb, hex) {
if ($inputEl.attr('data-name') === 'bgColor') {
previewEl.css('background', '#' + hex);
previewEl.css('background-color', '#' + hex);
} else if ($inputEl.attr('data-name') === 'color') {
previewEl.css('color', '#' + hex);
}
@@ -83,6 +83,11 @@ define('admin/manage/category', [
modified(ev.target);
});
// Update preview image size on change
$('[data-name="imageClass"]').on('change', function(ev) {
$('.category-preview').css('background-size', $(this).val());
});
// Colour Picker
$('[data-name="bgColor"], [data-name="color"]').each(enableColorPicker);
@@ -113,8 +118,7 @@ define('admin/manage/category', [
uploader.open(RELATIVE_PATH + '/api/admin/category/uploadpicture', { cid: cid }, 0, function(imageUrlOnServer) {
inputEl.val(imageUrlOnServer);
var previewBox = inputEl.parent().parent().siblings('.category-preview');
previewBox.css('background', 'url(' + imageUrlOnServer + '?' + new Date().getTime() + ')')
.css('background-size', 'cover');
previewBox.css('background', 'url(' + imageUrlOnServer + '?' + new Date().getTime() + ')');
modified(inputEl[0]);
});
});

4
src/views/admin/manage/category.tpl
View File

@@ -41,7 +41,7 @@
</div>
<div class="col-sm-4 col-xs-12">
<div class="form-group">
<label for="cid-{category.cid}-imageClass">Image Class</label>
<label for="cid-{category.cid}-imageClass">Background Image Size</label>
<select id="cid-{category.cid}-imageClass" class="form-control" data-name="imageClass" data-value="{category.imageClass}">
<option value="auto">auto</option>
<option value="cover">cover</option>
@@ -97,8 +97,8 @@
<div class="category-preview" style="
<!-- IF category.backgroundImage -->background-image: url({category.backgroundImage});<!-- ENDIF category.backgroundImage -->
<!-- IF category.bgColor -->background-color: {category.bgColor};<!-- ENDIF category.bgColor -->
<!-- IF category.imageClass -->background-size: {category.imageClass};<!-- ENDIF category.imageClass -->
color: {category.color};
background-size:cover;
">
<div class="icon">
<i data-name="icon" value="{category.icon}" class="fa {category.icon} fa-2x"></i>