Skip to content

Develop #663

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ShaneIsrael merged 2 commits into from
Jun 13, 2026
Merged

Develop #663

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
60defa9
fix mobile card view, remove card resize slider
ShaneIsrael Jun 13, 2026
c49c369
bump version
ShaneIsrael Jun 13, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion app/client/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "fireshare",
"version": "1.7.0",
"version": "1.7.1",
"private": true,
"dependencies": {
"@emotion/react": "^11.9.0",
Expand Down
7 changes: 2 additions & 5 deletions app/client/src/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,6 @@ export default function App() {
collapsed={!drawerOpen}
searchable
styleToggle
cardSlider
searchPlaceholder="Search title, game, or #tag..."
>
<Dashboard />
Expand Down Expand Up @@ -97,7 +96,7 @@ export default function App() {
path="/games/:gameId"
element={
<AuthWrapper>
<MainNavbar page="/games" collapsed={!drawerOpen} styleToggle cardSlider searchable mainPadding={0}>
<MainNavbar page="/games" collapsed={!drawerOpen} styleToggle searchable mainPadding={0}>
<GameVideos />
</MainNavbar>
</AuthWrapper>
Expand All @@ -121,7 +120,6 @@ export default function App() {
page="/folders"
collapsed={!drawerOpen}
styleToggle
cardSlider
mainPadding={0}
searchable
searchPlaceholder="Search title..."
Expand All @@ -145,7 +143,7 @@ export default function App() {
path="/tags/:tagId"
element={
<AuthWrapper>
<MainNavbar page="/tags" collapsed={!drawerOpen} styleToggle cardSlider searchable mainPadding={0}>
<MainNavbar page="/tags" collapsed={!drawerOpen} styleToggle searchable mainPadding={0}>
<TagVideos />
</MainNavbar>
</AuthWrapper>
Expand All @@ -169,7 +167,6 @@ export default function App() {
page="/images"
collapsed={!drawerOpen}
styleToggle
cardSlider
searchable
searchPlaceholder="Search title, game, or #tag..."
>
Expand Down
8 changes: 5 additions & 3 deletions app/client/src/components/cards/VideoCards.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -194,9 +194,11 @@ const VideoCards = ({
ref={containerRef}
sx={{
display: 'grid',
width: isSingleColumn ? 'calc(100% + 48px)' : '100%',
justifyContent: isSingleColumn ? 'center' : 'start',
gridTemplateColumns: `repeat(auto-fill, minmax(min(100%, ${size}px), ${size}px))`,
width: '100%',
justifyContent: 'start',
gridTemplateColumns: isSingleColumn
? '1fr'
: `repeat(auto-fill, minmax(min(100%, ${size}px), ${size}px))`,
gap: 2,
}}
>
Expand Down
33 changes: 15 additions & 18 deletions app/client/src/components/nav/MainNavbar.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ import ReleaseNotesDialog from '../modal/ReleaseNotesDialog'

const drawerWidth = 240
const minimizedDrawerWidth = 57
const CARD_SIZE_MULTIPLIER = 2
const CARD_SIZE = 300
const DEMO_BANNER_HEIGHT = 34

const allPages = [
Expand Down Expand Up @@ -149,7 +149,6 @@ function MainNavbar({
collapsed = false,
searchable = false,
searchPlaceholder = 'Search videos...',
cardSlider = false,
toolbar = true,
mainPadding = 3,
children,
Expand Down Expand Up @@ -673,28 +672,18 @@ function MainNavbar({
</IconButton>
)}

{/* Mobile: left content (when search not open) */}
{isMobile && !mobileSearchOpen && (
<Box
sx={{ flex: 1, display: 'flex', alignItems: 'center', minWidth: 0, overflow: 'hidden' }}
id="navbar-toolbar-left-mobile"
/>
)}

{/* Desktop: left content + centered search */}
{!isMobile && (
<Box sx={{ flex: '1 0 auto', display: 'flex', alignItems: 'center' }} id="navbar-toolbar-left" />
)}
{/* Desktop: left spacer + centered search */}
{!isMobile && <Box sx={{ flex: 1 }} />}
{searchable && !isMobile && (
<Box id="navbar-search-container" sx={{ width: 520, flexShrink: 3, minWidth: 0, mr: 1, ml: 2 }}>
<Box id="navbar-search-container" sx={{ width: 520, flexShrink: 1, minWidth: 0, mr: 1, ml: 2 }}>
<Search placeholder={searchPlaceholder} searchHandler={(value) => setSearchText(value)} />
</Box>
)}

{/* Right controls — always in DOM so portal target stays valid */}
<Box
sx={{
flex: isMobile ? '0 0 auto' : '1 0 auto',
flex: 1,
display: isMobile && mobileSearchOpen ? 'none' : 'flex',
justifyContent: 'flex-end',
alignItems: 'center',
Expand Down Expand Up @@ -771,7 +760,15 @@ function MainNavbar({
sx={{
flexGrow: 1,
minHeight: 0,
p: page !== '/watch' && page !== '/image' ? mainPadding : 0,
// Horizontal padding is dropped on mobile for media/list pages so video cards
// can sit edge-to-edge and fill the screen; forms keep their padding.
px:
page === '/watch' || page === '/image'
? 0
: page === '/settings' || page === '/files'
? mainPadding
: { xs: 0, sm: mainPadding },
py: page !== '/watch' && page !== '/image' ? mainPadding : 0,
width: { sm: `calc(100% - ${open ? drawerWidth : minimizedDrawerWidth}px)` },
overflowX: 'hidden',
overflowY: 'auto',
Expand All @@ -791,7 +788,7 @@ function MainNavbar({
authenticated,
isAdmin,
searchText,
cardSize: 300,
cardSize: CARD_SIZE,
selectedFolder: effectiveFolder,
onFolderChange: handleFolderChange,
onFoldersLoaded: handleFoldersLoaded,
Expand Down
Loading