scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-10-06 03:46:39 +08:00
Code Issues Projects Releases Packages Wiki Activity

Implement inline edit design changes for legacy inline edit (PET titles, etc.)

Browse source
This commit is contained in:
Giga Chubinidze 2023-09-07 03:56:42 +04:00
parent 8188826125
commit c071eb4c16
3 changed files with 8 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/assets/javascripts/shared/inline_editing.js
View file

@ -114,6 +114,8 @@ var inlineEditing = (function() {
if (!error) error = response.responseJSON.errors[fieldToUpdate]; if (!error) error = response.responseJSON.errors[fieldToUpdate];
container.addClass('error'); container.addClass('error');
if (error) container.find('.error-block').html(error.join(', ')); if (error) container.find('.error-block').html(error.join(', '));
inputField(container).removeClass('border-sn-science-blue')
inputField(container).addClass('border-sn-delete-red')
inputField(container).focus(); inputField(container).focus();
container.data('disabled', false); container.data('disabled', false);
$('.tooltip').hide(); $('.tooltip').hide();
@ -166,6 +168,8 @@ var inlineEditing = (function() {
.scrollTop(container.offsetTop); .scrollTop(container.offsetTop);
$('.tooltip').hide(); $('.tooltip').hide();
} }
inputField(container).removeClass('border-sn-delete-red')
inputField(container).addClass('border-sn-science-blue')
e.stopPropagation(); e.stopPropagation();
return true; return true;
}) })

17
app/assets/stylesheets/partials/_inline_editing.scss
View file

@ -52,19 +52,9 @@
} }
} }
&:hover input,
&:hover .view-mode {
border: 1px solid $color-silver;
border-radius: 3px;
&:disabled {
border: 1px solid $color-gainsboro;
}
}
.view-mode { .view-mode {
border: 1px solid transparent; border: 1px solid transparent;
cursor: pointer; cursor: url("/images/icon_small/edit.svg") 0 16, auto;
line-height: 26px; line-height: 26px;
margin-left: -5px; margin-left: -5px;
min-height: 30px; min-height: 30px;
@ -83,11 +73,8 @@
} }
input { input {
border: 1px solid $color-silver; cursor: initial;
border-radius: $border-radius-default;
cursor: pointer;
display: block; display: block;
line-height: 26px;
margin-left: -5px; margin-left: -5px;
padding: 2px 4px; padding: 2px 4px;
padding-right: 36px; padding-right: 36px;

4
app/views/shared/_inline_editing.html.erb
View file

@ -9,8 +9,8 @@
data-placeholder='<%= config[:placeholder] %>' data-placeholder='<%= config[:placeholder] %>'
> >
<div class="view-mode" data-placeholder="<%= config[:placeholder] %>" tabindex=0><%= initial_value %></div> <div class="view-mode" data-placeholder="<%= config[:placeholder] %>" tabindex=0><%= initial_value %></div>
<input placeholder="<%= config[:placeholder] %>" class="hidden input-field" type="text" value="<%= initial_value %>" disabled/> <input placeholder="<%= config[:placeholder] %>" class="hidden input-field outline-none p-0 pb-2 border-0 border-solid border-b w-full break-words border-sn-science-blue caret-black bg-transparent" type="text" value="<%= initial_value %>" disabled/>
<div class="button-container"> <div class="button-container hidden">
<span class="save-button"><i class="sn-icon sn-icon-check"></i></span> <span class="save-button"><i class="sn-icon sn-icon-check"></i></span>
<span class="cancel-button"><i class="sn-icon sn-icon-close"></i></span> <span class="cancel-button"><i class="sn-icon sn-icon-close"></i></span>
</div> </div>