change readme.md and app.css

readme.md

@@ -12,6 +12,29 @@ The app is a single binary with an embedded database (SQLite).
 The latest prebuilt binaries for Linux/MacOS/Windows AMD64 are available
 [here](https://github.com/nkanaev/yarr/releases/latest). Installation instructions:
 
+* Command Arges
+  
+  ```
+    -addr string
+          address to run server on (default "127.0.0.1:7070")
+    -auth-file path
+          path to a file containing username:password
+    -base string
+          base path of the service url
+    -cert-file path
+          path to cert file for https
+    -db path
+          storage file path
+    -key-file path
+          path to key file for https
+    -log-file path
+          path to log file to use instead of stdout
+    -open
+          open the server in browser
+    -version
+          print application version
+  ```
+
 * MacOS
 
   Download `yarr-*-macos64.zip`, unzip it, place `yarr.app` in `/Applications` folder, [open the app][macos-open], click the anchor menu bar icon, select "Open".
@@ -27,12 +50,53 @@ and run [the script](etc/install-linux.sh).
 
 [macos-open]: https://support.apple.com/en-gb/guide/mac-help/mh40616/mac
 
-For self-hosting, see `yarr -h` for auth, tls & server configuration flags.
+* Docker environment
+  
+  You can use docker or docker-compose to run yarr, and you can also use environment variables to configure startup parameters.
+  
+  - `YARR_ADDR` ：address to run server on (default "127.0.0.1:7070")
+  - `YARR_BASE` ：base path of the service url
+  - `YARR_AUTHFILE` ：path to a file containing username:password
+  - `YARR_CERTFILE` ：path to cert file for https
+  - `YARR_KEYFILE` ：path to key file for https
+  - `YARR_DB` ：storage file path
+  - `YARR_LOGFILE` ：path to log file to use instead of stdout
+  
+* Docker run：
+  ```
+  docker run -d \
+  --name yarr \
+  -p 25255:7070 \
+  -e YARR_AUTHFILE="/data/.auth.list" \
+  -v /data/yarr-data:/data \
+  --restart always \
+  arsfeld/yarr:latest
+  ```
+  
+* Docker-Compose Run
 
-See more:
+  Create a file named `.auth.list` under the `/data/` directory, and the content format should be: `username:password`.
+  Then start by running docker-compose up -d and enjoy!
 
-* [Building from source code](doc/build.md)
-* [Fever API support](doc/fever.md)
+  ```yaml
+  version: '3.3'
+  services:
+      yarr:
+          container_name: yarr
+          image: 'arsfeld/yarr:latest'
+          restart: always
+          ports:
+              - '25255:7070'
+          environment:
+            YARR_AUTHFILE: "/data/.auth.list"
+          volumes:
+              - '/data/yarr-data:/data'
+  ```
+  
+* See more:
+
+  * [Building from source code](doc/build.md)
+  * [Fever API support](doc/fever.md)
 
 ## credits
 

src/assets/stylesheets/app.css

@@ -525,6 +525,46 @@ a,
   margin: 0 !important;
 }
 
+/* Beautify the scroll bar. */
+:root {
+  --custom-thumb-color: #6c757d;
+  --custom-track-color: rgba(0, 0, 0, 0);
+  --custom-width: thin;
+  --custom-thumb-color-hover: #ef4c4c;
+  --custom-track-color-hover: rgba(0, 0, 0, 0);
+  --webkit-scrollbar-width-height: 7px;
+  --webkit-scrollbar-border-radius: 6px;
+  --workaround-gh-scrollbars: 0;
+}
+*:not(select) {
+  scrollbar-color: var(--custom-thumb-color) var(--custom-track-color) !important;
+  scrollbar-width: var(--custom-width) !important;
+}
+/* Chrome and derivatives*/
+::-webkit-scrollbar {
+  max-width: var(--webkit-scrollbar-width-height) !important;
+  max-height: var(--webkit-scrollbar-width-height) !important;
+  background: var(--custom-track-color) !important;
+}
+::-webkit-scrollbar-corner,
+::-webkit-scrollbar-track,
+::-webkit-scrollbar-track-piece {
+  background: var(--custom-track-color) !important;
+}
+::-webkit-scrollbar-thumb {
+  background: var(--custom-thumb-color) !important;
+  border-radius: var(--webkit-scrollbar-border-radius) !important;
+}
+::-webkit-scrollbar-corner:hover,
+::-webkit-scrollbar-track:hover,
+::-webkit-scrollbar-track-piece:hover {
+  background: var(--custom-track-color-hover) !important;
+}
+::-webkit-scrollbar-thumb:hover {
+  background: var(--custom-thumb-color-hover) !important;
+}
+
+
 /* responsive layout
 
    tablet:
@@ -607,4 +647,4 @@ a,
   .toolbar-search {
     padding: .5rem;
   }
-}
+}