github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #9833 from overleaf/revert-9559-jel-dash-scroll

Browse source 
Revert "[web] Project dashboard scrolling"

GitOrigin-RevId: dc18d2717714b8c044a5c2bd04c3bef0b579663d
This commit is contained in:
Jessica Lawshe 2022-10-03 09:17:27 -05:00 committed by Copybot
parent 07a68a5a57
commit 6095e63c7d
2 changed files with 100 additions and 84 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

146
services/web/frontend/js/features/project-list/components/project-list-root.tsx
View file

@ -45,81 +45,81 @@ function ProjectListPageContent() {
<LoadingBranded loadProgress={loadProgress} /> <LoadingBranded loadProgress={loadProgress} />
</div> </div>
) : ( ) : (
<div className="project-list-wrapper clearfix"> <div className="project-list-row fill">
{error ? <DashApiError /> : ''} <div className="project-list-wrapper clearfix">
{totalProjectsCount > 0 ? ( {error ? <DashApiError /> : ''}
<> {totalProjectsCount > 0 ? (
<div className="project-list-sidebar-wrapper-react hidden-xs"> <>
<aside className="project-list-sidebar"> <div className="project-list-sidebar-wrapper hidden-xs">
<NewProjectButton id="new-project-button-sidebar" /> <aside className="project-list-sidebar">
<SidebarFilters /> <NewProjectButton id="new-project-button-sidebar" />
</aside> <SidebarFilters />
<SurveyWidget /> </aside>
</div> <SurveyWidget />
<div className="project-list-main-react">
<Row>
<Col xs={12}>
<UserNotifications />
</Col>
</Row>
<Row>
<Col md={7} className="hidden-xs">
<SearchForm
inputValue={searchText}
setInputValue={setSearchText}
/>
</Col>
<Col md={5}>
<div className="project-tools">
<div className="hidden-xs">
{selectedProjects.length === 0 ? (
<CurrentPlanWidget />
) : (
<ProjectTools />
)}
</div>
<div className="visible-xs">
<CurrentPlanWidget />
</div>
</div>
</Col>
</Row>
<div className="visible-xs mt-1">
<div role="toolbar" className="projects-toolbar">
<ProjectsDropdown />
<SortByDropdown />
</div>
</div> </div>
<Row className="row-spaced"> <div className="project-list-main">
<Col xs={12}> <Row>
<div className="card project-list-card"> <Col xs={12}>
<div className="visible-xs pt-2 pb-3"> <UserNotifications />
<div className="clearfix"> </Col>
<NewProjectButton </Row>
id="new-project-button-projects-table" <Row>
className="pull-left me-2" <Col md={7} className="hidden-xs">
/> <SearchForm
<SearchForm inputValue={searchText}
inputValue={searchText} setInputValue={setSearchText}
setInputValue={setSearchText} />
className="overflow-hidden" </Col>
formGroupProps={{ className: 'mb-0' }} <Col md={5}>
/> <div className="project-tools">
<div className="hidden-xs">
{selectedProjects.length === 0 ? (
<CurrentPlanWidget />
) : (
<ProjectTools />
)}
</div>
<div className="visible-xs">
<CurrentPlanWidget />
</div> </div>
</div> </div>
<ProjectListTable /> </Col>
</Row>
<div className="visible-xs mt-1">
<div role="toolbar" className="projects-toolbar">
<ProjectsDropdown />
<SortByDropdown />
</div> </div>
</Col> </div>
</Row> <Row className="row-spaced">
<Row className="row-spaced"> <Col xs={12}>
<Col xs={12}> <div className="card project-list-card">
<LoadMore /> <div className="visible-xs pt-2 pb-3">
</Col> <div className="clearfix">
</Row> <NewProjectButton
</div> id="new-project-button-projects-table"
</> className="pull-left me-2"
) : ( />
<div className="project-list-welcome-wrapper"> <SearchForm
inputValue={searchText}
setInputValue={setSearchText}
className="overflow-hidden"
formGroupProps={{ className: 'mb-0' }}
/>
</div>
</div>
<ProjectListTable />
</div>
</Col>
</Row>
<Row className="row-spaced">
<Col xs={12}>
<LoadMore />
</Col>
</Row>
</div>
</>
) : (
<Row className="row-spaced"> <Row className="row-spaced">
<Col <Col
xs={8} xs={8}
@ -131,8 +131,8 @@ function ProjectListPageContent() {
<WelcomeMessage /> <WelcomeMessage />
</Col> </Col>
</Row> </Row>
</div> )}
)} </div>
</div> </div>
) )
} }

38
services/web/frontend/stylesheets/app/project-list-react.less
View file

@ -24,13 +24,23 @@
} }
} }
.project-list-wrapper { .project-list-row {
display: flex; height: 100%;
align-items: stretch; min-height: calc(~'100vh -' @header-height);
} }
.project-list-sidebar-wrapper-react { .project-list-wrapper {
flex: 0 0 15%; position: absolute;
width: 100%;
height: 100%;
}
.project-list-sidebar-wrapper {
float: left;
position: static;
width: 15%;
min-width: 160px;
.project-list-sidebar { .project-list-sidebar {
> .dropdown { > .dropdown {
width: 100%; width: 100%;
@ -42,12 +52,12 @@
} }
} }
.project-list-welcome-wrapper { .project-list-main {
width: 100%; position: static;
} overflow: auto;
padding-left: @grid-gutter-width / 2;
.project-list-main-react { padding-right: @grid-gutter-width / 2;
padding: @content-margin-vertical @grid-gutter-width / 2; margin-left: initial;
} }
ul.folders-menu { ul.folders-menu {
@ -560,6 +570,12 @@
} }
} }
.project-list-react.container,
.project-list-react .project-list-sidebar-wrapper,
.project-list-react .project-list-main {
height: 100%;
}
.current-plan { .current-plan {
vertical-align: middle; vertical-align: middle;
line-height: @line-height-base; line-height: @line-height-base;