load save box

.gitignore

@@ -4,4 +4,4 @@ storage.db
 *.sublime-workspace
 *.css
 !helpers/item-tooltip/styles.css
-!helpers/passives/*.css
+!helpers/passives/**/*.css

helpers/passives/client/styles.css

@@ -0,0 +1,26 @@
+	
+html, body {
+	width: 100vw;
+	height: 100vh;
+}
+
+body {
+	background-color: #2d2136;
+	padding: 0px;
+	margin: 0px;
+	overflow: hidden;
+}
+
+.canvas, .ui-container {
+	position: absolute;
+}
+
+.ui-container {
+	width: 100%;
+	height: 100%;
+	pointer-events: none;
+}
+
+.ui-container > * {
+	pointer-events: auto;
+}

helpers/passives/client/ui/templates/loadSave/styles.css

@@ -0,0 +1,38 @@
+.uiLoadSave {
+	position: absolute;
+	right: 10px;
+	top: 10px;
+	padding: 10px;
+
+	width: 200px;
+	background-color: #373041;
+	text-align: center;
+}
+
+.uiLoadSave .heading {
+	color: #fafcfc;
+	margin-bottom: 15px;
+}
+
+.uiLoadSave input {
+	border: none;
+	outline: none;
+	width: calc(100% - 10px);
+	height: 20px;
+	padding: 5px;
+	display: box;
+}
+
+.uiLoadSave .btn {
+	float: left;
+	width: calc((100% - 15px) / 2);
+	color: #fafcfc;
+	margin-top: 15px;
+	background-color: #3fa7dd;
+	padding: 10px;
+	box-sizing: border-box;
+}
+
+.uiLoadSave .btn:nth-child(2) {
+	margin-right: 15px;
+}