Commit graph

120 commits

Author SHA1 Message Date
Abe Jellinek
810402c9c7 Implement pane header, non-tabbed layout, collapsible sections, and new abstract box 2024-01-24 03:42:43 -05:00
Abe Jellinek
a2f259d14c Use item type CSS icons in more places
.icon-item-type is now global, with extra styling to handle row selection when
it's inside the item tree.

getImageSrc() is still used for progress windows, which is probably OK for now
because those don't stay on screen for very long. I've updated it to return SVGs
based on the current UI color scheme.

Other code uses treeitem-* images directly; getting rid of those references will
cause a lot of conflicts and be a bit more involved than this initial pass, so
I'll put that in a separate PR.
2024-01-24 03:42:43 -05:00
abaevbog
200e1d7564 toolbar and keyboard navigation updates
1. Toolbarbuttons changes:
	1. “New Library” moved from toolbar to File menu
	2. “New note” on click makes a standalone note
	3. “New attachment” on click adds stored copy of a file
	4. Menuitems from old note or attachment menus moved to the File menu
	5. “Advanced search” removed. Sync and Locate buttons moved to the top-right corner (Locate - temporarily)
	6. Added “Opened tabs” toolbarbutton
	7. Updated tooltips
2. Added a toolbarbutton that reveals collection search field on click. Search field is hidden on blur if empty. Keyboard accessibility via tab/shift-tab.
3. Tab based navigation restructuring. For each component, create a mapping of target ids with desired focus destination for each relevant keyboard event and use that to determine where to move focus next. Fixed bugs with focus wraparound not working when a note or attachment is opened in contextMenu.
4. Make quick-search dropmarker a sibling of the textfield. QuickSearchTextbox does not extend search-textfield anymore. It serves as a container to house dropmarker and textfield as siblings. This is needed to remove focus ring from quick search textbook when focus moves onto the dropmarker.
5. Separate toolbars for item and collection trees. Removed unused code manually setting the width of toolbar section
6. Focusable tabs + keyboard navigation:
	1. Shift-tab from opened tabs menu moves focus to the currently opened tab
	2. When a tab has focus, use left/right arrows to select tabs, or CMD/Ctrl + arrows to move focus between tabs
	3. Enter or Space on a focused tab will select it if needed and move focus to the contentPane of the reader of this tab
	4. Shift-tab from tabs wraps focus around to itemTree or itemPane
7. “New collection” creates collection contextually within currently selected library or collection.
8. Items pane minimum width increase to avoid quicksearch from being squashed
9. Do not move focus to title field of itemBox after itemTypeMenu is closed with ESC.
10. Display all itemTypes without "Show more" submenu in "New Item" meunu. Removed "Store Copy of File" and "Link to File" from "New Item" menu.
2024-01-24 03:42:42 -05:00
Tom Najdek
3f91729141 collections tree redesign
- new icons
- new twisty (also for items tree)
- new mixin focus-states that can be re-used for less boilerplate
- dark/white compatible with tweaks for when tree is focused (these changes also affect items tree)
- removed macOS specific behaviour (blue-ish background, gradient for selected row)
- border-radius on highlight + spacing tweaks
- tweaked colors and fonts
- Support for "compact"/"comfortable"
2024-01-24 03:42:42 -05:00
Tom Najdek
78d82d22cc Fix item type icons broken on 2x screens
Icons preloading introduced in 247755c5 overrides entire background
property, not just background-image. On 2x screens (and anywhere else
where svg icons need to be scaled) icons need property `background-size:
contain` to be displayed correctly. This previously came from
`.icon-css` class but have been overriden by code generated in
`svgicon`, so to fix this, these properties need to be added to the
`svgicon`.
2024-01-24 03:42:42 -05:00
Tom Najdek
c7286194f8 Convert theme to css variables
* Opt-in for light and dark color schemes
* Convert scss variables in _light.scss to css variables
* Add _dark.scss for dark color scheme
* Remove unused, theme-related variables
2024-01-24 03:42:29 -05:00
Tom Najdek
03d10f7de7 Switch to new svg icons for item types 2024-01-24 03:39:09 -05:00
Dan Stillman
4b7a1e8607 Get rid of some console warnings
And some other unused CSS
2023-07-11 05:35:32 -04:00
Abe Jellinek
b7626a1baa Remove min-width/height rules
Not actually necessary to get the sizing right in the dialog.
2023-06-17 02:33:59 -04:00
Abe Jellinek
c37e327330 Fix clicky sizing and appearance
- Set min-width and min-height to width and height so buttons never shrink
- Remove defunct .zotero-clicky-* styles from 2x block in zotero.css
- Include zotero-platform/content/zotero.css in searchDialog.xhtml
   - It seems only the defunct 2x styles from zotero.css were being applied, so
     the buttons would have been unstyled on a non-hiDPI display
