Better statuses

src/ui/components/MiniDialog.css

@@ -32,3 +32,7 @@
 .MiniDialogTop:hover {
   cursor: pointer;
 }
+
+.MiniDialog .ProgressText {
+  color: #000;
+}

src/ui/components/common/ProgressBar.css

@@ -24,4 +24,5 @@
 
 .ProgressText {
   color: #c5c5c5;
+  padding: 0px 10px;
 }

src/ui/components/common/ProgressBar.tsx

@@ -1,4 +1,6 @@
 import React from 'react'
+import { capitalize } from '../../../utils/string'
+
 import './ProgressBar.css'
 
 interface IProps {
@@ -61,7 +63,7 @@ export default class ProgressBar extends React.Component<IProps, IState> {
         </div>
 
         <div className="ProgressText">
-          {this.state.status}
+          {capitalize(this.state.status)}
         </div>
       </div>
     )

src/utils/string.ts

@@ -0,0 +1,3 @@
+export function capitalize(str: string) {
+  return str.charAt(0).toUpperCase() + str.slice(1)
+}