mirror of
https://github.com/cryptpad/cryptpad.git
synced 2026-09-14 11:05:41 +05:00
Corrections
This commit is contained in:
zuzanna-maria
parent
14d495cd17
commit
2f2e97c51c
@ -135,6 +135,13 @@ define(req, function(AppConfig, Default, Language) {
|
||||
return text;
|
||||
}
|
||||
};
|
||||
|
||||
//NOTE: these keys are also added to the Kanban mobile UI PR #1727
|
||||
Messages.moveItemUp = 'Move item up'; // XXX
|
||||
Messages.moveItemDown = 'Move item down'; // XXX
|
||||
Messages.toggleArrows = 'Switch to arrow view'; // XXX
|
||||
Messages.toggleDrag = 'Switch to drag view'; // XXX
|
||||
|
||||
return Messages;
|
||||
|
||||
});
|
||||
|
||||
@ -13,12 +13,6 @@ define(['/common/translations/messages.js'], function (Messages) {
|
||||
// Replace the existing keys in your copied file here:
|
||||
// Messages.button_newpad = "New Rich Text Document";
|
||||
|
||||
//NOTE: these keys are also added to the Kanban mobile UI PR #1727
|
||||
Messages.moveItemUp = 'Move item up'; // XXX
|
||||
Messages.moveItemDown = 'Move item down'; // XXX
|
||||
Messages.toggleArrows = 'Switch to arrow view'; // XXX
|
||||
Messages.toggleDrag = 'Switch to drag view'; // XXX
|
||||
|
||||
return Messages;
|
||||
});
|
||||
|
||||
|
||||
@ -207,16 +207,22 @@
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border: none;
|
||||
border-radius: 5px 0px 0px 5px;
|
||||
border-radius: @variables_radius 0px 0px @variables_radius;
|
||||
background-color: @cp_form-bg1;
|
||||
color: @cryptpad_text_col;
|
||||
&.toggle-active {
|
||||
color: @cp_form-bg1 !important;
|
||||
@media (max-width:723px) and (min-width:693px), (max-width:553px) and (min-width:524px) {
|
||||
border-radius: @variables_radius @variables_radius 0px 0px;
|
||||
}
|
||||
&.cp-toggle-active {
|
||||
color: @cp_form-bg1;
|
||||
background-color: @cryptpad_text_col;
|
||||
}
|
||||
}
|
||||
#toggle-drag-on {
|
||||
border-radius: 0px 5px 5px 0px !important;
|
||||
#cp-toggle-drag-on {
|
||||
border-radius: 0px @variables_radius @variables_radius 0px !important;
|
||||
@media (max-width:723px) and (min-width:693px), (max-width:553px) and (min-width:524px) {
|
||||
border-radius: 0px 0px @variables_radius @variables_radius !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
@ -604,18 +610,18 @@
|
||||
}
|
||||
}
|
||||
.cp-form-block-arrows {
|
||||
.cp-form-arrow {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color:@cryptpad_text_col;
|
||||
}
|
||||
justify-content: space-between;
|
||||
max-width: fit-content;
|
||||
margin-inline: auto;
|
||||
padding: 6px;
|
||||
margin-top: -35px;
|
||||
border-radius: 0px @variables_radius 0px 0px;
|
||||
.fa-arrow-down {
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
.cp-form-arrow {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: @cryptpad_text_col;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -4018,11 +4018,46 @@ define([
|
||||
|
||||
|
||||
var changeType;
|
||||
let shiftButtons;
|
||||
if (editable) {
|
||||
// Arrows
|
||||
var upButton = h('button.cp-form-arrow', h('i.fa.fa-arrow-up', {
|
||||
'title': Messages.moveItemUp,
|
||||
'aria-hidden': true
|
||||
}));
|
||||
var downButton = h('button.cp-form-arrow', h('i.fa.fa-arrow-down', {
|
||||
'title': Messages.moveItemDown,
|
||||
'aria-hidden': true
|
||||
}));
|
||||
var shiftBlock = function(direction) {
|
||||
var blockIndex = content.order.indexOf(uid);
|
||||
if (direction === 'up' && blockIndex > 0) {
|
||||
content.order.splice(blockIndex-1, 0, content.order.splice(blockIndex, 1)[0]);
|
||||
} else if (direction === 'down' && blockIndex < content.order.length-1) {
|
||||
content.order.splice(blockIndex+1, 0, content.order.splice(blockIndex, 1)[0]);
|
||||
}
|
||||
updateForm(framework, content, true);
|
||||
};
|
||||
$(upButton).click(function () {
|
||||
shiftBlock('up');
|
||||
});
|
||||
$(downButton).click(function () {
|
||||
shiftBlock('down');
|
||||
});
|
||||
shiftButtons = h('div.cp-form-block-arrows',
|
||||
{style: 'display: none'}, [
|
||||
upButton,
|
||||
downButton
|
||||
]);
|
||||
|
||||
// Drag handle
|
||||
let drag = $('#toggle-drag-off').attr('class').indexOf('toggle-active') !== -1 ? false : true;
|
||||
var dragEllipses = drag ? [h('i.fa.fa-ellipsis-h'), h('i.fa.fa-ellipsis-h')] : undefined;
|
||||
var drag = APP.drag
|
||||
var dragEllipses = [h('i.fa.fa-ellipsis-h'), h('i.fa.fa-ellipsis-h')]
|
||||
dragHandle = h('span.cp-form-block-drag-handle', dragEllipses);
|
||||
if (!drag) {
|
||||
$(shiftButtons).css({display: 'flex'})
|
||||
$(dragEllipses).css({display: 'none'})
|
||||
}
|
||||
// Question
|
||||
var inputQ = h('input', {
|
||||
value: block.q || Messages.form_default
|
||||
@ -4258,40 +4293,9 @@ define([
|
||||
}
|
||||
}
|
||||
}
|
||||
let shiftButtons;
|
||||
let drag;
|
||||
if (editable) {
|
||||
drag = $('#toggle-drag-off').attr('class').indexOf('toggle-active') !== -1 ? false : true;
|
||||
if (!drag) {
|
||||
var upButton = h('button.cp-form-arrow', h('i.fa.fa-arrow-up', {
|
||||
'title': Messages.moveItemUp,
|
||||
'aria-hidden': true
|
||||
}));
|
||||
var downButton = h('button.cp-form-arrow', h('i.fa.fa-arrow-down', {
|
||||
'title': Messages.moveItemDown,
|
||||
'aria-hidden': true
|
||||
}));
|
||||
var shiftBlock = function(direction) {
|
||||
var blockIndex = content.order.indexOf(uid);
|
||||
if (direction === 'up' && blockIndex > 0) {
|
||||
content.order.splice(blockIndex-1, 0, content.order.splice(blockIndex, 1)[0]);
|
||||
} else if (direction === 'down' && blockIndex < content.order.length-1) {
|
||||
content.order.splice(blockIndex+1, 0, content.order.splice(blockIndex, 1)[0]);
|
||||
}
|
||||
updateForm(framework, content, true);
|
||||
};
|
||||
$(upButton).click(function () {
|
||||
shiftBlock('up');
|
||||
});
|
||||
$(downButton).click(function () {
|
||||
shiftBlock('down');
|
||||
});
|
||||
shiftButtons = h('div.cp-form-block-arrows', [
|
||||
upButton,
|
||||
downButton
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
var editableCls = editable ? ".editable" : "";
|
||||
var draggable = drag ? '' : '.nodrag';
|
||||
@ -5136,20 +5140,38 @@ define([
|
||||
editableStr
|
||||
]);
|
||||
|
||||
var toggleOffclass = 'ontouchstart' in window ? 'toggle-active' : 'toggle-inactive';
|
||||
var toggleOnclass = 'ontouchstart' in window ? 'toggle-inactive' : 'toggle-active';
|
||||
var toggleDragOff = h(`button#toggle-drag-off.cp-form-view-drag.${toggleOffclass}.fa.fa-arrows`, {'aria-hidden': true, 'title': Messages.toggleArrows});
|
||||
var toggleDragOn = h(`button#toggle-drag-on.cp-form-view-drag.${toggleOnclass}.fa.fa-hand-o-up`, {'aria-hidden': true, 'title': Messages.toggleDrag});
|
||||
$(toggleDragOff).click(function() {
|
||||
$(toggleDragOff).attr('class').indexOf('toggle-inactive') !== -1 ? $(toggleDragOff).toggleClass('toggle-inactive').toggleClass('toggle-active') && $(toggleDragOn).toggleClass('toggle-active').toggleClass('toggle-inactive') : undefined;
|
||||
updateForm(framework, content, true);
|
||||
APP.mainSortable.options.disabled = true;
|
||||
});
|
||||
$(toggleDragOn).click(function() {
|
||||
$(toggleDragOn).attr('class').indexOf('toggle-inactive') !== -1 ? $(toggleDragOn).toggleClass('toggle-inactive').toggleClass('toggle-active') && $(toggleDragOff).toggleClass('toggle-active').toggleClass('toggle-inactive') : undefined;
|
||||
updateForm(framework, content, true);
|
||||
APP.mainSortable.options.disabled = false;
|
||||
});
|
||||
var toggleOffclass;
|
||||
var toggleOnclass;
|
||||
if ('ontouchstart' in window) {
|
||||
toggleOffclass = 'cp-toggle-active'
|
||||
APP.drag = false
|
||||
} else {
|
||||
toggleOnclass = 'cp-toggle-active'
|
||||
APP.drag = true
|
||||
}
|
||||
|
||||
var toggleDragOff = h(`button#cp-toggle-drag-off.cp-form-view-drag.${toggleOffclass}.fa.fa-arrows`, {'aria-hidden': true, 'title': Messages.toggleArrows});
|
||||
var toggleDragOn = h(`button#cp-toggle-drag-on.cp-form-view-drag.${toggleOnclass}.fa.fa-hand-o-up`, {'aria-hidden': true, 'title': Messages.toggleDrag});
|
||||
// var container = $('.cp-form-creator-content')
|
||||
// $(container).addClass('cp-drag')
|
||||
const updateDrag = state => {
|
||||
return function () {
|
||||
$(toggleDragOn).toggleClass('cp-toggle-active', state);
|
||||
$(toggleDragOff).toggleClass('cp-toggle-active', !state);
|
||||
APP.mainSortable.options.disabled = !state;
|
||||
APP.drag = state
|
||||
if (state) {
|
||||
$('.cp-form-block-arrows').css({display: 'none'})
|
||||
$('.fa-ellipsis-h').css({display: 'block'})
|
||||
|
||||
} else {
|
||||
$('.cp-form-block-arrows').css({display: 'flex'})
|
||||
$('.fa-ellipsis-h').css({display: 'none'})
|
||||
}
|
||||
};
|
||||
};
|
||||
$(toggleDragOn).click(updateDrag(true));
|
||||
$(toggleDragOff).click(updateDrag(false));
|
||||
|
||||
var drag = h('div', [
|
||||
toggleDragOff,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user