Move styles for views

src/views/HomeView.jsx

@@ -13,7 +13,7 @@ import TargetURLSelector from
 import ThemeSelector from
   '~/src/components/ThemeSelector/ThemeSelector'
 
-import '~/src/style/views/HomeView.css'
+import './style/HomeView.css'
 
 export default function ({ themeEngine }) {
   const setLocation = useHashLocation()[1]

src/views/PlayerView.jsx

@@ -3,7 +3,7 @@ import { useState, useEffect } from 'preact/hooks'
 
 import UrlPlayer from '~/src/components/Player/UrlPlayer'
 
-import '~/src/style/views/PlayerView.css'
+import './style/PlayerView.css'
 
 const decode = encodedUrl => decodeURIComponent(encodedUrl)
 

src/views/style/HomeView.css

@@ -0,0 +1,38 @@
+.app > .view.home {
+  padding: var(--inner-padding);
+}
+
+.view.home input,
+.view.home select {
+  box-sizing: border-box;
+
+  padding: 4px 8px;
+  color: var(--main-color);
+  background-color: var(--bg-color);
+  border: 2px solid var(--main-color);
+  outline-offset: 0;
+  font: inherit;
+}
+
+.view.home select {
+  cursor: pointer;
+  appearance: none;
+  width: 200px;
+}
+
+.view.home label {
+  display: inline-block;
+  width: 100%;
+  max-width: 400px;
+}
+
+.view.home label input {
+  width: 100%;
+}
+
+.view.home input[type='file'] {
+  position: relative;
+  font-size: 0;
+  text-indent: -100%;
+  cursor: pointer;
+}

src/views/style/PlayerView.css

@@ -0,0 +1,10 @@
+.app.play {
+  height: 100%;
+}
+
+@media (min-width: 800px) {
+  .app.play main {
+    max-height: 90%;
+    margin: auto;
+  }
+}