2023-06-17 02:33:59 -04:00
Abe Jellinek
fdcb12df92
Tab bar: Make bottom border span the whole window (#3066) 2023-04-08 18:19:46 -04:00
Dan Stillman
a6a69605c6
Mendeley citation relinking tweaks
- Show "More information" link next to relink option
- Automatically check relink option when coming from integration prompt
- Change done message to "[x] items were relinked" instead of "0 items
  were imported"
2023-04-06 17:10:13 +02:00
Tom Najdek
197d8d1f3b
Add option to Mendeley importer to relink items
New option only appears if importer version is < 1 or not present.
It will:
    * Skip fetching collections and attachments
    * Skip any new items
    * Update relations on existing items
2023-04-06 17:10:12 +02:00
Tom Najdek
4b523555d6
Mendeley Import: Auth using direct login
* Importer will now ask user for a login and password via form and will
  perform sign-in directly using credentials rather than oauth
* Signing in this way enables importer to obtain desktop document ID
  which is now stored for each item
* It's possible to switch back to the old method (ouath) by setting
  `import.mendeleyUseOAuth` pref to `true`.
* New option to only import new items. This options only appears if
  database contains previously imported items.
* Importer will now update mendeleyDB:documentUUID on existing items to
  match value used in Mendeley Desktop if available
* Importer will no longer create collections when no new items are
  imported * Importer will only report number of new items imported on
  re-import * Importer will now preserve dateAdded on re-import

Co-authored-by: Dan Stillman <dstillman@zotero.org>
2023-04-06 17:10:12 +02:00
Adomas Ven
6b819e259c
fx102: Cleans up scss files, removes shadow DOM use from CEs (#3051)
Removes a huge amount of excessive files and duplication for CE scss.
All CE css is now output in the single
zotero-react-client.css file.

Moving all CE styling into a single stylesheet required removing their
shadow DOMs. It is desirable anyway, since you want to
be able to style CEs from "outside", when embedding in different
contexts.

Shadow removal required some CE code changes to maintain
functionality.

Elements refactored:
- attachment-box (displayed when an attachment (like PDF) is selected in
the item tree)
- color-picker (in the tag color selector)
- guidance-panel (displayed on first run when editing authors for a book
section)
- item-box (info tab in the item pane)
- note-editor
- notes-box (note tab in the item pane)
- quick-search-textbox
- related-box (related tab in the item pane)
- tags-box (tags tab in the item pane)
- zoterosearch (advanced search condition builder form)
2023-04-01 01:37:55 -04:00
Tom Najdek
fc572ba2a6
fx-compat: Convert Publications dialog to CE 2023-03-23 14:16:51 +01:00
Tom Najdek
c65e8f1621
fx-compat: Convert rtfScan to use CE wizards
Also:
* Adds Style Configurator CE
* Extends "base" CE to enable fluent l10n
2023-03-23 14:16:51 +01:00
Tom Najdek
5ea43bd65c
fx-compat: Convert import wizard to use CE 2023-03-21 20:42:43 +01:00
Tom Najdek
13cc393840
fx-compat: long tag fixer (#2649)
* Manual tag splitting from tag selector
* Only apply split to the tag in current library
* Preserve tag type
2023-03-16 21:20:11 -04:00
Abe Jellinek
4b09edfa42
fx-compat: Add color picker CE (#2682) 2022-11-21 02:48:16 -05:00
Abe Jellinek
74492e40c4
Improve bidi & RTL support (#2415)
- Render cell text in its native direction
- Fix context menu positioning
- Fix item box (localizations needed)
- Fix column resizing
- Fix bidi text in collection tree
- Always right-align in RTL, always left-align in LTR.
  I'm going off advice from this excellent guide for RTL website design
  by Ahmad Shadeed: https://rtlstyling.com/posts/rtl-styling#tables
- Join creators in the tree ("Smith and Jones") using a format string to
  support languages like Arabic and Hebrew where there shouldn't be a
  space after the "and".
- Fix tabs
- Fix toolbar on Mac, flip icons on other platforms
2022-11-20 18:23:17 -05:00
Abe Jellinek
b646073dfa fx-compat: Fix style clash on disabled Export checkbox 2022-08-27 22:33:45 -04:00
Abe Jellinek
9ab813ebdc fx-compat: Item box: Vertically center field contents
Fixes alignment of the "y m d" label on the date field and the buttons to the
right of creator fields.
2022-08-11 16:46:03 -04:00
Abe Jellinek
1315d02b2c fx-compat: Item box: Correct value margins, remove type dropmarker 2022-08-05 16:12:28 -04:00
Abe Jellinek
d4cd382092 fx-compat: Fix quick search height shifting 2022-08-01 15:36:06 -04:00
Abe Jellinek
1ecb12048c fx-compat: Item box: Restore label top alignment 2022-08-01 14:20:34 -04:00
Abe Jellinek
dc0b2ceb8b fx-compat: Item box: Make sure input has room 2022-07-21 16:18:32 -04:00
Abe Jellinek
808375d5e3 fx-compat: Item box: Fix creator name field sizing
Not the exact same sizing as Fx60, because that relied on some quirks
of the Mozilla box model that I can't reproduce with flexbox, but still
works about as well.
2022-07-21 16:12:28 -04:00
Abe Jellinek
37a6cc4de4 fx-compat: Item box: Fix date added/modified alignment
This CSS needs some serious cleanup, but we're getting somewhere.
2022-07-21 11:30:35 -04:00
Abe Jellinek
aeef51bc76 fx-compat: Item box: Clean up spacing 2022-07-21 11:17:31 -04:00
Abe Jellinek
1a8057aba1 fx-compat: Item box: Restore drop marker 2022-07-21 10:20:42 -04:00
Abe Jellinek
26a2398399 fx-compat: Restore guidance panels as CE
Fixes #2711.
2022-07-20 11:12:52 -04:00
Abe Jellinek
9a8e78aaf4
fx-compat: Restore quick search menu and update styles (#2684) 2022-07-06 23:42:23 -04:00
Abe Jellinek
137c82c690 fx-compat: Make item table container vertical
Fixes retraction notice appearing to the left of the item metadata.
2022-07-05 15:40:33 -04:00
Abe Jellinek
8face792c0
fx-compat: Fix search dialogs (#2631) 2022-07-04 01:48:52 -04:00
Abe Jellinek
d2dbf959b6 fx-compat: Restore old row highlight color on macOS
https://github.com/zotero/zotero/pull/2660#issuecomment-1159384470
2022-06-18 17:50:52 -05:00
Abe Jellinek
c31df4ae6b fx-compat: Display item box using CSS grid
- Widths are now correct
- Rows are a little too tall
- Field value vertical alignment is off
- Platform styling isn't done and some styles might be redundant
- Still can't scroll vertically
- Creator name inputs still displayed wrong
2022-06-16 16:27:16 -05:00
Abe Jellinek
7dd60abb11 fx-compat: Exclude menulist from clicky :active styling
Menulists only get :active for the split second when they're clicked but
the menupopup hasn't yet been shown.
2022-06-10 11:41:04 -05:00
Martynas Bagdonas
3eb65eef4f fx-compat: Fix tab text alignment 2022-06-09 16:41:24 +03:00
Martynas Bagdonas
2e5388af5b fx-compat: Implement tagsBox element 2022-06-07 17:13:48 +03:00
Abe Jellinek
1ef40d9423 fx-compat: Fix attachment box 2022-05-27 12:56:13 -06:00
Martynas Bagdonas
307701788f fx-compat: Fix and extract notesBox into a separate element 2022-05-27 13:21:18 +03:00
Abe Jellinek
ed572df563 fx-compat: 2xize clicky 2022-05-26 12:38:42 -06:00
Martynas Bagdonas
db0ac723fa fx-compat: Note editor and links box fixes:
- Add links-box component (inside noteEditor.js).
- Add related-box component and fix related pane.
- Use tagsBox.jsx instead of tagsbox.xml in note editor links box popup.
- Remove CSS styles and bindings for noteeditor, relatedbox and tagsbox.
2022-05-26 18:23:31 +03:00
Abe Jellinek
27e5e3ca29 fx-compat: Item box: Visual fixes
- Override normal cursor on Abstract label
- Disable textarea resize
- Show clicky hover/active backgrounds on Item Type menu
2022-05-25 13:34:57 -06:00
Abe Jellinek
fdd73d4ada fx-compat: Item box: Fix multiline fields & autocomplete 2022-05-24 15:42:54 -06:00
Dan Stillman
260c110d05 fx-compat: Convert itembox XBL to custom element
Still lots of things to fix, particularly with styling, but the basic
functionality is there.
2022-05-13 04:28:56 -04:00
Dan Stillman
3c6f0b26af Move .zotero-clicky to its own SCSS component
This will allow it to be included in shadow DOM.
2022-05-12 05:18:47 -04:00
Adomas Ven
c49a05d486
Improve column resizing robustness (#2588)
Also:

* Add staticWidth and minWidth column properties
2022-05-03 03:00:23 -04:00
Martynas Bagdonas
01645c5e51
Pin library tab (#2589)
Fixes #2575
2022-05-03 01:21:59 -04:00