fix(fe/themes): normalize white theme
This commit is contained in:
parent
aabde4c3d7
commit
4cdfddc090
15 changed files with 527 additions and 1047 deletions
|
@ -7,18 +7,19 @@
|
|||
name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1, minimum-scale=1, user-scalable=no,uc-fitscreen=yes"
|
||||
/>
|
||||
<link rel="icon" href="static/img/favicon.svg">
|
||||
<link rel="icon" href="static/img/favicon.svg" />
|
||||
<link rel=”mask-icon” href=”static/img/favicon.svg” color=”#16a085">
|
||||
<link rel="apple-touch-icon" href="static/img/favicon.png">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
|
||||
<link rel="apple-touch-icon" href="static/img/favicon.png" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
|
||||
<script src="/static/js/react.development.js?v=16.8.6"></script>
|
||||
<script src="/static/js/react-dom.development.js?v=16.8.6"></script>
|
||||
<script src="/static/js/immutable.min.js?v=4.0.0-rc.12"></script>
|
||||
<link rel="stylesheet" href="/static/css/reset.css">
|
||||
<link rel="stylesheet" href="/static/css/default.css">
|
||||
<link rel="stylesheet" href="/static/css/white.css">
|
||||
<link rel="stylesheet" href="/static/css/white_compact.css">
|
||||
<link rel="stylesheet" href="/static/css/reset.css" />
|
||||
<link rel="stylesheet" href="/static/css/colors.css" />
|
||||
<link rel="stylesheet" href="/static/css/default.css" />
|
||||
<link rel="stylesheet" href="/static/css/white.css" />
|
||||
<link rel="stylesheet" href="/static/css/black.css" />
|
||||
<!-- <link
|
||||
rel="apple-touch-icon"
|
||||
sizes="57x57"
|
||||
|
|
|
@ -7,18 +7,19 @@
|
|||
name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1, minimum-scale=1, user-scalable=no,uc-fitscreen=yes"
|
||||
/>
|
||||
<link rel="icon" href="static/img/favicon.svg">
|
||||
<link rel="icon" href="static/img/favicon.svg" />
|
||||
<link rel=”mask-icon” href=”static/img/favicon.svg” color=”#16a085">
|
||||
<link rel="apple-touch-icon" href="static/img/favicon.png">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<link rel="apple-touch-icon" href="static/img/favicon.png" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
|
||||
<script src="/static/js/react.production.min.js?v=16.8.6"></script>
|
||||
<script src="/static/js/react-dom.production.min.js?v=16.8.6"></script>
|
||||
<script src="/static/js/immutable.min.js?v=4.0.0-rc.12"></script>
|
||||
<link rel="stylesheet" href="/static/css/reset.css">
|
||||
<link rel="stylesheet" href="/static/css/default.css">
|
||||
<link rel="stylesheet" href="/static/css/white.css">
|
||||
<link rel="stylesheet" href="/static/css/white_compact.css">
|
||||
<link rel="stylesheet" href="/static/css/reset.css" />
|
||||
<link rel="stylesheet" href="/static/css/colors.css" />
|
||||
<link rel="stylesheet" href="/static/css/default.css" />
|
||||
<link rel="stylesheet" href="/static/css/white.css" />
|
||||
<link rel="stylesheet" href="/static/css/black.css" />
|
||||
<!-- <link
|
||||
rel="apple-touch-icon"
|
||||
sizes="57x57"
|
||||
|
|
|
@ -25,7 +25,7 @@ export const BtnList = (props: Props) => {
|
|||
const btns = props.btnNames.map((btnName: string, i: number) => {
|
||||
const cb = props.btnCallbacks.get(i);
|
||||
return (
|
||||
<button key={`rows-${i}`} className="float button-default" onClick={cb}>
|
||||
<button key={`rows-${i}`} className="inline-block margin-r-m button-default" onClick={cb}>
|
||||
{btnName}
|
||||
</button>
|
||||
);
|
||||
|
|
|
@ -7,7 +7,7 @@ export interface Props {
|
|||
|
||||
export const Card = (props: Props) => {
|
||||
return (
|
||||
<div className="card float-l">
|
||||
<div className="padding-m float-l">
|
||||
<div className="title-l black0-font">{props.value}</div>
|
||||
<div className="desc-m">{props.name}</div>
|
||||
</div>
|
||||
|
|
|
@ -211,7 +211,7 @@ export class UserForm extends React.Component<
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="user-form">
|
||||
<div className="padding-t-m padding-b-m">
|
||||
<Columns
|
||||
rows={List([
|
||||
List([
|
||||
|
@ -394,6 +394,8 @@ export class UserForm extends React.Component<
|
|||
])}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="hr"></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -551,7 +553,7 @@ export class AdminPane extends React.Component<Props, State, {}> {
|
|||
|
||||
const roleList = this.props.admin.roles.valueSeq().map((role: string) => {
|
||||
return (
|
||||
<div key={role} className="role-list-item">
|
||||
<div key={role} className="margin-b-m">
|
||||
<Flexbox
|
||||
children={List([
|
||||
<span>{role}</span>,
|
||||
|
|
|
@ -561,11 +561,11 @@ export class FilesPanel extends React.Component<Props, State, {}> {
|
|||
</div>
|
||||
|
||||
<div className="column">
|
||||
<div className="card margin-l-m">
|
||||
<div className="card">
|
||||
<span className="title-m dark-font">{modTimeTitle}</span>
|
||||
<span className="font-s work-break-all">{modTimeFormatted}</span>
|
||||
</div>
|
||||
<div className="card margin-l-m">
|
||||
<div className="card">
|
||||
<span className="title-m dark-font">{sizeTitle}</span>
|
||||
<span className="font-s work-break-all">{itemSize}</span>
|
||||
</div>
|
||||
|
@ -756,7 +756,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
|
|||
);
|
||||
const viewType = this.props.ui.control.controls.get(filesViewCtrl);
|
||||
const view = (
|
||||
<div id="item-rows">
|
||||
<div className="margin-t-l">
|
||||
{this.prepareColumns(this.props.filesInfo.items, showOp)}
|
||||
</div>
|
||||
); // TODO: support better views in the future
|
||||
|
@ -800,7 +800,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
|
|||
</div>
|
||||
|
||||
<Container>
|
||||
<div id="browser-op" className={`${showOp}`}>
|
||||
<div className={`${showOp} margin-b-m`}>
|
||||
<Flexbox
|
||||
children={List([
|
||||
<span>
|
||||
|
@ -812,7 +812,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
|
|||
this.props.filesInfo.dirPath.join("/")
|
||||
);
|
||||
}}
|
||||
className="red-btn margin-r-m"
|
||||
className="red0-bg white-font margin-r-m"
|
||||
>
|
||||
{this.props.msg.pkg.get("browser.share.del")}
|
||||
</button>
|
||||
|
@ -833,7 +833,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
|
|||
<button
|
||||
type="button"
|
||||
onClick={() => this.delete()}
|
||||
className="red-btn margin-r-m"
|
||||
className="red0-bg white-font margin-r-m"
|
||||
>
|
||||
{this.props.msg.pkg.get("browser.delete")}
|
||||
</button>
|
||||
|
@ -869,7 +869,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
|
|||
<span className={`${showOp}`}>
|
||||
<button
|
||||
onClick={() => this.selectAll()}
|
||||
className="select-btn button-default"
|
||||
className="inline-block button-default"
|
||||
>
|
||||
{this.props.msg.pkg.get("browser.selectAll")}
|
||||
</button>
|
||||
|
|
|
@ -131,7 +131,7 @@ export class SharingsPanel extends React.Component<Props, State, {}> {
|
|||
);
|
||||
|
||||
const elem = (
|
||||
<div className="sharing-item" key={dirPath}>
|
||||
<div className="margin-t-m margin-b-m" key={dirPath}>
|
||||
{row1}
|
||||
<div className="desc">{sharingURL}</div>
|
||||
<div className="hr"></div>
|
||||
|
|
|
@ -151,10 +151,10 @@ export class UploadingsPanel extends React.Component<Props, State, {}> {
|
|||
);
|
||||
|
||||
const elem = (
|
||||
<div key={uploading.filePath} className="upload-item">
|
||||
<div className={`font-s l-col`}>
|
||||
<span className="title">{fileName} </span>
|
||||
<span className="desc grey0-font">
|
||||
<div key={uploading.filePath} className="margin-t-m margin-b-m">
|
||||
<div className={`font-s col-l`}>
|
||||
<span className="font-s work-break-all">{`${fileName} - `}</span>
|
||||
<span className="font-s work-break-all grey0-font">
|
||||
{FileSize(uploading.uploaded, { round: 0 })}
|
||||
/
|
||||
{FileSize(uploading.size, {
|
||||
|
@ -165,8 +165,8 @@ export class UploadingsPanel extends React.Component<Props, State, {}> {
|
|||
</span>
|
||||
</div>
|
||||
|
||||
<div className="r-col">{operations}</div>
|
||||
|
||||
<div className="col-r">{operations}</div>
|
||||
<div className="fix"></div>
|
||||
{progressBar}
|
||||
{errorInfo}
|
||||
</div>
|
||||
|
|
|
@ -52,7 +52,8 @@ export class RootFrame extends React.Component<Props, State, {}> {
|
|||
|
||||
render() {
|
||||
const bgStyle = this.makeBgStyle();
|
||||
const theme = "theme-default";
|
||||
const themeBlack = "theme-black";
|
||||
const theme = themeBlack;
|
||||
const fontSizeClass = "font-m";
|
||||
|
||||
const displaying = this.props.ui.control.controls.get(controlName);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue