Gabe Kangas
ccb9b5d075
chore: run stylelint on our css files
2023-06-20 20:58:00 -07:00
Gabe Kangas
69f217f758
Refactor mobile chat into modal ( #3038 )
...
* feat(mobile): refactor mobile chat into modal
- Make page always scrollable
- Move mobile chat into a standalone modal
* fix(test): split out mobile browser test specs
* fix(mobile): force chat button to render on top of footer
* fix: some small updates from review
* fix: hide/show hide chat menu option based on width
* fix: chat button icon getting cut off
* chore(tests): add browser tests for mobile chat modal
* chore(tests): add story for ChatModal component
* fix(test): quiet shellcheck
* fix: remove unused import
* fix(tests): silence storybook linting warning
* fix(ui): reposition chat modal button icon with transform
2023-05-22 18:56:44 -07:00
Gabe Kangas
77eb491943
fix(header): change border to outline to resolve logo rendering. Closes #3000
2023-05-18 18:13:23 -07:00
Nathan
04848c1d8c
fix:#2954-player-gets-cut-off-vertically ( #2987 )
...
* fix:#2954-player-gets-cut-off-vertically
* Use header-height variable everywhere
---------
Co-authored-by: thisProjects <wibbet@wobbet.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2023-05-05 11:10:28 -07:00
Nathan
32c3f6a9b6
fix : #2668 Page Vertical Spacing Issues ( #2863 )
...
* fix : #2668 Page Vertical Spacing Issues
* Update test to reflect mobile work
* chore: refactor action buttons
---------
Co-authored-by: thisProjects <wibbet@wobbet.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2023-04-26 15:31:23 -07:00
Gabe Kangas
04107ba0fe
feat(header): give logo a slight border
2023-04-25 20:43:04 -07:00
Gabe Kangas
0f04e1d305
fix(header): remove padding from header avatar
2023-04-25 20:33:03 -07:00
gingervitis
44483a45d3
some webv2 UI polish ( #2940 )
...
* style tweaks for Action Button, UserMenu, Modal
* a bunch of misc polish; some around chat
* Prettified Code!
* cleanup
* fix formatting
* Reduce content padding a bit
* some stylesheet cleanup
* fix action button sizing
* Remove action button height completely
---------
Co-authored-by: gingervitis <gingervitis@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2023-04-24 10:58:57 -07:00
Gabe Kangas
70e4d84c42
feat(header): use instance logo for header image
2023-04-22 11:50:11 -07:00
Gabe Kangas
8b8f221eb4
Show streamTitle in header if set. Closes #2720
2023-02-22 18:52:25 -08:00
Gabe Kangas
070a9fa675
Tweak offline tag color and cursor
2023-02-20 09:39:54 -08:00
Gabe Kangas
60f5b41a3d
Fix the incorrect header spacing across all text
2023-02-13 22:00:53 -08:00
Michael David Kuckuk
25119561fb
Give chat a min-height that other elements yield to on mobile clients ( #2676 )
...
* Add className prop to some components
* Give mobile chatbox height priority over other elements
* Optimize for mobile landscape mode
* Make thumbnail background black
* Fix overflow issues on narrow screens
* Adjust layout for offline mode on mobile
* Fix main content width on Desktop
* Fix offline layout for desktop
2023-02-08 18:50:58 -08:00
Gabe Kangas
23d2a4dab5
Set a diff threshold to header story
2023-01-30 15:33:16 -08:00
Gabe Kangas
72cc7cb443
Add skip link to offline message
2023-01-29 16:31:52 -08:00
Gabe Kangas
8af332e129
Decrease header height. Add padding.
2023-01-28 19:29:03 -08:00
Gabe Kangas
8bacd776bc
Remove redundant title attribute from header. Closes #2620
2023-01-24 19:43:17 -08:00
Gabe Kangas
cdaae66e94
Add skip links for content, player and footer. For #1826
2023-01-21 23:22:28 -08:00
Gabe Kangas
d8a5380b7f
Fix some React lifecycle and rendering errors that exist in build
2023-01-10 16:39:20 -08:00
Gabe Kangas
73fbb4c075
Use header tag
2023-01-10 01:09:49 -08:00
Gabe Kangas
cfaeda94b0
Lazy load more components. #2167
2023-01-10 00:37:12 -08:00
Gabe Kangas
29882f1291
Lazy load tooltip
2023-01-10 00:37:11 -08:00
André Rusakow
0a602edf5e
Double scrollbars ( #2509 )
...
* hide footer on mobile to avoid double scrollbars
* fix double scrollbars on desktop by removing scroll behaviour from main section
* add scrollbar styles to body and html
* add vertical scrolling back to main section
* prevent header from collapsing and messing around with scrolling
* prevent body from scrolling for main layout
* move tablet breakpoint into breakpoint mixin
* preffify code
* remove js height calc for lower section on mobile and use css
* enable scrolling within a tab on mobile
* remove scrollbar from main section on mobile
* adjust header height on mobile
* add react use to web
* lock body scroll for main layout
2022-12-29 10:14:12 -08:00
André Rusakow
53d3a67533
hide user name in user dropdown on mobile ( #2512 )
...
* hide user name in user dropdown on mobile
* truncate title in header
* prettify code
* Add line height to prevent cutting of lower length letters
2022-12-26 14:09:52 -08:00
Gabe Kangas
5c01efd3e2
Wrap title in header tag. Do not allow it to wrap. Closes #2474 #2446
2022-12-24 16:45:45 -08:00
Gabe Kangas
c231fd3592
First pass at CSS identifiers + test to verify they are set. For #2193
2022-12-11 21:06:20 -08:00
Gabe Kangas
047e61133a
Reduce the height of the header
2022-12-08 14:35:57 -08:00
Gabe Kangas
352447e3d4
Web UI frontend automated browser tests ( #2223 )
...
* First pass at basic browser tests for #1926
* Run tests against dev web server not go server
* Bundle the web code into the server before running tests
* Move cypress UI tests into its own npm project + add tests
* Add additional tests + wire up with cypress dashboard
* Limit concurrency of workflow jobs
* Temporarily comment out some tests that do not pass in mobile. Will fix later.
2022-11-04 20:04:13 -07:00
t1enne
917248fc5b
moved footer to layout. changed some css
2022-10-22 10:46:17 +02:00
t1enne
ecfb4a4c53
fixed mobile ui overflowing
2022-10-20 20:25:54 +02:00
Gabe Kangas
8ee9be5d88
Support disabled chat. Closes #1979
2022-09-10 20:03:58 -07:00
Gabe Kangas
0430adc502
Add mobile-specific tabs+content
2022-09-10 12:08:28 -07:00
James Young
d1f3fffe2f
reafctor: normalize component formatting ( #2082 )
...
* refactor: move/rename BanUserButton file
* refactor: move/rename Chart file
* refactor: update generic component filenames to PascalCase
* refactor: update config component filenames to PascalCase
* refactor: update AdminLayout component filename to PascalCase
* refactor: update/move VideoJS component
* chore(eslint): disable bad react/require-default-props rule
* refactor: normalize ActionButton component
* refactor: normalize ActionButtonRow component
* refactor: normalize FollowButton component
* refactor: normalize NotifyButton component
* refactor: normalize ChatActionMessage component
* refactor: normalize ChatContainer component
* refactor: normalize ChatJoinMessage component
* refactor: normalize ChatModerationActionMenu component
* refactor: normalize ChatModerationDetailsModal component
* refactor: normalize ChatModeratorNotification component
* refactor: normalize ChatSocialMessage component
* refactor: normalize ChatSystemMessage component
* refactor: normalize ChatTextField component
* refactor: normalize ChatUserBadge component
* refactor: normalize ChatUserMessage component
* refactor: normalize ContentHeader component
* refactor: normalize OwncastLogo component
* refactor: normalize UserDropdown component
* chore(eslint): modify react/function-component-definition rule
* refactor: normalize CodecSelector component
* refactor: update a bunch of functional components using eslint
* refactor: update a bunch of functional components using eslint, pt2
* refactor: update a bunch of functional components using eslint, pt3
* refactor: replace all component->component default imports with named imports
* refactor: replace all component-stories->component default imports with named imports
* refactor: remove default exports from most components
* chore(eslint): add eslint config files for the components and pages dirs
* fix: use-before-define error in ChatContainer
* Fix ChatContainer import
* Only process .tsx files in Next builds
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2022-09-07 00:00:28 -07:00
James Young
5ebbbb8bf2
refactor(stories): co-locate stories with components ( #2078 )
...
* refactor: move ActionButton component
* refactor: move BanUserButton component
* refactor: move ChatActionMessage component
* refactor: move ChatContainer component
* refactor: move AuthModal component
* refactor: move BrowserNotifyModal component
* refactor: move ChatUserMessage component
* refactor: move ChatJoinMessage component
* refactor: move ChatTextField component
* refactor: move ChatUserBadge component
* refactor: move FollowerCollection and SingleFollower components
* fix: bad import path
* refactor: move FollowModal component
* refactor: move Modal component
* refactor: move ContentHeader component
* refactor: move ChatSystemMessage component
* refactor: move Header component
* refactor: move Footer component
* refactor: move StatusBar component
* refactor: move OfflineBanner component
* refactor: move OwncastPlayer component
* refactor: move IndieAuthModal component
* refactor: move SocialLinks component
* refactor: move VideoPoster component
* refactor: move FollowModal component
* refactor: move FediAuthModal.tsx component
* refactor: move UserDropdown component
* refactor: move ChatSocialMessage component
* refactor: move Logo component
* refactor: move NotifyReminderPopup component
* refactor: move NameChangeModal component
* refactor: move FatalErrorStateModal component
* refactor: move ChatModeratorNotification component
* refactor: move ChatModerationActionMenu and ChatModerationDetailsModal components
* refactor: move CustomPageContent component
* refactor: move storybook Introduction file
* refactor: update storybook story import path
* refactor: move storybook preview styles
* refactor: move storybook doc pages
* refactor: move Color and ImageAsset components
* fix: bad import path
* fix: bad import path in story file
2022-09-03 11:38:52 -07:00
gingervitis
d5fa81f76e
Draft: rough-ish draft of proposed color theme changes ( #2067 )
...
* color experimentation and troubleshooting
* create color scheme, assign colors, more ant overrides
* fun selection color
* Prettified Code!
* Correctly import opensans
* Prettified Code!
* Organize+standardize colors/names and update the app to use them
* Prettified Code!
* Use css var references instead of resolving value of vars in css files
* Prettified Code!
Co-authored-by: gingervitis <gingervitis@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
Co-authored-by: gabek <gabek@users.noreply.github.com>
2022-08-29 23:17:12 -07:00
t1enne
efbe6907ac
Reworked mobile UI for some components
2022-07-08 22:20:22 +02:00
t1enne
ffc73f2760
Added chat tab on mobile layouts and other changes to mobile UI
2022-07-08 09:10:18 +02:00
Gabe Kangas
5a51b2d779
Change cursor to pointer
2022-05-26 11:31:45 -07:00
Gabe Kangas
b3407cbdea
Remove user menu when chat is not available
2022-05-26 11:08:37 -07:00
Gabe Kangas
7b1667bf6a
Refactor app state to be a state machine with access selectors
2022-05-25 21:47:09 -07:00
t1enne
a69ec7511a
Changed Layout a bit
...
now we use less state for the layout. Chat and header are now sticky.
Moved some css vars.
2022-05-17 08:41:39 +02:00
Gabe Kangas
e0f8a1f702
More accurately hide/show and track chat state
2022-05-13 14:44:16 -07:00
Gabe Kangas
72c01e1b9a
Fix web project build errors
2022-05-11 23:31:31 -07:00
t1enne
00bc662c7f
Changed Logo and Header
...
logo has two variants. Changed story to reflect that. Updated header
2022-05-08 10:45:45 +02:00
t1enne
93d69a26eb
Moved UserDropdown to comps/common/, updated imports, some styling on Header
2022-05-08 09:41:47 +02:00
Gabe Kangas
e5d3b0e4ee
More blank components and stories to be filled in
2022-04-28 14:36:05 -07:00
t1enne
b90eadcb4e
restructured components folders and layout ( #1886 )
2022-04-28 09:54:33 -07:00