When contextmenu closes, it clears visibility style from all components.
It is added temporarily so that the options buttons do not
disappear if the mouse leaves the row. The visibility setting for
the grippy for items with only one author should be in
a separate class so that grippy is not displayed by accident.
Fixes: zotero#3732
- handle space and enter in zotero pane to always click on toolbarbutton.
It ensures consistent behavior across all components to avoid Enter
triggering click on some buttons but not others.
- address the issue of focus not being able to leave the reader once it
gets there. On Escape, when reader is opened, instead of re-focusing the reader,
focus the selected tab. From there, Enter will focus the reader, and tabbing
allows you to reach the itemPane.
- Tab/Shift-tab moves focus between Sync button and itemPane when
reader is opened
- min/max-lines attribute on editable-text determines how tall the field
can/has to be
- if max-lines is not specified (or is below 1), the textarea will expand
as much as needed without overflow
- removed hardcoded height and variables from css, substituted them with
usage of these attributes for consistency
- No fields have any max-lines at this point, so all fields will expand as
needed
- right/left arrows on section header expand/collapse the sections
- space/enter on section header toggle section collapsed/expanded
- tab from the header goes through the header's buttons and then
tabs into the section if that's opened
- arrow up/down on the header jumps to the previous/next header
- space/enter on clickable elements simulate a click
- if there is a pinned section, tab from the title will focus its header
When a menupopup is opened, the active element does not change, so
their focus-ring will be hidden until the menupopup closes for it to be
less distracting.
When a panel popup is opened, the focus will be moved inside
of the panel, so we keep track of whichever element was previously
focused, and re-focus it when the panel goes away.
Minor reorganization of focus-ring mixin to use variables instead
of parameters to make hiding of focus-ring easier.
- Remove margins and add a border to the pseudo-element.
It improves how the text of the pseudo-component matches the text from
textarea and should prevent the scrollbar from appearing due to mismatch.
- Swap explicit width setting for editable-text in itemBox for
min-width: 0. It still allows the editable-text to be shrunk when the
itemBox is narrow but does not cause mismatches between pseudo elements
and the textarea.
- do not display creator buttons until hovered
- make last name have flex-grow priority over first name
- removed inline margins of rows
- removed extra padding from icons
This makes it more likely that the creator name will be displayed
fully without ellipsis until it is hovered. When the buttons are
displayed on focus or hover, the last name tries to remain
unellipsized as long as the first name is still visible after buttons
appear. If the first name is too short, both names will be ellipsized.
- fixed creator names text selection glitch (hide the comma instead
of not displaying it + removed redundant value update that's no longer
needed)
- set selection direction in editableText on tab to not scroll to the
end of input
- added autocomplete to observedAttributes of editable-text to
properly add autocomplete even if autocomplete params are set after
the element has been rendered (which is needed for creator names). This
fixes wrong Esc behavior that erases autocomplete fields instead of
resetting to previous value.
- fixed creator names autocomplete and type switch regression after
the comma was removed
- Table structure rewrite to use grid layout instead
of the <table> component so that screen readers can see the content
- Added icons to mirror right-click actions
- Moved creator actions to the options menu
- Drag-drop to reorder creators
- Using editable-text instead of clicky component
- Consolidated autocomplete logic in one function
- Added @focus-ring to all components of the itemBox
- Fields are focusable and navigatable via keyboard in non-edit modes
- General refactoring to consolidate stylesheets across platforms
and remove code that's not more used (mainly related to handling old
clicky text component).
- Retractions panel background set for --material-background instead
of light pink in dark mode.
- Added nowrap attribute to not add the stretching aspect
of the editable-text and to not have any text wrapping. To be used in cases when
the input is a single line and it's width is stretched with flexbox, for
example tags or itemBox value fields.
- Added 'tight' attribute to set lower padding values on editable-text.
To be applied on fields that are not as prominent as abstract or header
as it makes the actual editable-text component smaller.
- Minor style changes to not shift layout on focus on windows (using
transparent border instead of 0 margin).
- No overflow of textarea to avoid longer-than-needed textareas on
windows.
- Keep track if the component was focused on via mouse click or not.
If the focus happened without prior mouse click, select all text.
- Reset cursor and selection on blur.
- Make sure the .input is always re-added if it disappears after drag-drop.
- Added sizeToContent function to set max-width based on the width
of the input.
- Allow the browser to break up words more freely with overflow-wrap: anywhere
to avoid stretching the itemBox with extra long header without spaces.
- Apply 'nowrap' and 'tight' to tags so that a long tag does not stretch
the itemBox or make the editable-text extra tall.
