- in Compact/Classic mode typing text are dark in darkmode
To reproduce:
- change to dark mode and select Compact mode
- type in input field of Font or in Font size
- without this patch color will be dark in dark mode
Signed-off-by: Darshan-upadhyay1110 <darshan.upadhyay@collabora.com>
Change-Id: I4510001cfdf26acf8419eb0aa4ee3611b0a51b09
- drop zone indicator added to the left of all tabs
- additional drop zone indicator added to the right
of the last tab
- added drop zone container at the end of tabs
for the last drop zone indicator
- div#drop-zone-end-container element also adds
a space to the end of the tabs so that the last
tab can be seen easily after scrolling to the end
Signed-off-by: Bayram Çiçek <bayram.cicek@collabora.com>
Change-Id: I25a87bc1798b94c5f294532d308cd46292ef1795
Original approach before comment autosave:
When we save a new comment, original DOM element which user was editing
is removed from the DOM and new comment DOM element is created from the data and message sent by core.
Previous comment autosave approach:
When we save a new comment, original DOM element which user was editing
is not removed but kept in editing mode. We register the comment message sent by the core
but react and create new comment DOM element only after user clicks on save or cancel.
This lazy initialization caused many regression due to juggling of the new and old comment DOM element.
All these problems were in JS side only, reloading doc would bring comment in correct state.
This approach gave smoother transition between different comment states without any flickers.
New comment autosave approach:
Simple as the original approach, when comment loses focus we save it as normal comment.
When new DOM element created via core comment message, we immidietly set it to edit mode.
This approach may have a little flicker when we replace old comment DOM element with new comment DOM element.
Overall this approach requires less condition checking which makes it easy to maintain and hopefully reduces any regression from previous method.
Signed-off-by: Pranam Lashkari <lpranam@collabora.com>
Change-Id: I4098085825ede65cdbf2e2243fc4d2bb1f63c716
If administrator doesn't allow some URLs in the coolwsd.xml
under net.lok_allow then when pasting webpage with images
- it might result in missing pictures. We should show the
user what happened.
User can click "don't show this again" to avoid annoying
dialog on every paste.
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: Iec9035860b1c6a332420defd539000e8854447c9
- will fix Misaligned ui-tabs in mobile wizard
- also added scrollable property that will handle more fields in tabs if it does not fit into screen
Signed-off-by: Darshan-upadhyay1110 <darshan.upadhyay@collabora.com>
Change-Id: Ib982a59c141d937c7f92eb9684b91fc7f2548df5
- SVG for lc_fromrow is not compatable and it was not loading properly in browser
- fixed svg syntex to properly load by browser
- removed unused css class from mobile wizard
- that fixes the icon remain light in mobile view as well
Signed-off-by: Darshan-upadhyay1110 <darshan.upadhyay@collabora.com>
Change-Id: Ifa1e2e5397e48d33ede8a6081808cd0051d9059a
- showsubmenu event on hover
- hidedropdown event on leave
- submenu is inserted into the same overlay as parent dropdown
- don't destory overlay if submenu is closed, do that only for root
- works on tablet / touch device
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: Ibb4a747555e172dd4e040950cdfd309560f214a7
vertical separator was overlapping other widgets
can be found in: Calc -> Insert -> Pivot Table -> next
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I818fc4a8bb9b44b48fe43c911182c37e3cbc0d8c
When opening a menu as in Calc > Home > Conditional menu and then
press tab: we can successfully cycle through the elements but for some
elements user cannot see the focus.
- The focus was being set but under the separator. So, better to
assure that the immediate separator neighbor is set to transparent.
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: Icb87b3173144356efad101f5e2b9b77e0e8dcd06
Chevron (Arrow)
- Use existing icon and re-use it instead of a text character
- sing text depending on font size and the width we were giving
- could be dangerous
- Fix alignment: before this commit the chevron was almost glued to
the edge
- Make the hover state less dark so the chevron is visible at all times
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I3b79c6b9df324727fd0c217f869d9bb8a4df2d72
Before this commit separators were being rendered in quite dark color
and thickens make them standout more than the actual interactive
controls surrounding them
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I96c3eaf476cd947f804d855e0fd242a5ab42ee9b
We now have a new nice separator widget in online so we can render
separators that are coming from core. However in some cases, such as
mobile, we don't want to clutter the mobile wizard. On top of that we
already have separators.
Also: add comment to the jssidebar.css so it can be found when using
grep, blame etc
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I02a5831eff566367664ed022687ffeea6d7d3a81
This fixes regression from commit c77f1041a5
jsdialog: implement horizontal separator
Where horizontal separator widget was implemented
and now it appears in the sidebar, but as we have grid
layout there - it occupies only half of the sidebar
because we have 2 columns.
Previously there was no separator - hide it.
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: Ie65626011f98ded52e57306fc41d94fc58829d8f
It is possible to make submenus:
{text: _('Condition...'), items: [
.... sub-menu entries ....
]}
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I0a6687c0a6bc19b4cd6616005571b75ad41eb444
it is used in dropdowns eg. conditional formatting in Calc
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I19554c74de2fa861686469acbf2c3025633d0687
but entries have to be max-content to not wrap,
only main container has no width set to be automatically
resized to the needs
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I0dc2487b56700b1cc87f5f7ce1fcda8e91855269
in case of list view without levels we don't need
margin in first cell
detect that based on presence of aria-level property
use width: max-content to be sure we don't wrap entries
if not needed
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: Ica98e90dffd1e2b7330eb962cfc8141fa6fe01a1
Use pure CSS to make margins for different levels.
Inspired by: https://www.w3.org/WAI/ARIA/apg/patterns/treegrid/examples/treegrid-1/#ex_label
- reuse arrow from tree view and expander widget
- center verticaly entries in the tree grid / list view
- add pointer cursor for expander arrow
- do not allow to sort tree grid - it makes no sense
Tree grid is a kind of table with headers but rows can be expanded
and have subentries with different "level" in the tree
It can be tested in Writer -> Review -> Manage Changes
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I4d0719a35cf852127378525153eb5b1e5d9961a7
To avoid 2 scrollbars in this dialog better to set a max-height to
this element so it never surpasses the main dialog height
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I939fd5fa3cafb3fcc0721aa2864b262535f622a7
This fixes regression introduce in: Fix Spell checker js Dialog
- fd630d427f
By reading the code, it seems there was a fix for the spelling
suggestion (that comes as an image from core). It fixed the width,
before that the image was being resized to fit the parent's width.
- This fix still works but it ended up affecting any other
.ui-scrollwindow (that is not .formulabar)
- which means that (for **any** text content) the content will not
wrap at all even if it causes overflows and it will occupy
only as much space as it needs and not the full parent's
width.
- Affected dialogs: Sort dialog's ui-scrollwindow was occupying
only enough space to display its contents, leaving a big white
space on the side
The present commit applies the max-content (that should never be
applied to text) solely when we have drawing-area child
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: Iaf461663508a70a6a599cbe3e9411026b54531f0
This fixes side effect from commit a1b2091ae6
JSDialog: Dialogs shouldn't be taller than viewport
As mentioned in the above commit, we seemed to have children that are
always bigger than the parent even if there is no elements to be
displayed and to fix that we enforce in multiple places the overflow
hidden: afbf052bb5
- Ideally we wouldn't do this and just let the web browser
figure out if a scroll bar is needed or not. However this
would be a quite risky thing to do without enough testing...so
Best to ensure that other dialogs that have hidden items in the
DOM don't get scrollbars. Examples:
- Writer -> Format -> Character
- Calc -> Data -> Validity
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: Ia2625bd7e45214aa43ae96e95a149e0f78c9cd7c
Don't allow dialogs to grow taller than the web browser's viewport
instead,
- Set (for dialog's content) a max of 90% of the View height and subtract the dialog's
header. This way the header with the close button stays always visible
- Set overflow accordingly so it can be scrollable
- Needs to have !important because it seems we need by default
"overflow: hidden;" set to every ".jsdialog-container
.lokdialog.ui-dialog-content.ui-widget-content"
- introduced in afbf052bb5
possibly due to hidden elements that are part of DOM
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I61a2a41d8b1198fe00b939427cde43d247dc08bb
Use new id for snackbar with progress and style it
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I24a1647f0f629b7b079aa65601f4309c339a06e8
Before this, the padding-right was being set to 0 (probably to save up
space) but this is not the way to do it. It looks weird when the focus
is set to that button.
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: Ib60b32cd9d0f5f42444cadef121be32c15941483
Reusing progressbar dialog allows us to show it's the
same process for the user. So even if it is instant he
will see 100% progressbar and that button become enabled.
Create new file for functions which manipulate existing
modal dialogs.
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I765483b940f47bdfbcf8a488ea7d0ab9569ccda9
We no longer create that w2ui bar and we also have removed any element
with that id or parent from cool.html.m4 with that name. So, this can
be removed.
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I26c9e66de44fe8a8f8ad785031c640d32960a350
The scroll indicator set with an absolute position ends up being
positioned in the 0 y coordinate. Since the wrapper has a top padding
of 3 pixel it means the scroll indicator is not 3 pixel off.
Also, and since these measurements are set in the CSS (the height of
the wrapper and the padding of the other wrapper), better to just move
everything to the CSS and avoid unnecessary inline styles.
Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: Icc1e51b2590ee27b318f9e4c3d550183b08cb49d
This fixes regression from:
commit 07c3538589
mobile-wizard: create separate window container
The snackbar with action button like "leave feedback | ok"
or "we can reconnect | reload" had buttons below text
what looked bad and it was not possible to click
We introduced separate windows inside main
mobile-wizard-content container which have class
.mobile-wizard-content - let's use the same rules
as before for popups
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I506aaf34741fb1ff879c0c5c44a5958d6be9912c
This fixes regression introduced in:
commit b6c26bee91
Mobile sidebar header layout #6861
- remove additional top border
- make line height regular so text will fit into snackbar
without scrollbar
Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I72a1e7121d58a7583bd4efce9728c25231c7d8de
