[Libreoffice-commits] online.git: loleaflet/css loleaflet/html loleaflet/src
Pedro Pinto Silva (via logerrit)
logerrit at kemper.freedesktop.org
Thu Jun 11 10:54:56 UTC 2020
loleaflet/css/toolbar.css | 19 ++++++++++++++++---
loleaflet/html/loleaflet.html.m4 | 1 +
loleaflet/src/control/Control.DocumentNameInput.js | 11 ++++++++++-
3 files changed, 27 insertions(+), 4 deletions(-)
New commits:
commit 40110f2ba7a53621a0f6c360e7c3bd4803fd6eeb
Author: Pedro Pinto Silva <pedro.silva at collabora.com>
AuthorDate: Wed Jun 10 15:56:34 2020 +0200
Commit: Andras Timar <andras.timar at collabora.com>
CommitDate: Thu Jun 11 12:54:38 2020 +0200
Desktop: Set max size for document name's width
Change-Id: Ic35990efd9e240ed29ae9da1e72dcd6b58a4e933
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/96053
Tested-by: Jenkins
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Andras Timar <andras.timar at collabora.com>
diff --git a/loleaflet/css/toolbar.css b/loleaflet/css/toolbar.css
index 13eb379d5..20fb595a0 100644
--- a/loleaflet/css/toolbar.css
+++ b/loleaflet/css/toolbar.css
@@ -149,6 +149,19 @@ w2ui-toolbar {
#tb_formulabar_item_formula div table {
width: 100%;
}
+#document-title-pencil.editable {
+ visibility: visible;
+ width: 24px;
+ height: 22px;
+ position: absolute;
+ left: 87%;
+ background: url('images/baseline-edit.svg') right center no-repeat, radial-gradient(circle, #fff 20%, #fff0 100%);
+ border-top: solid 3px white;
+}
+
+#document-title-pencil:not(.editable){
+ visibility: hidden;
+}
#document-name-input {
font-size: 16px;
@@ -159,25 +172,25 @@ w2ui-toolbar {
#document-name-input.editable {
border: none;
box-shadow: 0 0 0.1px 1px #ebebeb, 0 0 2px 1px #f0f0f0;
- background-image: url('images/baseline-edit.svg');
background-position: right;
background-repeat: no-repeat;
+ padding-right: 24px;
+ max-width: 100%;
}
#document-name-input.editable:focus {
border: none;
box-shadow: inset 0 0 2px 1px #f0f0f0, 0 0 0.1px 1px #bbb;
background-color: white;
+ background-image: none;
}
#document-name-input.editable:hover:not(:focus) {
border: none;
box-shadow: 0 0 0.1px 1px #d7d7d7, 0 0 3px 2px #f0f0f0;
background-color: white;
- background-image: url('images/baseline-edit.svg');
background-position: right;
background-repeat: no-repeat;
- padding-right: 2px;
}
#tb_editbar_item_fold table.w2ui-button {
margin: 0px 14px 0px 4px !important;
diff --git a/loleaflet/html/loleaflet.html.m4 b/loleaflet/html/loleaflet.html.m4
index d3c3e21de..f84271e62 100644
--- a/loleaflet/html/loleaflet.html.m4
+++ b/loleaflet/html/loleaflet.html.m4
@@ -145,6 +145,7 @@ m4_ifelse(MOBILEAPP,[true],
<ul id="main-menu" class="sm sm-simple lo-menu readonly"></ul>
<div id="document-titlebar">
<div class="document-title">
+ <div id="document-title-pencil"></div>
<input id="document-name-input" type="text" disabled="true" style="display: none"/>
</div>
</div>
diff --git a/loleaflet/src/control/Control.DocumentNameInput.js b/loleaflet/src/control/Control.DocumentNameInput.js
index 090cc25f9..28db57f41 100644
--- a/loleaflet/src/control/Control.DocumentNameInput.js
+++ b/loleaflet/src/control/Control.DocumentNameInput.js
@@ -65,7 +65,13 @@ L.Control.DocumentNameInput = L.Control.extend({
},
onDocLayerInit: function() {
- $('#document-name-input').attr('size', $('#document-name-input').val().length);
+ var value = $('#document-name-input').val();
+ if (value.length < 27) {
+ $('#document-name-input').attr('size', value.length);
+ }
+ else {
+ $('#document-name-input').attr('size', '25');
+ }
// FIXME: Android app would display a temporary filename, not the actual filename
if (window.ThisIsTheAndroidApp) {
@@ -78,6 +84,7 @@ L.Control.DocumentNameInput = L.Control.extend({
// We can now set the document name in the menu bar
$('#document-name-input').prop('disabled', false);
$('#document-name-input').removeClass('editable');
+ $('#document-title-pencil').removeClass('editable');
$('#document-name-input').focus(function() { $(this).blur(); });
// Call decodecodeURIComponent twice: Reverse both our encoding and the encoding of
// the name in the file system.
@@ -99,12 +106,14 @@ L.Control.DocumentNameInput = L.Control.extend({
// Save As allowed
$('#document-name-input').prop('disabled', false);
$('#document-name-input').addClass('editable');
+ $('#document-title-pencil').addClass('editable');
$('#document-name-input').off('keypress', this.onDocumentNameKeyPress).on('keypress', this.onDocumentNameKeyPress.bind(this));
$('#document-name-input').off('focus', this.onDocumentNameFocus).on('focus', this.onDocumentNameFocus.bind(this));
$('#document-name-input').off('blur', this.documentNameCancel).on('blur', this.documentNameCancel.bind(this));
} else {
$('#document-name-input').prop('disabled', true);
$('#document-name-input').removeClass('editable');
+ $('#document-title-pencil').removeClass('editable');
$('#document-name-input').off('keypress', this.onDocumentNameKeyPress);
}
}
More information about the Libreoffice-commits
mailing list