From aabde4c3d74b13b5a1f8d9e2447c9d81db8b53ce Mon Sep 17 00:00:00 2001
From: hexxa <hexxa@outlook.com>
Date: Sat, 19 Mar 2022 12:23:52 +0800
Subject: [PATCH] fix(panel_sharings): fix issues

---
 public/static/css/white.css                   | 22 -------------------
 public/static/css/white_compact.css           | 22 +++++++++++++++++++
 src/client/web/src/components/panel_files.tsx |  7 +++---
 .../web/src/components/panel_sharings.tsx     |  4 ++--
 4 files changed, 27 insertions(+), 28 deletions(-)

diff --git a/public/static/css/white.css b/public/static/css/white.css
index 107e1e6..54c9b7c 100644
--- a/public/static/css/white.css
+++ b/public/static/css/white.css
@@ -339,28 +339,6 @@ input:focus {
   overflow-wrap: break-word;
 }
 
-.theme-default #sharing-list .info {
-  float: left;
-  width: 70%;
-  overflow-wrap: break-word;
-}
-
-.theme-default #sharing-list .op {
-  float: right;
-  width: 30%;
-  text-align: right;
-}
-
-.theme-default #sharing-list .desc {
-  background-color: #ecf0f1;
-  font-size: 1.2rem;
-  margin: 1rem 0;
-  color: #697384;
-  padding: 1rem;
-  border: dashed 1px #95a5a6;
-  overflow-wrap: break-word;
-}
-
 .theme-default .sharing-item {
   margin: 2rem 0 2rem 0;
 }
diff --git a/public/static/css/white_compact.css b/public/static/css/white_compact.css
index 5097730..d1c8c9a 100644
--- a/public/static/css/white_compact.css
+++ b/public/static/css/white_compact.css
@@ -126,3 +126,25 @@
   color: #7f8c8d;
   padding-left: 0.5rem;
 }
+
+.theme-default #sharing-list .col-l {
+  float: left;
+  width: 70%;
+  overflow-wrap: break-word;
+}
+
+.theme-default #sharing-list .col-r {
+  float: right;
+  width: 30%;
+  text-align: right;
+}
+
+.theme-default #sharing-list .desc {
+  background-color: #ecf0f1;
+  font-size: 1.2rem;
+  margin: 1rem 0;
+  color: #697384;
+  padding: 1rem;
+  border: dashed 1px #95a5a6;
+  overflow-wrap: break-word;
+}
\ No newline at end of file
diff --git a/src/client/web/src/components/panel_files.tsx b/src/client/web/src/components/panel_files.tsx
index 838ae90..d776b7c 100644
--- a/src/client/web/src/components/panel_files.tsx
+++ b/src/client/web/src/components/panel_files.tsx
@@ -491,7 +491,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
       const icon = item.isDir ? (
         <RiFolder2Fill size="2rem" className="yellow0-font margin-r-m" />
       ) : (
-        <RiFile2Fill size="2rem" className="cyan1-font margin-r-m" />
+        <RiFile2Fill size="2rem" className="highlight-font margin-r-m" />
       );
 
       const modTimeDate = new Date(item.modTime);
@@ -643,7 +643,6 @@ export class FilesPanel extends React.Component<Props, State, {}> {
     const endPoints = (
       <div className={showEndpoints}>
         <Container>
-          <h5 className="title-m"></h5>
           <Title
             title={this.props.msg.pkg.get("endpoints")}
             iconColor="black"
@@ -695,7 +694,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
             <div>
               <button
                 onClick={this.mkDir}
-                className="inline-block cyan1-bg white-font margin-r-m"
+                className="inline-block highlight-bg white-font margin-r-m"
               >
                 {this.props.msg.pkg.get("browser.folder.add")}
               </button>
@@ -711,7 +710,7 @@ export class FilesPanel extends React.Component<Props, State, {}> {
             <div>
               <button
                 onClick={this.onClickUpload}
-                className="cyan1-bg white-font"
+                className="highlight-bg white-font"
               >
                 {this.props.msg.pkg.get("browser.upload")}
               </button>
diff --git a/src/client/web/src/components/panel_sharings.tsx b/src/client/web/src/components/panel_sharings.tsx
index 5667789..ce14d81 100644
--- a/src/client/web/src/components/panel_sharings.tsx
+++ b/src/client/web/src/components/panel_sharings.tsx
@@ -99,11 +99,11 @@ export class SharingsPanel extends React.Component<Props, State, {}> {
 
         const row1 = (
           <div>
-            <div className="info">
+            <div className="col-l">
               <span className="title-m-wrap dark-font">{dirPath}</span>
             </div>
 
-            <div className="op">
+            <div className="col-r">
               <Flexbox
                 children={List([
                   <span className="margin-r-m">