Merge pull request #61 from pandaudio/staging

Staging
pandaudio · Jul 24, 2020 · 6c1462a · 6c1462a
2 parents 46f5bd5 + 89992a8
commit 6c1462a
Show file tree

Hide file tree

Showing 8 changed files with 16 additions and 10 deletions.
diff --git a/client/components/Chat/index.css b/client/components/Chat/index.css
@@ -7,8 +7,9 @@
   overflow-y: scroll;
   display: flex;
   flex-direction: column-reverse;
+  color: white;
 }
-img {
+.chat-img {
   height: 30px !important;
   width: 30px !important;
   border-radius: 50%;

diff --git a/client/components/Chat/index.jsx b/client/components/Chat/index.jsx
@@ -22,7 +22,7 @@ const Chat = ({ roomId }) => {
           feed.push(
             <div key={i}>
               <p>
-                <img src={response.data[i].thumbnail} />
+                <img className="chat-img" src={response.data[i].thumbnail} />
                 <span> {response.data[i].username}: </span>
                 {response.data[i].content}
               </p>
@@ -67,7 +67,7 @@ const Chat = ({ roomId }) => {
       [
         <div key={data.created_at}>
           <p>
-            <img src={data.thumbnail} />
+            <img className="chat-img" src={data.thumbnail} />
             <span> {data.username}:</span>
             {data.message}
             <span> {new Date().toLocaleTimeString()} </span>

diff --git a/client/components/RoomOption/index.css b/client/components/RoomOption/index.css
@@ -4,6 +4,6 @@
 s {
   background-color: grey;
 } */
-p {
+.roomName {
   color: white;
 }
diff --git a/client/components/RoomOption/index.jsx b/client/components/RoomOption/index.jsx
@@ -22,7 +22,7 @@ const RoomOption = props => {
 
   return (
     <div className="roomOption">
-      <p>{room.room_name}</p>
+      <p className="roomName">{room.room_name}</p>
       <button type="submit" onClick={handleClick}>
         Join
       </button>

diff --git a/client/components/RoomPage/index.jsx b/client/components/RoomPage/index.jsx
@@ -243,7 +243,7 @@ const RoomPage = props => {
         </div>
         <div className="room-player">
           <div className="player-cover">
-            <img src="" alt="Image goes here" />
+            {albumArt && <img src={albumArt} />}
           </div>
           <div className="player-content">
             <div className="player-playing">

diff --git a/client/components/RoomPage/index.scss b/client/components/RoomPage/index.scss
@@ -32,17 +32,18 @@
       .player-cover {
         width: 250px;
         height: 250px;
-        border: thin solid white;
         border-radius: 0;
+        border: thin solid black;
 
         img {
-          display: block;
+          height: 100%
         }
       }
 
       .player-content {
         @include centerWithFlex($direction: column, $justify: space-evenly, $align: flex-start);
         padding: 0 30px;
+        width: 300px;
 
         .player-playing {}
 
@@ -52,7 +53,10 @@
           flex-direction: column;
           justify-content: space-between;
 
-          h3 { font-size: 145%; }
+          h3 { 
+            font-size: 145%; 
+            color: white;
+          }
         }
 
         .player-btn {

diff --git a/client/components/SongOption/index.css b/client/components/SongOption/index.css
@@ -5,6 +5,7 @@
   justify-content: space-between;
   align-items: center;
   background-color: rgba(255, 255, 255, 0.05);
+  color: white;
 }
 
 .songOption-add {

diff --git a/client/components/SongSearch/index.css b/client/components/SongSearch/index.css
@@ -50,7 +50,7 @@
   min-height: 100%;
   max-height: 100%;
   overflow: scroll;
-  background-color: rgba(255, 255, 255, 0.05);
+  background-color: rgba(255, 255, 255, 0.03);
 }
 
 .songSearch-queue-header {