fix(fe/styles): style fixes

This commit is contained in:
hexxa 2021-12-25 16:50:14 +08:00 committed by Hexxa
parent 49f42e937f
commit 6aed184ad9
6 changed files with 17 additions and 16 deletions

View file

@ -113,6 +113,7 @@
background-color: white; background-color: white;
border-radius: 0.8rem; border-radius: 0.8rem;
margin-bottom: 2rem; margin-bottom: 2rem;
box-shadow: 0 5px 30px 0 rgb(31 38 135 / 10%);
} }
.container-padding { .container-padding {

View file

@ -14,7 +14,7 @@ import { colorClass } from "../visual/colors";
const defaultIconProps: IconProps = { const defaultIconProps: IconProps = {
name: "RiFolder2Fill", name: "RiFolder2Fill",
size: "1.6rem", size: "1.6rem",
color: `${colorClass("cyan0")}-font`, color: `${colorClass("1")}-font`,
}; };
export interface Props { export interface Props {

View file

@ -45,12 +45,12 @@ export class SettingsDialog extends React.Component<Props, State, {}> {
preferencePane: { preferencePane: {
name: "RiSettings3Fill", name: "RiSettings3Fill",
size: "1.6rem", size: "1.6rem",
color: "cyan0", color: "cyan1",
}, },
managementPane: { managementPane: {
name: "RiWindowFill", name: "RiWindowFill",
size: "1.6rem", size: "1.6rem",
color: "cyan0", color: "cyan1",
}, },
})} })}
login={this.props.login} login={this.props.login}

View file

@ -421,7 +421,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
</div> </div>
) : ( ) : (
<div className="v-mid item-cell"> <div className="v-mid item-cell">
<RiFile2Fill size="3rem" className="cyan0-font" /> <RiFile2Fill size="3rem" className="cyan1-font" />
</div> </div>
); );
@ -481,13 +481,13 @@ export class FilesPanel extends React.Component<Props, State, {}> {
); );
const detailColor = this.state.showDetail.has(item.name) const detailColor = this.state.showDetail.has(item.name)
? "cyan0" ? "cyan1"
: "grey0"; : "grey0";
const op = item.isDir ? ( const op = item.isDir ? (
<div className={`v-mid item-cell item-op ${showOp}`}> <div className={`v-mid item-cell item-op ${showOp}`}>
<span onClick={() => this.select(item.name)} className="float-l"> <span onClick={() => this.select(item.name)} className="float-l">
{isSelected {isSelected
? getIcon("RiCheckboxFill", "1.8rem", "cyan0") ? getIcon("RiCheckboxFill", "1.8rem", "cyan1")
: getIcon("RiCheckboxBlankFill", "1.8rem", "black1")} : getIcon("RiCheckboxBlankFill", "1.8rem", "black1")}
</span> </span>
</div> </div>
@ -502,7 +502,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
<span onClick={() => this.select(item.name)} className="float-l"> <span onClick={() => this.select(item.name)} className="float-l">
{isSelected {isSelected
? getIcon("RiCheckboxFill", "1.8rem", "cyan0") ? getIcon("RiCheckboxFill", "1.8rem", "cyan1")
: getIcon("RiCheckboxBlankFill", "1.8rem", "black1")} : getIcon("RiCheckboxBlankFill", "1.8rem", "black1")}
</span> </span>
</div> </div>
@ -569,14 +569,14 @@ export class FilesPanel extends React.Component<Props, State, {}> {
? `${dirPath}${item.name}` ? `${dirPath}${item.name}`
: `${dirPath}/${item.name}`; : `${dirPath}/${item.name}`;
const selectedIconColor = isSelected ? "cyan0-font" : "grey0-font"; const selectedIconColor = isSelected ? "cyan1-font" : "grey0-font";
const descIconColor = this.state.showDetail.has(item.name) const descIconColor = this.state.showDetail.has(item.name)
? "cyan0-font" ? "cyan1-font"
: "grey0-font"; : "grey0-font";
const icon = item.isDir ? ( const icon = item.isDir ? (
<RiFolder2Fill size="1.8rem" className="yellow0-font" /> <RiFolder2Fill size="1.8rem" className="yellow0-font" />
) : ( ) : (
<RiFile2Fill size="1.8rem" className="cyan0-font" /> <RiFile2Fill size="1.8rem" className="cyan1-font" />
); );
const fileType = item.isDir const fileType = item.isDir
? this.props.msg.pkg.get("item.type.folder") ? this.props.msg.pkg.get("item.type.folder")
@ -786,11 +786,11 @@ export class FilesPanel extends React.Component<Props, State, {}> {
const rowsViewColorClass = const rowsViewColorClass =
this.props.ui.control.controls.get(filesViewCtrl) === "rows" this.props.ui.control.controls.get(filesViewCtrl) === "rows"
? "cyan0-font" ? "cyan1-font"
: "black-font"; : "black-font";
const tableViewColorClass = const tableViewColorClass =
this.props.ui.control.controls.get(filesViewCtrl) === "table" this.props.ui.control.controls.get(filesViewCtrl) === "table"
? "cyan0-font" ? "cyan1-font"
: "black-font"; : "black-font";
const itemListPane = ( const itemListPane = (
<div> <div>

View file

@ -88,17 +88,17 @@ export class RootFrame extends React.Component<Props, State, {}> {
filesPanel: { filesPanel: {
name: "RiFolder2Fill", name: "RiFolder2Fill",
size: "1.6rem", size: "1.6rem",
color: "cyan0", color: "cyan1",
}, },
uploadingsPanel: { uploadingsPanel: {
name: "RiUploadCloudFill", name: "RiUploadCloudFill",
size: "1.6rem", size: "1.6rem",
color: "blue0", color: "cyan1",
}, },
sharingsPanel: { sharingsPanel: {
name: "RiShareBoxLine", name: "RiShareBoxLine",
size: "1.6rem", size: "1.6rem",
color: "purple0", color: "cyan1",
}, },
})} })}
login={this.props.login} login={this.props.login}

View file

@ -98,7 +98,7 @@ export class TopBar extends React.Component<Props, State, {}> {
className={`margin-r-m ${showSettings}`} className={`margin-r-m ${showSettings}`}
> >
{this.props.msg.pkg.get("settings")} {this.props.msg.pkg.get("settings")}
{/* {getIcon("RiSettings4Line", "1.8rem", "cyan0")} */} {/* {getIcon("RiSettings4Line", "1.8rem", "cyan1")} */}
</button>, </button>,
<button onClick={this.logout} className={`${showLogin}`}> <button onClick={this.logout} className={`${showLogin}`}>