haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-24 09:41:04 +00:00
Code Issues Releases Wiki Activity

optimzied ui

Browse Source
This commit is contained in:
shanshuirenjia 2019-07-01 18:40:49 +08:00
parent 7d2185ddab
commit 46d035de10
2 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/pages/groups/group-view.js
View File

@ -392,13 +392,17 @@ class GroupView extends React.Component {
<Link to={`${siteRoot}groups/`} onClick={() => this.onTabNavClick('groups')}>{gettext('Groups')}</Link> <Link to={`${siteRoot}groups/`} onClick={() => this.onTabNavClick('groups')}>{gettext('Groups')}</Link>
<span className="path-split">/</span> <span className="path-split">/</span>
<span>{currentGroup.name}</span> <span>{currentGroup.name}</span>
{isDepartmentGroup && currentGroup.group_quota && ( {isDepartmentGroup && (
<Fragment> <Fragment>
<span className="department-group-icon fas fa-building" title={gettext('This is a special group representing a department.')}></span> <span className="department-group-icon fas fa-building" title={gettext('This is a special group representing a department.')}></span>
<div className="department-usage"> {currentGroup.group_quota > 0 &&
<span id="quota-bar" className="department-quota-bar"><span id="quota-usage" className="usage" style={{width: useRate}}></span></span> <span className="department-usage-container">
<span className="department-quota-info">{Utils.bytesToSize(currentGroup.group_quota_usage)} / {Utils.bytesToSize(currentGroup.group_quota)}</span> <div className="department-usage">
</div> <span id="quota-bar" className="department-quota-bar"><span id="quota-usage" className="usage" style={{width: useRate}}></span></span>
<span className="department-quota-info">{Utils.bytesToSize(currentGroup.group_quota_usage)} / {Utils.bytesToSize(currentGroup.group_quota)}</span>
</div>
</span>
}
</Fragment> </Fragment>
)} )}
</div> </div>

9
media/css/seahub_react.css
View File

@ -475,18 +475,23 @@ ul,ol,li {
} }
/** deparentment-usage **/ /** deparentment-usage **/
.department-usage-container {
display: inline-block;
vertical-align: middle;
}
.department-usage { .department-usage {
float: right;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center;
padding: 0 0.75rem; padding: 0 0.75rem;
width: 15rem;
} }
.department-usage .department-quota-bar { .department-usage .department-quota-bar {
flex: 1; flex: 1;
margin-right: 0.5rem !important; margin-right: 0.5rem !important;
height: 0.75rem !important; height: 0.75rem !important;
width: 60px;
} }
.department-usage .department-quota-info { .department-usage .department-quota-info {