Fix rate UX for new design

renderer/index.css

@@ -739,7 +739,8 @@ body.drag .app::after {
   vertical-align: sub;
 }
 
-.player .controls .time {
+.player .controls .time,
+.player .controls .rate {
   font-weight: 100;
   font-size: 13px;
   margin: 9px 8px 8px 8px;
@@ -819,13 +820,6 @@ body.drag .app::after {
   color: #9af;
 }
 
-.player-controls .rate {
-  display: inline;
-  height: 30px;
-  padding: 5px;
-  margin-left: 20px;
-}
-
 .player .controls .volume-slider::-webkit-slider-thumb {
   -webkit-appearance: none;
   -webkit-app-region: no-drag;

renderer/views/player.js

@@ -452,7 +452,7 @@ function renderPlayerControls (state) {
   if (state.playing.playbackRate !== 1) {
     elements.push(hx`
       <span class='rate float-left'>
-        speed: ${state.playing.playbackRate}X
+        ${state.playing.playbackRate}x
       </span>
     `)
   }