Responsiveness and tabs #179

enes · 2024-09-04T12:18:07Z

enes commented

2024-09-04 12:18:07 +00:00

Responsiveness:

Add tabs for mobile screens
Allow navigation between the tabs with touch (natural swipe gesture, one by one) and on tab clicks
Limit the height of the tab to dynamic viewport height (dvh)
Allow the toolbox and file list to grow up to a height cap (dvh size)
Stop inputs and counterparties section from shrinking
Drawing: Update all mouse events to use pointer events (pointerDown, pointerUp, pointerMove)
Drawing only on mobile: Disable create resizing, a create a DEFAULT_SIZE rect and use handle to resize instead

Additional:

Adjust footer to use react portal and add as needed per page route (can be placed anywhere and will show up at the bottom of main)
Add intersection observer to track buttons active tab state
Add small loading spinner variant
Update default loading spinner
Split viewers and signers in the sigit details section
Add mark colors based on the user hex
Add UX feedback when mark is being dragged (opacity) and resized (resize handle color)

Fixes:

Add missing alt attributes on the images
Optimize pdf worker code to use single worker
Fix over-scroll showing different background color

Closes #177

Responsiveness: - Add tabs for mobile screens - Allow navigation between the tabs with touch (natural swipe gesture, one by one) and on tab clicks - Limit the height of the tab to dynamic viewport height (`dvh`) - Allow the toolbox and file list to grow up to a height cap (`dvh` size) - Stop `inputs` and counterparties section from shrinking - Drawing: Update all `mouse` events to use `pointer` events (`pointerDown`, `pointerUp`, `pointerMove`) - Drawing only on mobile: Disable create resizing, a create a `DEFAULT_SIZE` rect and use handle to resize instead Additional: - Adjust `footer` to use react portal and add as needed per page route (can be placed anywhere and will show up at the bottom of `main`) - Add intersection observer to track buttons active tab state - Add small loading spinner variant - Update default loading spinner - Split `viewers` and `signers` in the sigit details section - Add `mark` colors based on the user hex - Add UX feedback when mark is being `dragged` (opacity) and `resized` (resize handle color) Fixes: - Add missing alt attributes on the images - Optimize pdf worker code to use single worker - Fix over-scroll showing different background color Closes #177

enes added 22 commits 2024-09-04 12:18:07 +00:00

refactor(toolbox): responsiveness and cleanup 5c8cbc1956

refactor(sticky-columns-layout): initial responsiveness and breakpoints b3564389f9

refactor(footer): make footer a portal and use as needed a48751b9a8

chore(browser-warn): add alt attribute to image 156bc59e1a

chore(browser-warn): add alt attribute to image, part 2 2367eb1887

feat(mobile): tabs and scrolling d9be05165f

fix(mobile): active tab default state and styling 6f7d4c9dcf

refactor(content): add small loading spinner to content sections f8533b0ffd

Closes #141

refactor: split signers and viewers in the users section bee566424d

fix(create): block if no signers 15aaef948d

refactor(mobile): styling for sign actions box 2e9e9b0a06

refactor(mobile): tabs navigation, observer active for tabs, tabs layout scrolling be9bfc28c8

refactor: files styling, move styling reset to app from module 6abdb0ae2b

refactor(spinner): new default design d627db5ac0

refactor(spinner): use data variant for styles e5f8b797bb

fix(spinner): remove dummy desc and use variants d1b9eb55d8

refactor(pdf-dist): optimize workers c2d065a8a5

fix: main css background, avoid overscroll showing white edge 757012399a

refactor(mobile): drawing mouse to pointer events, field colors and actions feedback, touch action b20ffe6e87

fix(pdf): use minified version of pdf a3effd878b

fix(mobile): use dynamic vh and one-by-one horizontal scroll 36281376bc

fix(tabs): add tab icons

Open PR on Staging / audit_and_check (pull_request) Successful in 34s

Details

2be7f3d51b

enes changed title from ~~177-sticky-side-columns~~ to Responsiveness and tabs

2024-09-04 12:18:44 +00:00

enes added 1 commit 2024-09-04 12:44:40 +00:00

refactor(drawing): fix mouse comments, use pointer

Open PR on Staging / audit_and_check (pull_request) Successful in 34s

Details

9223857e18

b reviewed 2024-09-04 18:40:16 +00:00

src/App.scss

						
				@ -73,0 +80,4 @@

				li {

				  list-style-type: none; /* Removes the bullets */

				  margin: 0; /* Removes any default margin */

				  padding: 0; /* Removes any default padding */

b commented

2024-09-04 18:40:16 +00:00

loving these comments

b approved these changes 2024-09-04 18:41:47 +00:00

eugene approved these changes 2024-09-05 06:31:51 +00:00

enes merged commit 7d0d4fcb48 into staging

2024-09-05 07:30:55 +00:00

enes deleted branch 177-sticky-side-columns

2024-09-05 07:30:55 +00:00

enes referenced this issue from a commit

2024-09-05 07:30:57 +00:00

chore(git): merge pull request #179 from 177-sticky-side-columns into staging

Sign in to join this conversation.

3 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: sigit/sigit.io#179