style update

src/Common.css

@@ -41,7 +41,7 @@
     left: 0;
     width: 100%;
     height: 100%;
-    background: #124 fixed center center;
+    background: #124 center center;
     background-size: cover;
 }
 

src/Flows.css

@@ -46,24 +46,6 @@
     clear: both;
 }
 
-@media screen and (max-width: 900px) {
-    .left-container .flow-item {
-        display: block;
-        width: calc(100vw - 20px);
-        max-width: 600px;
-        float: none;
-    }
-
-    .flow-reply-row {
-        display: flex;
-        width: 100% !important;
-        margin-left: 0;
-        padding-left: 30px;
-        margin-top: -2.5em;
-        margin-bottom: -1em;
-    }
-}
-
 .left-container .flow-reply {
     flex: 0 0 300px;
     max-height: 15em;
@@ -79,7 +61,7 @@
     width: calc(100% - 2 * 50px);
 }
 
-@media screen and (max-width: 1200px) {
+@media screen and (max-width: 1300px) {
     .aux-margin,
     .left-container .flow-item {
         margin-left: 10px;
@@ -89,7 +71,33 @@
     }
 
     .flow-reply-row {
-        width: calc(100% - 585px);
+        width: calc(100% - 485px);
+    }
+
+    .left-container .flow-item {
+        width: 500px;
+    }
+
+    .flow-item-row:hover::before {
+        display: none;
+    }
+}
+
+@media screen and (max-width: 900px) {
+    .left-container .flow-item {
+        display: block;
+        width: calc(100vw - 20px);
+        max-width: 500px;
+        float: none;
+    }
+
+    .flow-reply-row {
+        display: flex;
+        width: 100% !important;
+        margin-left: 0;
+        padding-left: 30px;
+        margin-top: -2.5em;
+        margin-bottom: -1em;
     }
 }
 
@@ -107,12 +115,6 @@
     font-family: 'Consolas', 'Courier', monospace;
 }
 
-@media screen and (max-width: 1200px) {
-    .flow-item-row:hover::before {
-        display: none;
-    }
-}
-
 .box-header {
     font-size: small;
 }

src/Flows.js

@@ -75,8 +75,8 @@ function FlowItem(props) {
         event.preventDefault();
         copy(
             `${event.target.href}\n`+
-            `（${format_time(new Date(props.info.timestamp*1000))} ${props.info.likenum}关注 ${props.info.reply}回复）\n`+
             `${props.info.text}${props.info.type==='image'?' [图片]':props.info.type==='audio'?' [语音]':''}\n`+
+            `（${format_time(new Date(props.info.timestamp*1000))} ${props.info.likenum}关注 ${props.info.reply}回复）\n`+
             props.replies.map((r)=>(r.text)).join('\n')
         );
     }

src/Sidebar.css

@@ -37,18 +37,18 @@
     font-weight: bold;
 }
 
-@media screen and (max-width: 1200px) {
+@media screen and (max-width: 1300px) {
     .sidebar {
         width: 550px;
+        padding: 1em .5em;
     }
     .sidebar-on .sidebar {
         left: calc(100% - 550px);
     }
 }
-@media screen and (max-width: 600px) {
+@media screen and (max-width: 570px) {
     .sidebar {
         width: calc(100% - 20px);
-        padding: 1em .5em;
     }
     .sidebar-on .sidebar {
         left: 20px;