magicworld

testing/magicworld/web/css/fonts.css

@@ -0,0 +1,9 @@
+@font-face {
+  font-family: 'komtit';
+  src: url(/fonts/KOMTITT_.ttf);
+}
+
+@font-face {
+  font-family: 'oswald';
+  src: url(/fonts/Oswald-Regular.ttf);
+}

testing/magicworld/web/css/game.css

@@ -0,0 +1,91 @@
+body{
+  background-color: black;  
+  overflow: hidden;
+  font-family: 'komtit';
+  -webkit-touch-callout: none;
+    -webkit-user-select: none;
+     -khtml-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none;
+}
+
+#loading{
+  position: absolute;
+  top:0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  background-image: url(/img/logos/sword2.png);
+  background-position-x: 50%;
+  background-position-y: 50%;
+  background-repeat: no-repeat;
+  min-height: 100vh;
+  animation-name: rotate;
+  animation-duration:2s;
+  animation-iteration-count:infinite;
+  animation-timing-function:linear;  
+}
+
+@keyframes rotate {
+  from {-webkit-transform:rotate(0deg);}
+  to {  -webkit-transform:rotate(360deg);}
+}
+
+.guiContanier{
+  position: fixed;
+  z-index: 1;
+  background: gray;
+  padding: 5px;
+  border: 2px solid black;
+  opacity: 0.6;  
+  filter: alpha(opacity=60); /* For IE8 and earlier */
+}
+
+.guiContanier:hover{
+  opacity: 1;
+  filter: alpha(opacity=100); /* For IE8 and earlier */
+}
+
+#chat{
+  width: 20vw;
+  min-width: 257px;
+  bottom: 20px;
+  left: 20px;
+}
+
+#chatOutput{
+  margin-bottom: 5px;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  word-break: break-all;
+  height: 20vh;
+}
+
+
+.output{
+  width: 100%;      
+  font-family: "oswald";
+  font-size: 14px;
+}
+
+#score{
+  width: 15vw;
+  min-width: 144px;
+  top: 20px;
+  right: 20px;
+}
+#scoreOutput{
+  height: auto;
+  white-space: pre;
+}
+
+@media (max-width: 1000px) {
+  .guiContanier {
+    zoom: 0.5;
+  }
+
+  #score{
+    width: 50vw;
+  }
+}

testing/magicworld/web/css/main.css

@@ -0,0 +1,37 @@
+body{
+  background-image: url("/img/home.jpg");
+  background-position: center center; 
+  background-size: cover;
+  background-attachment: fixed;
+  margin-bottom: 0px;
+  
+}
+
+.container{
+  background: rgba(255, 255, 255, 0.8);
+  min-height: calc(100vh - 20px);  
+  padding-top: 10vw;
+  padding-left: 10vw;
+  padding-right: 10vw;
+  padding-bottom: 10vw;
+  -webkit-box-shadow: 0px 0px 12px 8px rgba(0,0,0,0.75);
+  -moz-box-shadow: 0px 0px 12px 8px rgba(0,0,0,0.75);
+  box-shadow: 0px 0px 12px 8px rgba(0,0,0,0.75);
+  /*border-radius: 50% 0 50% 0;*/
+}
+.container h1{
+  margin-bottom: 5vw;
+}
+.container form{
+  margin-bottom: 5vw;
+}
+
+#music{
+  margin-top: -7vw;
+  margin-right: -5vw;
+}
+
+p{
+  font-family: "oswald";
+  text-align:  justify;
+}