part of the private lobby

.gitignore

@@ -136,3 +136,5 @@ dmypy.json
 
 # Cython debug symbols
 cython_debug/
+
+frontend/package-lock.json

frontend/package.json

@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "core-js": "^3.6.5",
+    "pretty-checkbox": "^3.0.3",
     "socket.io-client": "^3.0.3",
     "vue": "^2.6.11",
     "vue-socket.io": "^3.0.10"

frontend/src/App.vue

@@ -134,6 +134,7 @@ export default {
 </script>
 
 <style>
+@import '../node_modules/pretty-checkbox/dist/pretty-checkbox.css';
 #app {
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;

frontend/src/components/Lobby.vue

@@ -3,6 +3,14 @@
 		<div style="flex-grow: 4;">
 			<h2 v-if="!started">Lobby: {{ lobbyName }}</h2>
 			<h3>Giocatori (tu sei {{username}})</h3>
+			<div v-if="startGameCard">
+				<div class="pretty p-switch p-fill">
+					<input type="checkbox" />
+					<div class="state">
+							<label>Stanza Privata</label>
+					</div>
+				</div>
+			</div>
 			<div class="players-table">
 				<Card v-if="startGameCard" :card="startGameCard" @click.native="startGame"/>
 				<!-- <div style="position: relative;width:260pt;height:400pt;"> -->