haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-07 18:03:48 +00:00
Code Issues Releases Wiki Activity

change file chooser classname (#6594)

Browse Source
This commit is contained in:
Michael An
2024-08-21 14:41:29 +08:00
committed by GitHub
parent fc9fe44055
commit 6b3b497a04
2 changed files with 19 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/components/file-chooser/file-chooser.js
View File

@@ -443,12 +443,12 @@ class FileChooser extends React.Component {
const recentlyUsedList = JSON.parse(localStorage.getItem('recently-used-list')) || []; const recentlyUsedList = JSON.parse(localStorage.getItem('recently-used-list')) || [];
return ( return (
<div className='scroll-wrapper' onScroll={this.onScroll}> <div className='file-chooser-scroll-wrapper' onScroll={this.onScroll}>
<div className="file-chooser-container user-select-none" > <div className="file-chooser-container user-select-none">
{mode === 'current_repo_and_other_repos' && ( {mode === 'current_repo_and_other_repos' && (
<Fragment> <Fragment>
<div className="list-view"> <div className="list-view">
<div className="list-view-header"> <div className="file-chooser-list-view-header">
<span className={`item-toggle sf3-font ${isCurrentRepoShow ? 'sf3-font-down' : 'sf3-font-down rotate-270 d-inline-block'}`} onClick={this.onCurrentRepoToggle}></span> <span className={`item-toggle sf3-font ${isCurrentRepoShow ? 'sf3-font-down' : 'sf3-font-down rotate-270 d-inline-block'}`} onClick={this.onCurrentRepoToggle}></span>
<span className="library">{gettext('Current Library')}</span> <span className="library">{gettext('Current Library')}</span>
</div> </div>
@@ -469,7 +469,7 @@ class FileChooser extends React.Component {
} }
</div> </div>
<div className="list-view"> <div className="list-view">
<div className="list-view-header"> <div className="file-chooser-list-view-header">
<span className={`item-toggle sf3-font ${isOtherRepoShow ? 'sf3-font-down' : 'sf3-font-down rotate-270 d-inline-block'}`} onClick={this.onOtherRepoToggle}></span> <span className={`item-toggle sf3-font ${isOtherRepoShow ? 'sf3-font-down' : 'sf3-font-down rotate-270 d-inline-block'}`} onClick={this.onOtherRepoToggle}></span>
<span className="library">{gettext('Other Libraries')}</span> <span className="library">{gettext('Other Libraries')}</span>
</div> </div>
@@ -511,7 +511,7 @@ class FileChooser extends React.Component {
{mode === 'only_all_repos' && ( {mode === 'only_all_repos' && (
<div className="file-chooser-container"> <div className="file-chooser-container">
<div className="list-view"> <div className="list-view">
<div className="list-view-header"> <div className="file-chooser-list-view-header">
<span className="item-toggle sf3-font sf3-font-down"></span> <span className="item-toggle sf3-font sf3-font-down"></span>
<span className="library">{gettext('Libraries')}</span> <span className="library">{gettext('Libraries')}</span>
</div> </div>

48
frontend/src/css/file-chooser.css
View File

@@ -131,53 +131,33 @@
border-bottom: 1px solid rgba(0, 0, 0, 0); border-bottom: 1px solid rgba(0, 0, 0, 0);
} }
.item-toggle { .file-chooser-scroll-wrapper {
width: 1.5rem; max-height: 100%;
height: 1.5rem; overflow: auto;
line-height: 1.5rem !important;
color: #c0c0c0;
text-align: center;
cursor: pointer;
} }
.list-view-content { .file-chooser-scroll-wrapper .list-view-content {
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style: none; list-style: none;
} }
.list-view-header { .file-chooser-scroll-wrapper .list-view-content .item-toggle {
width: 1.5rem;
height: 1.5rem;
line-height: 1.5rem !important;
text-align: center;
}
.file-chooser-list-view-header {
position: relative; position: relative;
padding-left: 1.5rem; padding-left: 1.5rem;
} }
.list-view-header:hover { .file-chooser-list-view-header:hover {
background-color: #f5f5f5; background-color: #f5f5f5;
} }
.list-view-header .name { .file-chooser-list-view-header .name {
color: #eb8205; color: #eb8205;
} }
.scroll-wrapper {
max-height: 100%;
overflow: auto;
}
.searched-active {
background: #f3af7d !important;
border-radius: 2px;
box-shadow: inset 0 0 1px #999;
}
.searched-active .icon {
color: #fff !important;
}
.searched-active td {
color: #fff;
}
.select-open-repo {
background: #fdefb9;
}