feat: Red station theme

backend/logic/db/schemas/station.js

@@ -42,7 +42,7 @@ export default {
 	owner: { type: String },
 	partyMode: { type: Boolean },
 	playMode: { type: String, enum: ["random", "sequential"], default: "random" },
-	theme: { type: String, enum: ["blue", "purple", "teal", "orange"], default: "blue" },
+	theme: { type: String, enum: ["blue", "purple", "teal", "orange", "red"], default: "blue" },
 	includedPlaylists: [{ type: String }],
 	excludedPlaylists: [{ type: String }],
 	documentVersion: { type: Number, default: 6, required: true }

frontend/src/components/modals/ManageStation/Tabs/Settings.vue

@@ -90,6 +90,14 @@
 								<i class="material-icons">palette</i>
 								Orange
 							</button>
+							<button
+								class="red"
+								v-if="station.theme !== 'red'"
+								@click="updateTheme('red')"
+							>
+								<i class="material-icons">palette</i>
+								Red
+							</button>
 						</template>
 					</tippy>
 				</div>
@@ -607,6 +615,10 @@ export default {
 				background-color: var(--teal);
 			}
 
+			&.red {
+				background-color: var(--red);
+			}
+
 			i {
 				font-size: 20px;
 				margin-right: 4px;