mirror of
https://github.com/haiwen/seahub.git
synced 2025-05-13 18:35:20 +00:00
12.0 remove font awesome (#6257)
* remove font-awesome * remove font awesome 3.2.1
This commit is contained in:
Michael An
GitHub
parent
f8b98517ee
commit
6233649970
frontend/src
components
common
dialog
create-tag-dialog.js
custom-permission
generate-upload-link.jsop-menu.jsorg-add-user-dialog.jsrepo-api-token-dialog.jsrepo-share-admin
reset-webdav-password.jsset-webdav-password.jssysadmin-dialog
dir-view-mode
dirent-list-view
file-chooser
file-content-view
file-uploader
file-view
history-list-view
list-and-add-group-members.jsmenu-control.jsoperations/internal-link-operation
paginator.jspopover
sdoc-wiki-page-viewer
seafile-markdown-viewer
search
seatable-integration-account-setting-widgets
select-editor
share-link-panel
shared-link-file-uploader
shared-repo-list-view
side-panel.jstoast
toolbar
tree-view
user-settings
css
file-history-old.jsfile-history.jspages
file-history-old
institution-admin/user-content
invitations
linked-devices
markdown-editor/header-toolbar
my-libs
org-admin
departments
libraries
org-groups-search-groups.jsorg-groups.jsorg-links.jsorg-user-item.jsorg-user-profile.jsorg-users-admins.jsorg-users-list.jsorg-users-users.jsrepo-wiki-mode
sdoc/sdoc-file-history
search
share-admin
shared-libs
shared-with-all
starred
sys-admin
upload-link
@ -6,7 +6,7 @@ function CommonAddTool(props) {
|
||||
const { callBack, footerName, className, addIconClassName } = props;
|
||||
return (
|
||||
<div className={`add-item-btn ${className ? className : ''}`} onClick={(e) => {callBack(e);}}>
|
||||
<span className={`fas fa-plus mr-2 ${addIconClassName || ''}`}></span>
|
||||
<span className={`sf3-font sf3-font-enlarge mr-2 ${addIconClassName || ''}`}></span>
|
||||
<span className='add-new-option' title={footerName}>{footerName}</span>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -12,7 +12,7 @@ class GoBack extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="go-back" onClick={this.onBackClick}>
|
||||
<span className="fas fa-chevron-left"></span>
|
||||
<span className="sf3-font sf3-font-down rotate-90 d-inline-block"></span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -70,7 +70,7 @@ class CreateTagDialog extends React.Component {
|
||||
return (
|
||||
<Fragment>
|
||||
<ModalHeader toggle={this.props.onClose}>
|
||||
<span className="tag-dialog-back fas fa-sm fa-arrow-left" onClick={this.props.toggleCancel} aria-label={gettext('Back')}></span>
|
||||
<span className="tag-dialog-back sf3-font sf3-font-arrow rotate-180 d-inline-block" onClick={this.props.toggleCancel} aria-label={gettext('Back')}></span>
|
||||
{gettext('New Tag')}
|
||||
</ModalHeader>
|
||||
<ModalBody>
|
||||
|
||||
@ -119,7 +119,7 @@ class CustomPermissionEditor extends React.Component {
|
||||
<div className="permission-header">
|
||||
<div className="d-flex align-items-center">
|
||||
<OpIcon
|
||||
className="fa fa-arrow-left back-icon"
|
||||
className="sf3-font sf3-font-arrow rotate-180 d-inline-block back-icon"
|
||||
op={this.props.onChangeMode}
|
||||
title={gettext('Back')}
|
||||
/>
|
||||
@ -167,7 +167,7 @@ class CustomPermissionEditor extends React.Component {
|
||||
<Label check>
|
||||
<Input type="checkbox" onChange={this.onChangePermission('modify')} checked={permission.modify}/>
|
||||
<span>{gettext('Modify')}</span>
|
||||
<span id="modify-tip" className="fa fa-question-circle ml-2" style={{color: '#999'}}></span>
|
||||
<span id="modify-tip" className="sf3-font sf3-font-tips ml-2" style={{color: '#999'}}></span>
|
||||
<Tooltip
|
||||
toggle={this.toggle}
|
||||
delay={{show: 0, hide: 0}}
|
||||
|
||||
@ -51,12 +51,12 @@ class CustomPermissionItem extends React.Component {
|
||||
{this.state.isShowOperations && (
|
||||
<Fragment>
|
||||
<OpIcon
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
title={gettext('Edit')}
|
||||
op={this.onEditCustomPermission}
|
||||
/>
|
||||
<OpIcon
|
||||
className="fa fa-trash attr-action-icon"
|
||||
className="sf3-font sf3-font-delete1 attr-action-icon"
|
||||
title={gettext('Delete')}
|
||||
op={this.onDeleteCustomPermission}
|
||||
/>
|
||||
|
||||
@ -299,7 +299,14 @@ class GenerateUploadLink extends React.Component {
|
||||
<dd className="d-flex">
|
||||
<div className="d-flex align-items-center">
|
||||
<input id="stored-password" className="border-0 mr-1" type="text" value={this.state.storedPasswordVisible ? sharedUploadInfo.password : '****************************************'} readOnly={true} size={Math.max(sharedUploadInfo.password.length, 10)} />
|
||||
<span tabIndex="0" role="button" aria-label={this.state.storedPasswordVisible ? gettext('Hide') : gettext('Show')} onKeyDown={this.onIconKeyDown} onClick={this.toggleStoredPasswordVisible} className={`eye-icon fas ${this.state.storedPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></span>
|
||||
<span
|
||||
tabIndex="0"
|
||||
role="button"
|
||||
aria-label={this.state.storedPasswordVisible ? gettext('Hide') : gettext('Show')}
|
||||
onKeyDown={this.onIconKeyDown}
|
||||
onClick={this.toggleStoredPasswordVisible}
|
||||
className={`eye-icon sf3-font sf3-font-eye${this.state.storedPasswordVisible ? '': '-slash'}`}
|
||||
></span>
|
||||
</div>
|
||||
</dd>
|
||||
</FormGroup>
|
||||
@ -316,7 +323,7 @@ class GenerateUploadLink extends React.Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.editExpirationToggle}>
|
||||
</a>
|
||||
)}
|
||||
@ -381,8 +388,12 @@ class GenerateUploadLink extends React.Component {
|
||||
<InputGroup style={{width: inputWidth}}>
|
||||
<Input id="passwd" type={this.state.passwordVisible ? 'text':'password'} value={this.state.password || ''} onChange={this.inputPassword} />
|
||||
<InputGroupAddon addonType="append">
|
||||
<Button onClick={this.togglePasswordVisible}><i className={`link-operation-icon fas ${this.state.passwordVisible ? 'fa-eye': 'fa-eye-slash'}`}></i></Button>
|
||||
<Button onClick={this.generatePassword}><i className="link-operation-icon fas fa-magic"></i></Button>
|
||||
<Button onClick={this.togglePasswordVisible}>
|
||||
<i className={`link-operation-icon sf3-font sf3-font-eye${this.state.passwordVisible ? '': '-slash'}`}></i>
|
||||
</Button>
|
||||
<Button onClick={this.generatePassword}>
|
||||
<i className="link-operation-icon sf3-font sf3-font-magic"></i>
|
||||
</Button>
|
||||
</InputGroupAddon>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
|
||||
@ -49,7 +49,7 @@ class OpMenu extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="d-flex w-5 h-5 align-items-center justify-content-center sf-dropdown-toggle fa fa-ellipsis-v"
|
||||
className="d-flex w-5 h-5 align-items-center justify-content-center sf-dropdown-toggle sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -146,8 +146,12 @@ class AddOrgUserDialog extends React.Component {
|
||||
<InputGroup className="passwd">
|
||||
<Input id="userPwd" innerRef={input => {this.passwdInput = input;}} value={this.state.password || ''} onChange={this.inputPassword} />
|
||||
<InputGroupAddon addonType="append">
|
||||
<Button onClick={this.togglePasswordVisible}><i className={`link-operation-icon fas ${this.state.isPasswordVisible ? 'fa-eye-slash' : 'fa-eye'}`}></i></Button>
|
||||
<Button onClick={this.generatePassword}><i className="link-operation-icon fas fa-magic"></i></Button>
|
||||
<Button onClick={this.togglePasswordVisible}>
|
||||
<i className={`link-operation-icon sf3-font sf3-font-eye${this.state.isPasswordVisible ? '-slash' : ''}`}></i>
|
||||
</Button>
|
||||
<Button onClick={this.generatePassword}>
|
||||
<i className="link-operation-icon sf3-font sf3-font-magic"></i>
|
||||
</Button>
|
||||
</InputGroupAddon>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
|
||||
@ -65,7 +65,7 @@ class APITokenItem extends React.Component {
|
||||
<span>{item.api_token}</span>
|
||||
{this.state.isOperationShow &&
|
||||
<OpIcon
|
||||
className="far fa-copy action-icon"
|
||||
className="action-icon sf3-font sf3-font-copy1"
|
||||
op={this.onCopyAPIToken}
|
||||
title={gettext('Copy')}
|
||||
/>
|
||||
|
||||
@ -86,7 +86,7 @@ class Item extends Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.onEditPermission}>
|
||||
</a>
|
||||
)}
|
||||
|
||||
@ -86,7 +86,7 @@ class Item extends Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.onEditPermission}>
|
||||
</a>
|
||||
)}
|
||||
|
||||
@ -74,8 +74,12 @@ class ResetWebdavPassword extends Component {
|
||||
<InputGroup>
|
||||
<Input type={this.state.isPasswordVisible ? 'text' : 'password'} value={this.state.password} onChange={this.handleInputChange} autoComplete="new-password"/>
|
||||
<InputGroupAddon addonType="append">
|
||||
<Button onClick={this.togglePasswordVisible}><i className={`fas ${this.state.isPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></i></Button>
|
||||
<Button onClick={this.generatePassword}><i className="fas fa-magic"></i></Button>
|
||||
<Button onClick={this.togglePasswordVisible}>
|
||||
<i className={`sf3-font sf3-font-eye${this.state.isPasswordVisible ? '': '-slash'}`}></i>
|
||||
</Button>
|
||||
<Button onClick={this.generatePassword}>
|
||||
<i className="sf3-font sf3-font-magic"></i>
|
||||
</Button>
|
||||
</InputGroupAddon>
|
||||
</InputGroup>
|
||||
<p className="form-text text-muted m-0">{passwordTip}</p>
|
||||
|
||||
@ -74,8 +74,12 @@ class SetWebdavPassword extends Component {
|
||||
<InputGroup>
|
||||
<Input type={this.state.isPasswordVisible ? 'text' : 'password'} value={this.state.password} onChange={this.handleInputChange} autoComplete="new-password"/>
|
||||
<InputGroupAddon addonType="append">
|
||||
<Button onClick={this.togglePasswordVisible}><i className={`fas ${this.state.isPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></i></Button>
|
||||
<Button onClick={this.generatePassword}><i className="fas fa-magic"></i></Button>
|
||||
<Button onClick={this.togglePasswordVisible}>
|
||||
<i className={`sf3-font sf3-font-eye${this.state.isPasswordVisible ? '': 'slash'}`}></i>
|
||||
</Button>
|
||||
<Button onClick={this.generatePassword}>
|
||||
<i className="sf3-font sf3-font-magic"></i>
|
||||
</Button>
|
||||
</InputGroupAddon>
|
||||
</InputGroup>
|
||||
<p className="form-text text-muted m-0">{passwordTip}</p>
|
||||
|
||||
@ -98,7 +98,7 @@ class SysAdminAddOrgDialog extends React.Component {
|
||||
<FormGroup>
|
||||
<Label>
|
||||
{gettext('Owner')}
|
||||
<span className="small text-secondary ml-1 fas fa-question-circle" title={gettext('Owner can use admin panel in an organization, must be a new account.')}></span>
|
||||
<span className="small text-secondary ml-1 sf3-font sf3-font-tips" title={gettext('Owner can use admin panel in an organization, must be a new account.')}></span>
|
||||
</Label>
|
||||
<Input value={email} onChange={this.inputEmail} />
|
||||
</FormGroup>
|
||||
|
||||
@ -138,7 +138,7 @@ class SysAdminAddUserDialog extends React.Component {
|
||||
<FormGroup>
|
||||
<Label>
|
||||
{gettext('Role')}
|
||||
<span className="small text-secondary ml-1 fas fa-question-circle" title={gettext('You can also add a user as a guest, who will not be allowed to create libraries and groups.')}></span>
|
||||
<span className="small text-secondary ml-1 sf3-font sf3-font-tips" title={gettext('You can also add a user as a guest, who will not be allowed to create libraries and groups.')}></span>
|
||||
</Label>
|
||||
<SysAdminUserRoleEditor
|
||||
isTextMode={false}
|
||||
@ -154,8 +154,12 @@ class SysAdminAddUserDialog extends React.Component {
|
||||
<InputGroup>
|
||||
<Input autoComplete="new-password" type={isPasswordVisible ? 'text' : 'password'} value={password || ''} onChange={this.inputPassword} />
|
||||
<InputGroupAddon addonType="append">
|
||||
<Button className="mt-0" onClick={this.togglePasswordVisible}><i className={`link-operation-icon fas ${this.state.isPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></i></Button>
|
||||
<Button className="mt-0" onClick={this.generatePassword}><i className="link-operation-icon fas fa-magic"></i></Button>
|
||||
<Button className="mt-0" onClick={this.togglePasswordVisible}>
|
||||
<i className={`link-operation-icon sf3-font sf3-font-eye${this.state.isPasswordVisible ? '': '-slash'}`}></i>
|
||||
</Button>
|
||||
<Button className="mt-0" onClick={this.generatePassword}>
|
||||
<i className="link-operation-icon sf3-font sf3-font-magic"></i>
|
||||
</Button>
|
||||
</InputGroupAddon>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Utils } from '../../utils/utils';
|
||||
import { gettext, siteRoot } from '../../utils/constants';
|
||||
@ -59,11 +59,9 @@ class DirColumnFile extends React.Component {
|
||||
repoID={this.props.repoID}
|
||||
path={this.props.path}
|
||||
>
|
||||
<Fragment>
|
||||
<span className='wiki-open-file position-fixed' onClick={this.onOpenFile}>
|
||||
<i className="fas fa-expand-arrows-alt"></i>
|
||||
</span>
|
||||
</Fragment>
|
||||
<span className='wiki-open-file position-fixed' onClick={this.onOpenFile}>
|
||||
<i className="sf3-font sf3-font-expand-arrows-alt"></i>
|
||||
</span>
|
||||
</SeafileMarkdownViewer>
|
||||
);
|
||||
}
|
||||
|
||||
@ -737,7 +737,7 @@ class DirentListItem extends React.Component {
|
||||
<td className="pl10">
|
||||
{dirent.starred !== undefined &&
|
||||
<a href="#" role="button" aria-label={dirent.starred ? gettext('Unstar') : gettext('Star')} onClick={this.onItemStarred}>
|
||||
<i className={`fa-star ${dirent.starred ? 'fas' : 'far star-empty'}`}></i>
|
||||
<i className={`sf3-font ${dirent.starred ? 'sf3-font-star' : 'sf3-font-star-empty'}`}></i>
|
||||
</a>
|
||||
}
|
||||
</td>
|
||||
@ -810,7 +810,7 @@ class DirentListItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -481,7 +481,7 @@ class FileChooser extends React.Component {
|
||||
<div className="file-chooser-search-input">
|
||||
<Input className="search-input mb-2" placeholder={gettext('Search')} type='text' value={this.state.searchInfo} onChange={this.onSearchInfoChanged}></Input>
|
||||
{this.state.searchInfo.length !== 0 && (
|
||||
<span className="search-control attr-action-icon fas fa-times" onClick={this.onCloseSearching}></span>
|
||||
<span className="search-control attr-action-icon sf3-font sf3-font-x-01" onClick={this.onCloseSearching}></span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -207,7 +207,7 @@ class RepoListItem extends React.Component {
|
||||
<div className="item-left-icon">
|
||||
<span className={`item-toggle icon sf3-font ${this.state.isShowChildren ? 'sf3-font-down' : 'sf3-font-down rotate-270 d-inline-block'}`} onClick={this.onToggleClick}></span>
|
||||
<i className="tree-node-icon">
|
||||
<span className="icon far fa-folder tree-node-icon"></span>
|
||||
<span className="icon sf3-font sf3-font-folder tree-node-icon"></span>
|
||||
</i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -110,7 +110,7 @@ class TreeViewItem extends React.Component {
|
||||
<span className={`icon item-toggle sf3-font ${node.isExpanded ? 'sf3-font-down' : 'sf3-font-down rotate-270 d-inline-block'}`} onClick={this.onToggleClick}></span>
|
||||
}
|
||||
<i className="tree-node-icon">
|
||||
<span className={`icon far ${node.object.type === 'dir' ? 'fa-folder' : 'fa-file'}`}></span>
|
||||
<span className={`icon sf3-font ${node.object.type === 'dir' ? 'sf3-font-folder' : 'sf3-font-file'}`}></span>
|
||||
</i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -66,10 +66,10 @@ class FileContent extends React.Component {
|
||||
return (
|
||||
<div className="file-view-content flex-1 image-file-view">
|
||||
{previousImage && (
|
||||
<a href={previousImageUrl} id="img-prev" title={gettext('you can also press ← ')}><span className="fas fa-chevron-left"></span></a>
|
||||
<a href={previousImageUrl} id="img-prev" title={gettext('you can also press ← ')}><span className="sf3-font sf3-font-down rotate-90 d-inline-block"></span></a>
|
||||
)}
|
||||
{nextImage && (
|
||||
<a href={nextImageUrl} id="img-next" title={gettext('you can also press →')}><span className="fas fa-chevron-right"></span></a>
|
||||
<a href={nextImageUrl} id="img-next" title={gettext('you can also press →')}><span className="sf3-font sf3-font-down rotate-270 d-inline-block"></span></a>
|
||||
)}
|
||||
<img src={xmindSrc || thumbnailURL || rawPath} alt={fileName} id="image-view" onError={this.handleLoadFailure} />
|
||||
</div>
|
||||
|
||||
@ -19,7 +19,7 @@ class ForbidUploadListItem extends React.Component {
|
||||
<td>{Utils.bytesToSize(file.size)}</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="upload-failure-icon fas fa-exclamation mr-2"></span>
|
||||
<span className="upload-failure-icon sf3-font sf3-font-info mr-2"></span>
|
||||
<span className="upload-failure-msg">{gettext('File too large')}</span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
@ -133,7 +133,7 @@ class UploadListItem extends React.Component {
|
||||
)}
|
||||
{this.state.uploadState === UPLOAD_ERROR && (
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="upload-failure-icon fas fa-exclamation mr-2"></span>
|
||||
<span className="upload-failure-icon sf3-font sf3-font-info mr-2"></span>
|
||||
<span className="upload-failure-msg" dangerouslySetInnerHTML={{__html: error}}></span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -33,7 +33,7 @@ class FileInfo extends React.PureComponent {
|
||||
<div className="text-truncate">
|
||||
<h2 className="file-title d-flex align-items-center">
|
||||
<span className="file-name text-truncate" title={fileName}>{fileName}</span>
|
||||
<a className={`file-star ${isStarred ? 'fa' : 'far'} fa-star`}
|
||||
<a className={`file-star sf3-font ${isStarred ? 'sf3-font-star' : 'sf3-font-star-empty'}`}
|
||||
href="#"
|
||||
title={starredText}
|
||||
role="button"
|
||||
|
||||
@ -90,11 +90,11 @@ class FileToolbar extends React.Component {
|
||||
if (!isLocked) {
|
||||
showLockUnlockBtn = true;
|
||||
lockUnlockText = gettext('Lock');
|
||||
lockUnlockIcon = 'fa fa-lock';
|
||||
lockUnlockIcon = 'sf3-font sf3-font-lock';
|
||||
} else if (lockedByMe) {
|
||||
showLockUnlockBtn = true;
|
||||
lockUnlockText = gettext('Unlock');
|
||||
lockUnlockIcon = 'fa fa-unlock';
|
||||
lockUnlockIcon = 'sf3-font sf3-font-unlock';
|
||||
}
|
||||
}
|
||||
|
||||
@ -117,13 +117,13 @@ class FileToolbar extends React.Component {
|
||||
{fileType == 'PDF' && (
|
||||
<IconButton
|
||||
id="seafile-pdf-print"
|
||||
icon="fa fa-print"
|
||||
icon="sf3-font sf3-font-print"
|
||||
text={gettext('Print')}
|
||||
/>
|
||||
)}
|
||||
<IconButton
|
||||
id="open-parent-folder"
|
||||
icon="fa fa-folder-open"
|
||||
icon="sf3-font sf3-font-folder-open"
|
||||
text={gettext('Open parent folder')}
|
||||
tag="a"
|
||||
href={`${siteRoot}library/${repoID}/${Utils.encodePath(repoName + parentDir)}`}
|
||||
@ -139,35 +139,34 @@ class FileToolbar extends React.Component {
|
||||
{showShareBtn && (
|
||||
<IconButton
|
||||
id="share-file"
|
||||
icon='fa fa-share-alt'
|
||||
icon='sf3-font sf3-font-share'
|
||||
text={gettext('Share')}
|
||||
onClick={this.toggleShareDialog}
|
||||
/>
|
||||
)}
|
||||
|
||||
{(canEditFile && fileType != 'SDoc' && !err) &&
|
||||
( this.props.isSaving ?
|
||||
<button type={'button'} aria-label={gettext('Saving...')} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className={'fa fa-spin fa-spinner'}/></button> :
|
||||
(
|
||||
this.props.needSave ?
|
||||
<IconButton
|
||||
text={gettext('Save')}
|
||||
id={'saveButton'}
|
||||
icon={'fa fa-save'}
|
||||
// button imported in this file does not have functionalities of
|
||||
// isActive as button imported in markdowneditor has
|
||||
//isActive={!isContentChanged}
|
||||
onClick={this.props.onSave}
|
||||
/> :
|
||||
<button type={'button'} className={'btn btn-icon btn-secondary btn-active'} disabled>
|
||||
<i className={'fa fa-save'}/></button>
|
||||
)
|
||||
)}
|
||||
(this.props.isSaving ?
|
||||
<button type='button' aria-label={gettext('Saving...')} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className='sf3-font sf3-font-spinner'/>
|
||||
</button>
|
||||
:
|
||||
(this.props.needSave ?
|
||||
<IconButton
|
||||
text={gettext('Save')}
|
||||
id={'saveButton'}
|
||||
icon='sf3-font sf3-font-save'
|
||||
onClick={this.props.onSave}
|
||||
/>
|
||||
:
|
||||
<button type='button' className='btn btn-icon btn-secondary btn-active' disabled>
|
||||
<i className='sf3-font sf3-font-save'/>
|
||||
</button>
|
||||
))}
|
||||
{canDownloadFile && (
|
||||
<IconButton
|
||||
id="download-file"
|
||||
icon="fa fa-download"
|
||||
icon="sf3-font sf3-font-download1"
|
||||
text={gettext('Download')}
|
||||
tag="a"
|
||||
href="?dl=1"
|
||||
@ -175,7 +174,7 @@ class FileToolbar extends React.Component {
|
||||
)}
|
||||
<IconButton
|
||||
id="file-details"
|
||||
icon='fas fa-info'
|
||||
icon='sf3-font sf3-font-info1'
|
||||
text={gettext('Details')}
|
||||
onClick={this.props.toggleDetailsPanel}
|
||||
/>
|
||||
@ -189,8 +188,8 @@ class FileToolbar extends React.Component {
|
||||
/>
|
||||
)}
|
||||
<ButtonDropdown isOpen={moreDropdownOpen} toggle={this.toggleMoreOpMenu}>
|
||||
<DropdownToggle aria-label={gettext('More operations')}>
|
||||
<span className="fas fa-ellipsis-v"></span>
|
||||
<DropdownToggle className="file-toolbar-more-operations" aria-label={gettext('More operations')}>
|
||||
<span className="sf3-font sf3-font-more-vertical"></span>
|
||||
</DropdownToggle>
|
||||
<DropdownMenu right={true}>
|
||||
{filePerm == 'rw' && (
|
||||
@ -206,23 +205,22 @@ class FileToolbar extends React.Component {
|
||||
<ButtonGroup >
|
||||
{(canEditFile && fileType != 'SDoc' && !err) &&
|
||||
(this.props.isSaving ?
|
||||
<button type={'button'} aria-label={gettext('Saving...')} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className={'fa fa-spin fa-spinner'}/></button> :
|
||||
(
|
||||
this.props.needSave ?
|
||||
<IconButton
|
||||
text={gettext('Save')}
|
||||
id={'saveButton'}
|
||||
icon={'fa fa-save'}
|
||||
// button imported in this file does not have functionalities of
|
||||
// isActive as button imported in markdowneditor has
|
||||
//isActive={!isContentChanged}
|
||||
onClick={this.props.onSave}
|
||||
/> :
|
||||
<button type={'button'} className={'btn btn-icon btn-secondary btn-active'} disabled>
|
||||
<i className={'fa fa-save'}/></button>
|
||||
)
|
||||
)}
|
||||
<button type='button' aria-label={gettext('Saving...')} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className='sf3-font sf3-font-spinner'/>
|
||||
</button>
|
||||
:
|
||||
(this.props.needSave ?
|
||||
<IconButton
|
||||
text={gettext('Save')}
|
||||
id={'saveButton'}
|
||||
icon='sf3-font sf3-font-save'
|
||||
onClick={this.props.onSave}
|
||||
/>
|
||||
:
|
||||
<button type='button' className={'btn btn-icon btn-secondary btn-active'} disabled>
|
||||
<i className={'sf3-font sf3-font-save'}/>
|
||||
</button>
|
||||
))}
|
||||
</ButtonGroup>
|
||||
|
||||
<DropdownToggle className="sf2-icon-more mx-1" aria-label={gettext('More operations')}></DropdownToggle>
|
||||
|
||||
@ -93,7 +93,7 @@ class HistoryListItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isMenuShow} toggle={this.onToggleClick}>
|
||||
<DropdownToggle
|
||||
tag='a'
|
||||
className={`fas fa-ellipsis-v ${(this.state.isShowOperationIcon || isHigtlightItem) ? '' : 'invisible'}`}
|
||||
className={`sf3-font sf3-font-more-vertical ${(this.state.isShowOperationIcon || isHigtlightItem) ? '' : 'invisible'}`}
|
||||
data-toggle="dropdown"
|
||||
aria-expanded={this.state.isMenuShow}
|
||||
title={gettext('More operations')}
|
||||
|
||||
@ -192,7 +192,7 @@ class ManageMembersDialog extends React.Component {
|
||||
{groupMembers.length > 10 &&
|
||||
<InputGroup className={`search-group-members rounded ${searchActive ? 'active' : ''}`}>
|
||||
<InputGroupText>
|
||||
<i className="fas fa-search" aria-hidden={true}></i>
|
||||
<i className="sf3-font sf3-font-search" aria-hidden={true}></i>
|
||||
</InputGroupText>
|
||||
<Input
|
||||
type="text"
|
||||
|
||||
@ -10,7 +10,7 @@ class MenuControl extends React.Component {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<i className={`fas fa-ellipsis-v ${this.props.isShow ? '' : 'invisible'}`} onClick={this.props.onClick}></i>
|
||||
<i className={`sf3-font sf3-font-more-vertical ${this.props.isShow ? '' : 'invisible'}`} onClick={this.props.onClick}></i>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -28,7 +28,7 @@ class InternalLinkOperation extends React.Component {
|
||||
return (
|
||||
<Fragment>
|
||||
<span className='dialog-operation'>
|
||||
<i className="file-internal-link fa fa-link" title={title} aria-label={title} onClick={this.onInternalLinkDialogToggle}/>
|
||||
<i className="file-internal-link sf3-font sf3-font-link" title={title} aria-label={title} onClick={this.onInternalLinkDialogToggle}/>
|
||||
</span>
|
||||
{isShowInternalLinkDialog && (
|
||||
<InternalLinkDialog
|
||||
|
||||
@ -56,7 +56,7 @@ class Paginator extends Component {
|
||||
disabled={currentPage == 1}
|
||||
onClick={this.goToPrevious}
|
||||
>
|
||||
<span className="fas fa-chevron-left"></span>
|
||||
<span className="sf3-font sf3-font-down rotate-90 d-inline-block"></span>
|
||||
</button>
|
||||
<span className="btn btn-primary mx-4">{currentPage}</span>
|
||||
<button
|
||||
@ -64,7 +64,7 @@ class Paginator extends Component {
|
||||
disabled={!this.props.hasNextPage}
|
||||
onClick={this.goToNext}
|
||||
>
|
||||
<span className="fas fa-chevron-right"></span>
|
||||
<span className="sf3-font sf3-font-down rotate-270 d-inline-block"></span>
|
||||
</button>
|
||||
|
||||
<select
|
||||
|
||||
@ -109,7 +109,7 @@ export default class TagListFooter extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="tag-list-footer">
|
||||
<span className="fa fa-question-circle mr-2" style={{color: '#999'}} id="import-export-tags-tip"></span>
|
||||
<span className="sf3-font sf3-font-tips mr-2" style={{color: '#999'}} id="import-export-tags-tip"></span>
|
||||
<Tooltip
|
||||
toggle={this.toggleTooltip}
|
||||
delay={{show: 0, hide: 0}}
|
||||
|
||||
@ -124,13 +124,15 @@ class SdocWikiPageViewer extends React.Component {
|
||||
const containerClass = `wiki-page-container ${containerClassName}`;
|
||||
// In dir-column-file width is 100%;
|
||||
// In wiki-viewer width isn't 100%
|
||||
const contentClassName = `wiki-page-content ${!isWiki ? + 'w-100' : ''}`;
|
||||
const contentClassName = `wiki-page-content ${isWiki ? '' : 'w-100'}`;
|
||||
return (
|
||||
<div ref={this.scrollRef} className={containerClass}>
|
||||
<div className={contentClassName}>
|
||||
{this.props.children}
|
||||
{this.renderMarkdown()}
|
||||
<p id="wiki-page-last-modified">{gettext('Last modified by')} {this.props.latestContributor}, <span>{this.props.lastModified}</span></p>
|
||||
<p id="wiki-page-last-modified">
|
||||
{gettext('Last modified by')} {this.props.latestContributor}, <span>{this.props.lastModified}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -110,13 +110,15 @@ class SeafileMarkdownViewer extends React.Component {
|
||||
const containerClass = `wiki-page-container ${containerClassName}`;
|
||||
// In dir-column-file width is 100%;
|
||||
// In wiki-viewer width isn't 100%
|
||||
const contentClassName = `wiki-page-content ${!isWiki ? + 'w-100' : ''}`;
|
||||
const contentClassName = `wiki-page-content ${isWiki ? '' : 'w-100'}`;
|
||||
return (
|
||||
<div ref={this.scrollRef} className={containerClass}>
|
||||
<div className={contentClassName}>
|
||||
{this.props.children}
|
||||
{this.renderMarkdown()}
|
||||
<p id="wiki-page-last-modified">{gettext('Last modified by')} {this.props.latestContributor}, <span>{this.props.lastModified}</span></p>
|
||||
<p id="wiki-page-last-modified">
|
||||
{gettext('Last modified by')} {this.props.latestContributor}, <span>{this.props.lastModified}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -421,7 +421,7 @@ export default class AISearch extends Component {
|
||||
return (
|
||||
<div className="search-types">
|
||||
<div className="search-types-repos search-types-highlight" onClick={this.searchAllRepos} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in all libraries')}</span>
|
||||
</div>
|
||||
@ -433,17 +433,17 @@ export default class AISearch extends Component {
|
||||
return (
|
||||
<div className="search-types">
|
||||
<div className={`search-types-repo ${highlightIndex === 0 ? 'search-types-highlight' : ''}`} onClick={this.searchRepo} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in this library')}</span>
|
||||
</div>
|
||||
<div className={`search-types-folder ${highlightIndex === 1 ? 'search-types-highlight' : ''}`} onClick={this.searchFolder} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in this folder')}</span>
|
||||
</div>
|
||||
<div className={`search-types-repos ${highlightIndex === 2 ? 'search-types-highlight' : ''}`} onClick={this.searchAllRepos} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in all libraries')}</span>
|
||||
</div>
|
||||
@ -453,12 +453,12 @@ export default class AISearch extends Component {
|
||||
return (
|
||||
<div className="search-types">
|
||||
<div className={`search-types-repo ${highlightIndex === 0 ? 'search-types-highlight' : ''}`} onClick={this.searchRepo} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in this library')}</span>
|
||||
</div>
|
||||
<div className={`search-types-repos ${highlightIndex === 1 ? 'search-types-highlight' : ''}`} onClick={this.searchAllRepos} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in all libraries')}</span>
|
||||
</div>
|
||||
@ -716,7 +716,7 @@ export default class AISearch extends Component {
|
||||
}
|
||||
<button
|
||||
type="button"
|
||||
className="search-icon-right input-icon-addon fas fa-times border-0 bg-transparent mr-4"
|
||||
className="search-icon-right input-icon-addon sf3-font sf3-font-x-01 border-0 bg-transparent mr-4"
|
||||
onClick={this.onCloseHandler}
|
||||
aria-label={gettext('Close')}
|
||||
></button>
|
||||
@ -756,7 +756,7 @@ export default class AISearch extends Component {
|
||||
autoComplete="off"
|
||||
/>
|
||||
{this.state.isCloseShow &&
|
||||
<button type="button" className="search-icon-right input-icon-addon fas fa-times border-0 bg-transparent" onClick={this.onCloseHandler} aria-label={gettext('Close')}></button>
|
||||
<button type="button" className="search-icon-right input-icon-addon sf3-font sf3-font-x-01 border-0 bg-transparent" onClick={this.onCloseHandler} aria-label={gettext('Close')}></button>
|
||||
}
|
||||
</div>
|
||||
<div className="search-result-container dropdown-search-result-container" onScroll={this.onResultListScroll}>
|
||||
|
||||
@ -30,7 +30,7 @@ class SearchByName extends Component {
|
||||
return (
|
||||
<Fragment>
|
||||
<i
|
||||
className="fas fa-search top-search-file-icon"
|
||||
className="sf3-font sf3-font-search top-search-file-icon"
|
||||
onClick={this.toggleDialog}
|
||||
title={gettext('Search files in this library')}
|
||||
></i>
|
||||
|
||||
@ -420,7 +420,7 @@ class Search extends Component {
|
||||
return (
|
||||
<div className="search-types">
|
||||
<div className="search-types-repos search-types-highlight" onClick={this.searchAllRepos} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in all libraries')}</span>
|
||||
</div>
|
||||
@ -432,17 +432,17 @@ class Search extends Component {
|
||||
return (
|
||||
<div className="search-types">
|
||||
<div className={`search-types-repo ${highlightIndex === 0 ? 'search-types-highlight' : ''}`} onClick={this.searchRepo} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in this library')}</span>
|
||||
</div>
|
||||
<div className={`search-types-folder ${highlightIndex === 1 ? 'search-types-highlight' : ''}`} onClick={this.searchFolder} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in this folder')}</span>
|
||||
</div>
|
||||
<div className={`search-types-repos ${highlightIndex === 2 ? 'search-types-highlight' : ''}`} onClick={this.searchAllRepos} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in all libraries')}</span>
|
||||
</div>
|
||||
@ -452,12 +452,12 @@ class Search extends Component {
|
||||
return (
|
||||
<div className="search-types">
|
||||
<div className={`search-types-repo ${highlightIndex === 0 ? 'search-types-highlight' : ''}`} onClick={this.searchRepo} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in this library')}</span>
|
||||
</div>
|
||||
<div className={`search-types-repos ${highlightIndex === 1 ? 'search-types-highlight' : ''}`} onClick={this.searchAllRepos} tabIndex={0}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
{inputValue}
|
||||
<span className="search-types-text">{gettext('in all libraries')}</span>
|
||||
</div>
|
||||
@ -551,7 +551,7 @@ class Search extends Component {
|
||||
<div className={`search-mask ${isMaskShow ? 'show' : 'hide'}`} onClick={this.onCloseHandler}></div>
|
||||
<div className={`search-container ${isMaskShow ? 'show' : ''}`}>
|
||||
<div className={`input-icon ${isMaskShow ? 'mb-1' : ''}`}>
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input"
|
||||
@ -565,7 +565,7 @@ class Search extends Component {
|
||||
ref={this.inputRef}
|
||||
/>
|
||||
{this.state.isCloseShow &&
|
||||
<button type="button" className="search-icon-right input-icon-addon fas fa-times border-0 bg-transparent mr-4" onClick={this.onCloseHandler} aria-label={gettext('Close')}></button>
|
||||
<button type="button" className="search-icon-right input-icon-addon sf3-font sf3-font-x-01 border-0 bg-transparent mr-4" onClick={this.onCloseHandler} aria-label={gettext('Close')}></button>
|
||||
}
|
||||
</div>
|
||||
<div
|
||||
@ -580,14 +580,14 @@ class Search extends Component {
|
||||
</MediaQuery>
|
||||
<MediaQuery query="(max-width: 767.8px)">
|
||||
<div className="search-icon-container">
|
||||
<i className="search-icon fas fa-search" onClick={this.onSearchToggle}></i>
|
||||
<i className="search-icon sf3-font sf3-font-search" onClick={this.onSearchToggle}></i>
|
||||
</div>
|
||||
{this.state.isSearchInputShow &&
|
||||
<div className="search">
|
||||
<div className={`search-mask ${isMaskShow ? '' : 'hide'}`} onClick={this.onCloseHandler}></div>
|
||||
<div className="search-container">
|
||||
<div className="input-icon">
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input"
|
||||
@ -600,7 +600,7 @@ class Search extends Component {
|
||||
autoComplete="off"
|
||||
/>
|
||||
{this.state.isCloseShow &&
|
||||
<button type="button" className="search-icon-right input-icon-addon fas fa-times border-0 bg-transparent" onClick={this.onCloseHandler} aria-label={gettext('Close')}></button>
|
||||
<button type="button" className="search-icon-right input-icon-addon sf3-font sf3-font-x-01 border-0 bg-transparent" onClick={this.onCloseHandler} aria-label={gettext('Close')}></button>
|
||||
}
|
||||
</div>
|
||||
<div className="search-result-container dropdown-search-result-container" onScroll={this.onResultListScroll}>
|
||||
|
||||
@ -228,7 +228,7 @@ class Search extends Component {
|
||||
<div className={`search-mask ${this.state.isMaskShow ? '' : 'hide'}`} onClick={this.onCloseHandler}></div>
|
||||
<div className="search-container">
|
||||
<div className="input-icon">
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input"
|
||||
@ -240,7 +240,7 @@ class Search extends Component {
|
||||
onChange={this.onChangeHandler}
|
||||
autoComplete="off"
|
||||
/>
|
||||
{this.state.isCloseShow && <i className='search-icon-right input-icon-addon fas fa-times' onClick={this.onCloseHandler}></i>}
|
||||
{this.state.isCloseShow && <i className='search-icon-right input-icon-addon sf3-font sf3-font-x-01' onClick={this.onCloseHandler}></i>}
|
||||
</div>
|
||||
<div className="search-result-container dropdown-search-result-container">
|
||||
{this.renderSearchResult()}
|
||||
@ -250,14 +250,14 @@ class Search extends Component {
|
||||
</MediaQuery>
|
||||
<MediaQuery query="(max-width: 767.8px)">
|
||||
<div className="search-icon-container">
|
||||
<i className="search-icon fas fa-search" onClick={this.onSearchToggle}></i>
|
||||
<i className="search-icon sf3-font sf3-font-search" onClick={this.onSearchToggle}></i>
|
||||
</div>
|
||||
{this.state.isSearchInputShow &&
|
||||
<div className="search">
|
||||
<div className={`search-mask ${this.state.isMaskShow ? '' : 'hide'}`} onClick={this.onCloseHandler}></div>
|
||||
<div className="search-container">
|
||||
<div className="input-icon">
|
||||
<i className="search-icon-left input-icon-addon fas fa-search"></i>
|
||||
<i className="search-icon-left input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input"
|
||||
@ -269,7 +269,7 @@ class Search extends Component {
|
||||
onChange={this.onChangeHandler}
|
||||
autoComplete="off"
|
||||
/>
|
||||
{this.state.isCloseShow && <i className='search-icon-right input-icon-addon fas fa-times' onClick={this.onCloseHandler}></i>}
|
||||
{this.state.isCloseShow && <i className='search-icon-right input-icon-addon sf3-font sf3-font-x-01' onClick={this.onCloseHandler}></i>}
|
||||
</div>
|
||||
<div className="search-result-container dropdown-search-result-container">
|
||||
{this.renderSearchResult()}
|
||||
|
||||
@ -148,7 +148,7 @@ class AddSeatableAccountSetting extends Component {
|
||||
<InputGroup>
|
||||
<Input value={seatable_api_token} type={passwordType} onChange={this.onChangeSeatableApiToken}/>
|
||||
<InputGroupText>
|
||||
<i className={`fas ${passwordType === 'password' ? 'fa-eye-slash' : 'fa-eye'} cursor-pointer`} onClick={this.togglePasswordShow} />
|
||||
<i className={`sf3-font sf3-font-eye${passwordType === 'password' ? '-slash' : ''} cursor-pointer`} onClick={this.togglePasswordShow} />
|
||||
</InputGroupText>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
|
||||
@ -61,7 +61,7 @@ class RepoAPITokenPermissionEditor extends React.Component {
|
||||
<Fragment>
|
||||
<span>{optionTranslation}</span>
|
||||
{this.props.isEditIconShow &&
|
||||
<OpIcon title={gettext('Edit')} className="fa fa-pencil-alt attr-action-icon" op={this.onEditPermission} />
|
||||
<OpIcon title={gettext('Edit')} className="sf3-font sf3-font-rename attr-action-icon" op={this.onEditPermission} />
|
||||
}
|
||||
</Fragment>
|
||||
:
|
||||
|
||||
@ -62,7 +62,7 @@ class SelectEditor extends React.Component {
|
||||
isDisabled: true,
|
||||
label: (
|
||||
<div className="permission-editor-btn-add-custom-permission" onClick={this.props.onAddCustomPermissionToggle}>
|
||||
<i className="fa fa-plus"></i>
|
||||
<i className="sf3-font sf3-font-enlarge"></i>
|
||||
<span>{gettext('Add custom permission')}</span>
|
||||
</div>
|
||||
)
|
||||
@ -136,7 +136,7 @@ class SelectEditor extends React.Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.onEditPermission}>
|
||||
</a>
|
||||
)}
|
||||
|
||||
@ -256,7 +256,7 @@ class LinkCreation extends React.Component {
|
||||
<Fragment>
|
||||
<div className="d-flex align-items-center pb-2 border-bottom">
|
||||
<h6 className="font-weight-normal m-0">
|
||||
<button className="fa fa-arrow-left back-icon border-0 bg-transparent text-secondary p-0 mr-2" onClick={this.goBack} title={gettext('Back')} aria-label={gettext('Back')}></button>
|
||||
<button className="sf3-font sf3-font-arrow rotate-180 d-inline-block back-icon border-0 bg-transparent text-secondary p-0 mr-2" onClick={this.goBack} title={gettext('Back')} aria-label={gettext('Back')}></button>
|
||||
{type == 'batch' ? gettext('Generate links in batch') : gettext('Generate Link')}</h6>
|
||||
</div>
|
||||
<Form className="pt-4">
|
||||
@ -286,8 +286,12 @@ class LinkCreation extends React.Component {
|
||||
<InputGroup style={{width: inputWidth}}>
|
||||
<Input id="passwd" type={this.state.isPasswordVisible ? 'text' : 'password'} value={this.state.password || ''} onChange={this.inputPassword} />
|
||||
<InputGroupAddon addonType="append">
|
||||
<Button onClick={this.togglePasswordVisible}><i className={`link-operation-icon fas ${this.state.isPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></i></Button>
|
||||
<Button onClick={this.generatePassword}><i className="link-operation-icon fas fa-magic"></i></Button>
|
||||
<Button onClick={this.togglePasswordVisible}>
|
||||
<i className={`link-operation-icon sf3-font sf3-font-eye${this.state.isPasswordVisible ? '': '-slash'}`}></i>
|
||||
</Button>
|
||||
<Button onClick={this.generatePassword}>
|
||||
<i className="link-operation-icon sf3-font sf3-font-magic"></i>
|
||||
</Button>
|
||||
</InputGroupAddon>
|
||||
</InputGroup>
|
||||
</FormGroup>
|
||||
|
||||
@ -163,7 +163,7 @@ class LinkDetails extends React.Component {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<button className="fa fa-arrow-left back-icon border-0 bg-transparent text-secondary p-0" onClick={this.goBack} title={gettext('Back')} aria-label={gettext('Back')}></button>
|
||||
<button className="sf3-font sf3-font-arrow rotate-180 d-inline-block back-icon border-0 bg-transparent text-secondary p-0" onClick={this.goBack} title={gettext('Back')} aria-label={gettext('Back')}></button>
|
||||
<dl>
|
||||
<dt className="text-secondary font-weight-normal">{gettext('Link:')}</dt>
|
||||
<dd>
|
||||
@ -190,7 +190,7 @@ class LinkDetails extends React.Component {
|
||||
<dt className="text-secondary font-weight-normal">{gettext('Password:')}</dt>
|
||||
<dd className="d-flex align-items-center">
|
||||
<span className="mr-1">{this.state.storedPasswordVisible ? sharedLinkInfo.password : '***************'}</span>
|
||||
<span tabIndex="0" role="button" aria-label={this.state.storedPasswordVisible ? gettext('Hide') : gettext('Show')} onKeyDown={this.onIconKeyDown} onClick={this.toggleStoredPasswordVisible} className={`eye-icon fas ${this.state.storedPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></span>
|
||||
<span tabIndex="0" role="button" aria-label={this.state.storedPasswordVisible ? gettext('Hide') : gettext('Show')} onKeyDown={this.onIconKeyDown} onClick={this.toggleStoredPasswordVisible} className={`eye-icon sf3-font sf3-font-eye${this.state.storedPasswordVisible ? '': '-slash'}`}></span>
|
||||
</dd>
|
||||
</>
|
||||
)}
|
||||
@ -205,7 +205,7 @@ class LinkDetails extends React.Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.editingExpirationToggle}>
|
||||
</a>
|
||||
)}
|
||||
|
||||
@ -19,7 +19,7 @@ class ForbidUploadListItem extends React.Component {
|
||||
<td>{Utils.bytesToSize(file.size)}</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="upload-failure-icon fas fa-exclamation mr-2"></span>
|
||||
<span className="upload-failure-icon sf3-font sf3-font-info mr-2"></span>
|
||||
<span className="upload-failure-msg">{gettext('File too large')}</span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
@ -133,7 +133,7 @@ class UploadListItem extends React.Component {
|
||||
)}
|
||||
{this.state.uploadState === UPLOAD_ERROR && (
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="upload-failure-icon fas fa-exclamation mr-2"></span>
|
||||
<span className="upload-failure-icon sf3-font sf3-font-info mr-2"></span>
|
||||
<span className="upload-failure-msg" dangerouslySetInnerHTML={{__html: error}}></span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -468,7 +468,7 @@ class SharedRepoListItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -21,7 +21,8 @@ class SidePanel extends React.Component {
|
||||
<Logo onCloseSidePanel={this.props.onCloseSidePanel}/>
|
||||
</div>
|
||||
<div className="side-panel-center">
|
||||
{children ? children :
|
||||
{children ?
|
||||
children :
|
||||
<MainSideNav tabItemClick={this.props.tabItemClick} currentTab={this.props.currentTab} />
|
||||
}
|
||||
</div>
|
||||
|
||||
@ -14,15 +14,15 @@ class Alert extends React.PureComponent {
|
||||
getIconClass(intent) {
|
||||
switch (intent) {
|
||||
case 'success':
|
||||
return 'fa fa-check-circle';
|
||||
return 'sf3-font sf3-font-check-circle';
|
||||
case 'warning':
|
||||
return 'fa fa-exclamation-triangle';
|
||||
return 'sf3-font sf3-font-exclamation-triangle';
|
||||
case 'none':
|
||||
return 'fa fa-exclamation-circle';
|
||||
return 'sf3-font sf3-font-exclamation-circle';
|
||||
case 'danger':
|
||||
return 'fa fa-exclamation-circle';
|
||||
return 'sf3-font sf3-font-exclamation-circle';
|
||||
default:
|
||||
return 'fa fa-check-circle';
|
||||
return 'sf3-font sf3-font-check-circle';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -28,7 +28,7 @@ class InvitationsToolbar extends React.Component {
|
||||
{Utils.isDesktop() ? (
|
||||
<div className="operation">
|
||||
<Button color="btn btn-secondary operation-item" onClick={toggleInvitePeopleDialog}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Invite Guest')}
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('Invite Guest')}
|
||||
</Button>
|
||||
</div>
|
||||
) : (
|
||||
|
||||
@ -54,7 +54,7 @@ class MyLibsToolbar extends React.Component {
|
||||
{Utils.isDesktop() ? (
|
||||
<div className="operation">
|
||||
<button className="btn btn-secondary operation-item" title={gettext('New Library')} onClick={this.onCreateToggle}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('New Library')}
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('New Library')}
|
||||
</button>
|
||||
{moreShown &&
|
||||
<Dropdown isOpen={this.state.isOpen} toggle={this.toggleMore}>
|
||||
|
||||
@ -178,25 +178,25 @@ class TreeNodeView extends React.Component {
|
||||
let icon = '';
|
||||
let type = '';
|
||||
if (node.object.type === 'dir') {
|
||||
icon = <i className="far fa-folder"></i>;
|
||||
icon = <i className="sf3-font sf3-font-folder"></i>;
|
||||
type = 'dir';
|
||||
} else {
|
||||
let index = node.object.name.lastIndexOf('.');
|
||||
if (index === -1) {
|
||||
icon = <i className="far fa-file"></i>;
|
||||
icon = <i className="sf3-font sf3-font-file"></i>;
|
||||
type = 'file';
|
||||
} else {
|
||||
let suffix = node.object.name.slice(index).toLowerCase();
|
||||
if (suffix === '.png' || suffix === '.jpg' || suffix === '.jpeg' || suffix === '.gif' || suffix === '.bmp') {
|
||||
icon = <i className="far fa-image"></i>;
|
||||
icon = <i className="sf3-font sf3-font-image"></i>;
|
||||
type = 'image';
|
||||
}
|
||||
else if (suffix === '.md' || suffix === '.markdown') {
|
||||
icon = <i className="far fa-file-alt"></i>;
|
||||
icon = <i className="sf3-font sf3-font-files2"></i>;
|
||||
type = 'file';
|
||||
}
|
||||
else {
|
||||
icon = <i className="far fa-file"></i>;
|
||||
icon = <i className="sf3-font sf3-font-file"></i>;
|
||||
type = 'file';
|
||||
}
|
||||
}
|
||||
@ -318,7 +318,7 @@ class TreeNodeView extends React.Component {
|
||||
{((userPerm === 'rw' || permission || isCustomPermission) && this.state.isShowOperationMenu) && (
|
||||
<ItemDropdownMenu
|
||||
item={this.props.node}
|
||||
toggleClass={'fas fa-ellipsis-v'}
|
||||
toggleClass={'sf3-font sf3-font-more-vertical'}
|
||||
getMenuList={this.calculateMenuList}
|
||||
onMenuItemClick={this.onMenuItemClick}
|
||||
freezeItem={this.props.freezeItem}
|
||||
|
||||
@ -160,7 +160,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -94,7 +94,7 @@ class UserAvatarForm extends React.Component {
|
||||
<div className="col-auto position-relative" onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut} onFocus={this.handleMouseOver} tabIndex="0">
|
||||
<img src={this.state.avatarSrc} width="80" height="80" alt="" className="user-avatar" />
|
||||
<input type="file" name="avatar" className="d-none" onChange={this.fileInputChange} ref={this.fileInput} />
|
||||
<span className={`avatar-edit fas fa-edit ${!this.state.isEditShown && 'd-none'}`} onClick={this.openFileInput} role="button" aria-label={gettext('Edit')} tabIndex="0" onKeyDown={this.onEditIconKeyDown}></span>
|
||||
<span className={`avatar-edit sf3-font sf3-font-rename ${!this.state.isEditShown && 'd-none'}`} onClick={this.openFileInput} role="button" aria-label={gettext('Edit')} tabIndex="0" onKeyDown={this.onEditIconKeyDown}></span>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
|
||||
@ -78,7 +78,14 @@ class WebAPIAuthToken extends React.Component {
|
||||
<div className="d-flex align-items-center">
|
||||
<label className="m-0 mr-2" htmlFor="token">{gettext('Token:')}</label>
|
||||
<input id="token" className="border-0 mr-1" type="text" value={isAuthTokenVisible ? authToken : '****************************************'} readOnly={true} size={Math.max(authToken.length, 10)} />
|
||||
<span tabIndex="0" role="button" aria-label={isAuthTokenVisible ? gettext('Hide') : gettext('Show')} onKeyDown={this.onIconKeyDown} onClick={this.toggleAuthTokenVisible} className={`eye-icon fas ${this.state.isAuthTokenVisible ? 'fa-eye': 'fa-eye-slash'}`}></span>
|
||||
<span
|
||||
tabIndex="0"
|
||||
role="button"
|
||||
aria-label={isAuthTokenVisible ? gettext('Hide') : gettext('Show')}
|
||||
onKeyDown={this.onIconKeyDown}
|
||||
onClick={this.toggleAuthTokenVisible}
|
||||
className={`eye-icon sf3-font sf3-font-eye${this.state.isAuthTokenVisible ? '': '-slash'}`}
|
||||
></span>
|
||||
</div>
|
||||
<button className="btn btn-outline-primary mt-2" onClick={this.deleteAuthToken}>{gettext('Delete')}</button>
|
||||
</React.Fragment>
|
||||
|
||||
@ -1,42 +1,56 @@
|
||||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.file-view-header {
|
||||
padding: 4px 10px;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #c9c9c9;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.file-view-header .file-toolbar-more-operations {
|
||||
height: 38px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.file-title {
|
||||
font-size: 1.2rem;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.file-star {
|
||||
font-size: .875rem;
|
||||
color: #999;
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.file-star:hover,
|
||||
.file-star:focus {
|
||||
text-decoration: none;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.file-locked-icon {
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.meta-info {
|
||||
font-size: .8125rem;
|
||||
}
|
||||
|
||||
.file-view-content {
|
||||
padding: 30px 0;
|
||||
background: #f4f4f4;
|
||||
border-right: 4px solid transparent;
|
||||
}
|
||||
|
||||
.tip {
|
||||
color: #808080;
|
||||
}
|
||||
@ -51,6 +65,7 @@ body {
|
||||
animation: move .5s ease-in-out 1;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
@keyframes move {
|
||||
from {
|
||||
right: -500px;
|
||||
@ -61,10 +76,12 @@ body {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
/* for mobile */
|
||||
|
||||
/* for mobile */
|
||||
.file-view-body .seafile-comment {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.file-view-body .seafile-comment {
|
||||
width: 300px;
|
||||
|
||||
@ -312,7 +312,8 @@ img[src=""],img:not([src]) { /* for first loading img*/
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.cur-view-container .fa-star.fas {
|
||||
.cur-view-container .sf3-font-star-empty.sf3-font,
|
||||
.cur-view-container .sf3-font-star.sf3-font {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
|
||||
@ -191,6 +191,8 @@
|
||||
.dir-content-main .wiki-open-file {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 3px 5px -1px rgba(0,0,0,.2), 0 6px 10px 0 rgba(0,0,0,.14), 0 1px 18px 0 rgba(0,0,0,.12);
|
||||
@ -204,12 +206,6 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dir-content-main .wiki-open-file i {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
left: 12px;
|
||||
}
|
||||
|
||||
.dir-content-main .wiki-open-file:hover {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
|
||||
@ -194,8 +194,8 @@
|
||||
padding-left: 0.5rem;
|
||||
width: 30rem;
|
||||
}
|
||||
.search-page .search-page-container .fa-angle-double-up,
|
||||
.search-page .search-page-container .fa-angle-double-down {
|
||||
.search-page .search-page-container .sf3-font-angles-up,
|
||||
.search-page .search-page-container .sf3-font-angles-down {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.search-page .advanced-search .search-file-types .search-input {
|
||||
|
||||
@ -232,7 +232,7 @@ class FileHistory extends React.Component {
|
||||
<div className="old-history-main">
|
||||
<Fragment>
|
||||
<a href="#" className="go-back" title="Back" onClick={this.goBack}>
|
||||
<span className="fas fa-chevron-left"></span>
|
||||
<span className="sf3-font sf3-font-down rotate-90 d-inline-block"></span>
|
||||
</a>
|
||||
<h2><span className="file-name">{fileName}</span>{' '}{gettext('History Versions')}</h2>
|
||||
</Fragment>
|
||||
|
||||
@ -52,7 +52,7 @@ class FileHistory extends React.Component {
|
||||
<div className="history-header file-history-header flex-shrink-0">
|
||||
<div className="title d-flex mw-100">
|
||||
<a href="#" className="go-back" title="Back" onClick={this.onBackClick}>
|
||||
<span className="fas fa-chevron-left"></span>
|
||||
<span className="sf3-font sf3-font-down rotate-90 d-inline-block"></span>
|
||||
</a>
|
||||
<span className="name text-truncate" title={fileName}>{fileName}</span>
|
||||
</div>
|
||||
|
||||
@ -115,7 +115,7 @@ class MoreMenu extends React.PureComponent {
|
||||
<Dropdown isOpen={this.state.dropdownOpen} toggle={this.dropdownToggle} direction="down" className="mx-1 old-history-more-operation">
|
||||
<DropdownToggle
|
||||
tag='i'
|
||||
className='fa fa-ellipsis-v'
|
||||
className='sf3-font sf3-font-more-vertical'
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -59,7 +59,7 @@ export default function UserInfo() {
|
||||
{`${Utils.bytesToSize(user.quota_usage)} / ${user.quota_total > 0 ? Utils.bytesToSize(user.quota_total) : '--'}`}
|
||||
<span
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={toggleSetQuotaDialog}>
|
||||
</span>
|
||||
</dd>
|
||||
|
||||
@ -122,7 +122,7 @@ class Item extends React.Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -162,7 +162,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -79,14 +79,14 @@ class HeaderToolbar extends React.Component {
|
||||
<ButtonGroup>
|
||||
<ButtonItem
|
||||
text={gettext('Open parent directory')}
|
||||
id={'parentDirectory'}
|
||||
icon={'fa fa-folder-open'}
|
||||
id='parentDirectory'
|
||||
icon='sf3-font sf3-font-folder-open'
|
||||
onMouseDown={this.openParentDirectory}
|
||||
/>
|
||||
{(canLockUnlockFile && !isLocked) && (
|
||||
<ButtonItem
|
||||
id="lock-unlock-file"
|
||||
icon='fa fa-lock'
|
||||
icon='sf3-font sf3-font-lock'
|
||||
text={gettext('Lock')}
|
||||
onMouseDown={this.props.toggleLockFile}
|
||||
/>
|
||||
@ -94,31 +94,31 @@ class HeaderToolbar extends React.Component {
|
||||
{(canLockUnlockFile && lockedByMe) && (
|
||||
<ButtonItem
|
||||
id="lock-unlock-file"
|
||||
icon='fa fa-unlock'
|
||||
icon='sf3-font sf3-font-unlock'
|
||||
text={gettext('Unlock')}
|
||||
onMouseDown={this.props.toggleLockFile}
|
||||
/>
|
||||
)}
|
||||
{canGenerateShareLink && (
|
||||
<ButtonItem
|
||||
id={'shareBtn'}
|
||||
id='shareBtn'
|
||||
text={gettext('Share')}
|
||||
icon={'fa fa-share-alt'}
|
||||
icon='sf3-font sf3-font-share'
|
||||
onMouseDown={this.props.toggleShareLinkDialog}
|
||||
/>
|
||||
)}
|
||||
{saving ?
|
||||
<button type={'button'} aria-label={gettext('Saving...')} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className={'fa fa-spin fa-spinner'}/>
|
||||
<i className='sf3-font sf3-font-spinner'/>
|
||||
</button>
|
||||
:
|
||||
<ButtonItem text={gettext('Save')} id={'saveButton'} icon={'fa fa-save'} disabled={!contentChanged}
|
||||
<ButtonItem text={gettext('Save')} id={'saveButton'} icon='sf3-font sf3-font-save' disabled={!contentChanged}
|
||||
onMouseDown={this.props.onSaveEditorContent} isActive={contentChanged}/>
|
||||
}
|
||||
{canDownloadFile && (
|
||||
<ButtonItem
|
||||
id="download-file"
|
||||
icon="fa fa-download"
|
||||
icon="sf3-font sf3-font-download1"
|
||||
text={gettext('Download')}
|
||||
onClick={this.downloadFile}
|
||||
/>
|
||||
@ -153,9 +153,9 @@ class HeaderToolbar extends React.Component {
|
||||
<ButtonGroup>
|
||||
{saving ?
|
||||
<button type={'button'} aria-label={gettext('Saving...')} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className={'fa fa-spin fa-spinner'}/></button>
|
||||
<i className='sf3-font sf3-font-spinner'/></button>
|
||||
:
|
||||
<ButtonItem text={gettext('Save')} id={'saveButton'} icon={'fa fa-save'} disabled={!contentChanged}
|
||||
<ButtonItem text={gettext('Save')} id={'saveButton'} icon='sf3-font sf3-font-save' disabled={!contentChanged}
|
||||
onMouseDown={this.props.onSaveEditorContent} isActive={contentChanged}/>
|
||||
}
|
||||
</ButtonGroup>
|
||||
@ -193,10 +193,10 @@ class HeaderToolbar extends React.Component {
|
||||
<ButtonGroup>
|
||||
{saving ?
|
||||
<button type={'button'} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className={'fa fa-spin fa-spinner'}/>
|
||||
<i className='sf3-font sf3-font-spinner'/>
|
||||
</button>
|
||||
:
|
||||
<ButtonItem id={'saveButton'} text={gettext('Save')} icon={'fa fa-save'} onMouseDown={this.props.onSaveEditorContent} disabled={!contentChanged} isActive={contentChanged} />
|
||||
<ButtonItem id={'saveButton'} text={gettext('Save')} icon='sf3-font sf3-font-save' onMouseDown={this.props.onSaveEditorContent} disabled={!contentChanged} isActive={contentChanged} />
|
||||
}
|
||||
</ButtonGroup>
|
||||
<MoreMenu
|
||||
@ -215,12 +215,12 @@ class HeaderToolbar extends React.Component {
|
||||
<ButtonGroup>
|
||||
{saving ?
|
||||
<button type={'button'} className={'btn btn-icon btn-secondary btn-active'}>
|
||||
<i className={'fa fa-spin fa-spinner'}/></button>
|
||||
<i className='sf3-font sf3-font-spinner'/></button>
|
||||
:
|
||||
<ButtonItem
|
||||
id={'saveButton'}
|
||||
text={gettext('Save')}
|
||||
icon={'fa fa-save'}
|
||||
icon='sf3-font sf3-font-save'
|
||||
onMouseDown={this.props.onSaveEditorContent}
|
||||
disabled={!contentChanged}
|
||||
isActive={contentChanged}
|
||||
|
||||
@ -51,7 +51,7 @@ class MoreMenu extends React.PureComponent {
|
||||
return (
|
||||
<Dropdown isOpen={this.state.dropdownOpen} toggle={this.dropdownToggle} direction="down" className="mx-1">
|
||||
<DropdownToggle id="moreButton" aria-label={gettext('More operations')}>
|
||||
<i className="fa fa-ellipsis-v"/>
|
||||
<i className="sf3-font sf3-font-more-vertical"/>
|
||||
<Tooltip toggle={this.tooltipToggle} delay={{show: 0, hide: 0}} target="moreButton" placement='bottom' isOpen={this.state.tooltipOpen}>{gettext('More')}
|
||||
</Tooltip>
|
||||
</DropdownToggle>
|
||||
|
||||
@ -259,7 +259,7 @@ class MylibRepoMenu extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -110,7 +110,7 @@ class GroupItem extends React.Component {
|
||||
<td>{moment(group.created_at).fromNow()}</td>
|
||||
<td>
|
||||
{Utils.bytesToSize(group.quota)}{' '}
|
||||
<span onClick={this.toggleSetQuotaDialog} title={gettext('Edit Quota')} className={`fa fa-pencil-alt attr-action-icon ${highlight ? '' : 'vh'}`}></span>
|
||||
<span onClick={this.toggleSetQuotaDialog} title={gettext('Edit Quota')} className={`sf3-font sf3-font-rename attr-action-icon ${highlight ? '' : 'vh'}`}></span>
|
||||
</td>
|
||||
<td>
|
||||
{isOpIconShown &&
|
||||
|
||||
@ -64,7 +64,7 @@ class Content extends Component {
|
||||
<h2>{gettext('No libraries')}</h2>
|
||||
</EmptyTip>
|
||||
);
|
||||
const initialSortIcon = <span className="fas fa-sort"></span>;
|
||||
const initialSortIcon = <span className="sf3-font sf3-font-sort3"></span>;
|
||||
const sortIcon = <span className="sf3-font sf3-font-down"></span>;
|
||||
const table = (
|
||||
<Fragment>
|
||||
@ -256,7 +256,7 @@ class RepoItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="a"
|
||||
className="attr-action-icon fas fa-ellipsis-v"
|
||||
className="attr-action-icon sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -104,7 +104,7 @@ class GroupItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="a"
|
||||
className="attr-action-icon fas fa-ellipsis-v"
|
||||
className="attr-action-icon sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -42,7 +42,7 @@ class Search extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="input-icon">
|
||||
<i className="d-flex input-icon-addon fas fa-search"></i>
|
||||
<i className="d-flex input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input h-6 mr-1"
|
||||
@ -295,7 +295,7 @@ class GroupItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="a"
|
||||
className="attr-action-icon fas fa-ellipsis-v"
|
||||
className="attr-action-icon sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -205,7 +205,7 @@ class RepoItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="a"
|
||||
className="attr-action-icon fas fa-ellipsis-v"
|
||||
className="attr-action-icon sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -183,7 +183,7 @@ class UserItem extends React.Component {
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="a"
|
||||
className="attr-action-icon fas fa-ellipsis-v"
|
||||
className="attr-action-icon sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -136,13 +136,13 @@ class Content extends Component {
|
||||
<dt>{gettext('Name')}</dt>
|
||||
<dd>
|
||||
{name || '--'}
|
||||
<span title={gettext('Edit')} className="attr-action-icon fa fa-pencil-alt" onClick={this.toggleSetNameDialog}></span>
|
||||
<span title={gettext('Edit')} className="attr-action-icon sf3-font sf3-font-rename" onClick={this.toggleSetNameDialog}></span>
|
||||
</dd>
|
||||
|
||||
<dt>{gettext('Contact Email')}</dt>
|
||||
<dd>
|
||||
{contact_email || '--'}
|
||||
<span title={gettext('Edit')} className="attr-action-icon fa fa-pencil-alt" onClick={this.toggleSetContactEmailDialog}></span>
|
||||
<span title={gettext('Edit')} className="attr-action-icon sf3-font sf3-font-rename" onClick={this.toggleSetContactEmailDialog}></span>
|
||||
</dd>
|
||||
|
||||
<dt>{gettext('Organization')}</dt>
|
||||
@ -151,7 +151,7 @@ class Content extends Component {
|
||||
<dt>{gettext('Space Used / Quota')}</dt>
|
||||
<dd>
|
||||
{`${Utils.bytesToSize(quota_usage)}${quota_total > 0 ? ' / ' + Utils.bytesToSize(quota_total) : ''}`}
|
||||
<span title={gettext('Edit')} className="attr-action-icon fa fa-pencil-alt" onClick={this.toggleSetQuotaDialog}></span>
|
||||
<span title={gettext('Edit')} className="attr-action-icon sf3-font sf3-font-rename" onClick={this.toggleSetQuotaDialog}></span>
|
||||
</dd>
|
||||
</dl>
|
||||
{isSetNameDialogOpen &&
|
||||
|
||||
@ -97,7 +97,7 @@ class OrgUsers extends Component {
|
||||
topbarChildren = (
|
||||
<Fragment>
|
||||
<button className={topBtn} title={gettext('Add admin')} onClick={this.toggleAddOrgAdmin}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Add admin')}
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('Add admin')}
|
||||
</button>
|
||||
{this.state.isShowAddOrgAdminDialog &&
|
||||
<ModalPortal>
|
||||
|
||||
@ -59,7 +59,7 @@ class OrgUsersList extends React.Component {
|
||||
let sortIcon;
|
||||
if (sortBy == '') {
|
||||
// initial sort icon
|
||||
sortIcon = <span className="fas fa-sort"></span>;
|
||||
sortIcon = <span className="sf3-font sf3-font-sort3"></span>;
|
||||
} else {
|
||||
sortIcon = <span className={`sf3-font ${sortOrder == 'asc' ? 'sf3-font-down rotate-180 d-inline-block' : 'sf3-font-down'}`}></span>;
|
||||
}
|
||||
|
||||
@ -48,7 +48,7 @@ class Search extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="input-icon">
|
||||
<i className="d-flex input-icon-addon fas fa-search"></i>
|
||||
<i className="d-flex input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input h-6 mr-1"
|
||||
@ -269,14 +269,14 @@ class OrgUsers extends Component {
|
||||
<Fragment>
|
||||
<button className="btn btn-secondary operation-item" onClick={this.toggleImportOrgUsersDialog}>{gettext('Import users')}</button>
|
||||
<button className={topBtn} title={gettext('Add user')} onClick={this.toggleAddOrgUser}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Add user')}</button>
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('Add user')}</button>
|
||||
{orgEnableAdminInviteUser &&
|
||||
<button className={topBtn} title={gettext('Invite users')} onClick={this.toggleInviteUserDialog}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Invite users')}</button>
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('Invite users')}</button>
|
||||
}
|
||||
{invitationLink &&
|
||||
<button className={topBtn} title={'通过微信邀请用户'} onClick={this.toggleInviteUserViaWeiXinDialog}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{'通过微信邀请用户'}</button>
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{'通过微信邀请用户'}</button>
|
||||
}
|
||||
{this.state.isImportOrgUsersDialogOpen &&
|
||||
<ModalPortal>
|
||||
|
||||
@ -164,7 +164,7 @@ class SidePanel extends Component {
|
||||
<Dropdown isOpen={this.state.isHeaderMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="fas fa-ellipsis-v"
|
||||
className="sf3-font sf3-font-more-vertical"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -125,7 +125,7 @@ class HistoryVersion extends React.Component {
|
||||
? (
|
||||
<>
|
||||
<a
|
||||
className={`fas fa-ellipsis-v ${(this.state.isShowOperationIcon || isHighlightItem) ? '' : 'invisible'}`}
|
||||
className={`sf3-font sf3-font-more-vertical ${(this.state.isShowOperationIcon || isHighlightItem) ? '' : 'invisible'}`}
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
aria-expanded={this.state.isMenuShow}
|
||||
@ -158,7 +158,7 @@ class HistoryVersion extends React.Component {
|
||||
: (<Dropdown isOpen={this.state.isMenuShow} toggle={this.onToggleClick}>
|
||||
<DropdownToggle
|
||||
tag='a'
|
||||
className={`fas fa-ellipsis-v ${(this.state.isShowOperationIcon || isHighlightItem) ? '' : 'invisible'}`}
|
||||
className={`sf3-font sf3-font-more-vertical ${(this.state.isShowOperationIcon || isHighlightItem) ? '' : 'invisible'}`}
|
||||
data-toggle="dropdown"
|
||||
aria-expanded={this.state.isMenuShow}
|
||||
title={gettext('More operations')}
|
||||
|
||||
@ -278,7 +278,7 @@ class SdocFileHistory extends React.Component {
|
||||
id="sdoc-file-changes-last"
|
||||
onClick={this.lastChange}
|
||||
>
|
||||
<span className="fas fa-chevron-up"></span>
|
||||
<span className="sf3-font sf3-font-down rotate-180 d-inline-block"></span>
|
||||
</div>
|
||||
<div className="sdoc-file-changes-divider"></div>
|
||||
<div
|
||||
@ -286,7 +286,7 @@ class SdocFileHistory extends React.Component {
|
||||
id="sdoc-file-changes-next"
|
||||
onClick={this.nextChange}
|
||||
>
|
||||
<span className="fas fa-chevron-down"></span>
|
||||
<span className="sf3-font sf3-font-down"></span>
|
||||
</div>
|
||||
<UncontrolledTooltip placement="bottom" target="sdoc-file-changes-last" delay={0} fade={false}>
|
||||
{gettext('Last modification')}
|
||||
|
||||
@ -204,7 +204,7 @@ class AdvancedSearch extends React.Component {
|
||||
onChange={this.props.handleTimeFromInput}
|
||||
showHourAndMinute={false}
|
||||
/>
|
||||
<span className="select-data-icon"><i className="fa fa-calendar-alt"></i></span>
|
||||
<span className="select-data-icon"><i className="sf3-font sf3-font-calendar-alt"></i></span>
|
||||
</Col>
|
||||
<div className="mt-2">-</div>
|
||||
<Col md="4" lg="4" sm="4" xs="5" className="position-relative">
|
||||
@ -215,7 +215,7 @@ class AdvancedSearch extends React.Component {
|
||||
onChange={this.props.handleTimeToInput}
|
||||
showHourAndMinute={false}
|
||||
/>
|
||||
<span className="select-data-icon"><i className="fa fa-calendar-alt"></i></span>
|
||||
<span className="select-data-icon"><i className="sf3-font sf3-font-calendar-alt"></i></span>
|
||||
</Col>
|
||||
</Row>
|
||||
{errorDateMsg && <Row><Col md="2" lg="2"></Col><Col md="8" className="error mt-2">{errorDateMsg}</Col></Row>}
|
||||
|
||||
@ -331,8 +331,8 @@ class SearchViewPanel extends React.Component {
|
||||
onChange={this.handleSearchInput}
|
||||
onKeyDown={this.handleKeyDown}
|
||||
/>
|
||||
<i className="search-icon-right input-icon-addon fas fa-search" onClick={this.handleSubmit}></i>
|
||||
<i className={`fas action-icon fa-angle-double-${isCollapseOpen ? 'up' : 'down'}`} onClick={this.toggleCollapse}></i>
|
||||
<i className="search-icon-right input-icon-addon sf3-font sf3-font-search" onClick={this.handleSubmit}></i>
|
||||
<i className={`action-icon sf3-font sf3-font-angles-${isCollapseOpen ? 'up' : 'down'}`} onClick={this.toggleCollapse}></i>
|
||||
</div>
|
||||
{this.state.errorMsg && <div className="error">{this.state.errorMsg}</div>}
|
||||
<AdvancedSearch
|
||||
|
||||
@ -226,7 +226,7 @@ class Item extends Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.onEditPermission}>
|
||||
</a>
|
||||
)}
|
||||
@ -263,7 +263,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -240,7 +240,7 @@ class Item extends Component {
|
||||
role="button"
|
||||
aria-label={gettext('Edit')}
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={this.onEditPermission}>
|
||||
</a>
|
||||
)}
|
||||
@ -277,7 +277,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -318,7 +318,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -169,7 +169,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -410,7 +410,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
aria-expanded={this.state.isOpMenuOpen}
|
||||
|
||||
@ -81,7 +81,7 @@ class TopToolbar extends React.Component {
|
||||
<Dropdown isOpen={this.state.isCreateMenuShow} toggle={this.onAddRepoToggle}>
|
||||
<MediaQuery query="(min-width: 768px)">
|
||||
<DropdownToggle className='btn btn-secondary operation-item'>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('Add Library')}
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('Add Library')}
|
||||
</DropdownToggle>
|
||||
</MediaQuery>
|
||||
<MediaQuery query="(max-width: 767.8px)">
|
||||
|
||||
@ -261,7 +261,7 @@ class Item extends Component {
|
||||
<Dropdown isOpen={this.state.isOpMenuOpen} toggle={this.toggleOpMenu}>
|
||||
<DropdownToggle
|
||||
tag="i"
|
||||
className="sf-dropdown-toggle fa fa-ellipsis-v ml-0"
|
||||
className="sf-dropdown-toggle sf3-font sf3-font-more-vertical ml-0"
|
||||
title={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
aria-expanded={this.state.isOpMenuOpen}
|
||||
|
||||
@ -117,7 +117,7 @@ class GroupItem extends React.Component {
|
||||
<td>{moment(group.created_at).fromNow()}</td>
|
||||
<td>
|
||||
{Utils.bytesToSize(group.quota)}{' '}
|
||||
<span onClick={this.toggleSetQuotaDialog} title={gettext('Edit')} className={`fa fa-pencil-alt attr-action-icon ${highlight ? '' : 'vh'}`}></span>
|
||||
<span onClick={this.toggleSetQuotaDialog} title={gettext('Edit')} className={`sf3-font sf3-font-rename attr-action-icon ${highlight ? '' : 'vh'}`}></span>
|
||||
</td>
|
||||
<td>
|
||||
{isOpIconShown &&
|
||||
|
||||
@ -116,7 +116,7 @@ class DingtalkDepartmentsTreeNode extends Component {
|
||||
>
|
||||
<DropdownToggle
|
||||
tag='i'
|
||||
className='fa fa-ellipsis-v cursor-pointer attr-action-icon'
|
||||
className='sf3-font sf3-font-more-vertical cursor-pointer attr-action-icon'
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -26,7 +26,7 @@ class Content extends Component {
|
||||
return (
|
||||
<span
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={action}>
|
||||
</span>
|
||||
);
|
||||
|
||||
@ -54,7 +54,7 @@ class Content extends Component {
|
||||
</EmptyTip>
|
||||
);
|
||||
|
||||
const initialSortIcon = <span className="fas fa-sort"></span>;
|
||||
const initialSortIcon = <span className="sf3-font sf3-font-sort3"></span>;
|
||||
const sortIcon = <span className={`sf3-font ${sortOrder == 'asc' ? 'sf3-font-down rotate-180 d-inline-block' : 'sf3-font-down'}`}></span>;
|
||||
const table = (
|
||||
<Fragment>
|
||||
|
||||
@ -39,7 +39,7 @@ class Content extends Component {
|
||||
return (
|
||||
<span
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={action}>
|
||||
</span>
|
||||
);
|
||||
|
||||
@ -150,7 +150,7 @@ class AllRepos extends Component {
|
||||
<Fragment>
|
||||
<MainPanelTopbar search={this.getSearch()} {...this.props}>
|
||||
<Button className="btn btn-secondary operation-item" onClick={this.toggleCreateRepoDialog}>
|
||||
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('New Library')}
|
||||
<i className="sf3-font sf3-font-enlarge text-secondary mr-1"></i>{gettext('New Library')}
|
||||
</Button>
|
||||
</MainPanelTopbar>
|
||||
<div className="main-panel-center flex-row">
|
||||
|
||||
@ -66,7 +66,7 @@ class Content extends Component {
|
||||
<h2>{gettext('No libraries')}</h2>
|
||||
</EmptyTip>
|
||||
);
|
||||
const initialSortIcon = <span className="fas fa-sort"></span>;
|
||||
const initialSortIcon = <span className="sf3-font sf3-font-sort3"></span>;
|
||||
const sortIcon = <span className="sf3-font sf3-font-down"></span>;
|
||||
const table = (
|
||||
<Fragment>
|
||||
|
||||
@ -39,7 +39,7 @@ class Search extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="input-icon">
|
||||
<i className="d-flex input-icon-addon fas fa-search"></i>
|
||||
<i className="d-flex input-icon-addon sf3-font sf3-font-search"></i>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control search-input h-6 mr-1"
|
||||
|
||||
@ -89,7 +89,7 @@ class Content extends Component {
|
||||
return (
|
||||
<span
|
||||
title={gettext('Edit')}
|
||||
className="fa fa-pencil-alt attr-action-icon"
|
||||
className="sf3-font sf3-font-rename attr-action-icon"
|
||||
onClick={action}>
|
||||
</span>
|
||||
);
|
||||
|
||||
@ -76,7 +76,7 @@ class Content extends Component {
|
||||
let sortIcon;
|
||||
if (sortBy == '') {
|
||||
// initial sort icon
|
||||
sortIcon = <span className="fas fa-sort"></span>;
|
||||
sortIcon = <span className="sf3-font sf3-font-sort3"></span>;
|
||||
} else {
|
||||
sortIcon = <span className={`sf3-font ${sortOrder == 'asc' ? 'sf3-font-down rotate-180 d-inline-block' : 'sf3-font-down'}`}></span>;
|
||||
}
|
||||
@ -536,7 +536,7 @@ class Item extends Component {
|
||||
{`${Utils.bytesToSize(item.quota_usage)} / ${item.quota_total > 0 ? Utils.bytesToSize(item.quota_total) : '--'}`}
|
||||
<span
|
||||
title={gettext('Edit')}
|
||||
className={`fa fa-pencil-alt attr-action-icon ${isOpIconShown ? '' : 'invisible'}`}
|
||||
className={`sf3-font sf3-font-rename attr-action-icon ${isOpIconShown ? '' : 'invisible'}`}
|
||||
onClick={this.toggleSetQuotaDialog}>
|
||||
</span>
|
||||
</td>
|
||||
|
||||
@ -116,7 +116,7 @@ class WorkWeixinDepartmentsTreeNode extends Component {
|
||||
>
|
||||
<DropdownToggle
|
||||
tag='i'
|
||||
className='fa fa-ellipsis-v cursor-pointer attr-action-icon'
|
||||
className='sf3-font sf3-font-more-vertical cursor-pointer attr-action-icon'
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
|
||||
@ -19,7 +19,7 @@ class ForbidUploadListItem extends React.Component {
|
||||
<td>{Utils.bytesToSize(file.size)}</td>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className="upload-failure-icon fas fa-exclamation mr-2"></span>
|
||||
<span className="upload-failure-icon sf3-font sf3-font-info mr-2"></span>
|
||||
<span className="upload-failure-msg">{gettext('File too large')}</span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user