App.css 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. .App {
  2. text-align: center;
  3. }
  4. .App-logo {
  5. animation: App-logo-spin infinite 20s linear;
  6. height: 80px;
  7. }
  8. .App-header {
  9. background-color: #222;
  10. height: 150px;
  11. padding: 20px;
  12. color: white;
  13. }
  14. .App-title {
  15. font-size: 1.5em;
  16. }
  17. .App-intro {
  18. font-size: large;
  19. }
  20. @keyframes App-logo-spin {
  21. from { transform: rotate(0deg); }
  22. to { transform: rotate(360deg); }
  23. }
  24. .Player {
  25. text-align: left;
  26. padding: 0 20px;
  27. }
  28. .category-list {
  29. float: left;
  30. padding: 0 10px;
  31. }
  32. .category-list select {
  33. min-width: 150px;
  34. }
  35. .AlbumList {
  36. clear: both;
  37. padding-top: 15px;
  38. }
  39. .AlbumList img {
  40. width: 64px;
  41. height: 64px;
  42. }
  43. .AlbumList table td {
  44. width: 200px;
  45. }
  46. .AlbumList table td:nth-child(1) { width: 75px; }
  47. .AlbumList table td:nth-child(2) { width: 64px; }
  48. .AlbumList table td:nth-child(3) { width: 256px; }
  49. .AlbumList table td:nth-child(5) { width: 64px; }
  50. .AlbumList table td:nth-child(7) { width: 64px; }
  51. .AlbumList table td:nth-child(8) { width: 64px; }
  52. .AlbumList table td:nth-child(9) { width: 64px; }
  53. .Controls {
  54. margin: 10px 0;
  55. }
  56. .Controls-progress {
  57. width: 512px;
  58. border: 1px black solid;
  59. height: 16px;
  60. position: relative;
  61. margin-bottom: 8px;
  62. }
  63. .Controls-progress span {
  64. font-size: 14px;
  65. }
  66. .Controls-bar {
  67. background: cadetblue;
  68. height: 16px;
  69. }
  70. .Controls-elapsed {
  71. position: absolute;
  72. left: 2px;
  73. top: 0;
  74. }
  75. .Controls-duration {
  76. position: absolute;
  77. right: 2px;
  78. top: 0;
  79. }
  80. .Controls button {
  81. margin-right: 8px;
  82. }
  83. .Playlist-active {
  84. background: darkseagreen;
  85. }