Basic spotify and plant

src/styles/containers/PlantState.module.css

@@ -0,0 +1,44 @@
+.container {
+    display: grid;
+    grid-template-columns: auto auto;
+    height: 100%;
+}
+
+.plant {
+    display: grid;
+    grid-template-areas: 
+        "plantName plantName"
+        "moisture conductivity";
+    text-align: center;
+    border-right: 1px solid var(--iconColor);
+}
+
+.plant:last-of-type {
+    border-right: none;
+}
+
+.plant div:nth-child(1) {
+    grid-area: plantName;
+    font-weight: bold;
+    font-size: 200%;
+}
+
+.plant div:nth-child(2) {
+    grid-area: moisture;
+    font-weight: bold;
+    font-size: 190%;
+}
+
+.plant div:nth-child(3) {
+    grid-area: conductivity;
+    font-weight: bold;
+    font-size: 190%;
+}
+
+.icon {
+    font-size: 250%;
+}
+
+.problem {
+    color: #ff0000;
+}

src/styles/containers/Spotify.module.css

@@ -0,0 +1,21 @@
+.container {
+    grid-area: spotify;  
+    display: grid;
+    grid-template-columns: auto max-content;
+    justify-content: start;
+    width:100%;
+    height:100%;
+    padding:5px;
+    background: var(--spotifyColor);
+    border-radius: 5px;
+}
+.container p {
+    max-width: 21vw;
+    color: inherit;
+    word-wrap: normal;
+}
+.title {
+    font-size: 180%;
+    font-weight: bold;
+    color: inherit;
+}