chore(release): 0.2.2

[risinglegends.git] / public / assets / css / game.css

diff --git a/public/assets/css/game.css b/public/assets/css/game.css
index a5354ccb3a30e9652b56ce3403b7ef0a821aaaa7..de43ba4bf48c6bb9f9af494ef07f296c487a37fd 100644 (file)
--- a/public/assets/css/game.css
+++ b/public/assets/css/game.css
@@ -1,11 +1,29 @@
 body {
-  margin: 2rem auto;
+  margin: 1rem auto 2rem;
   background-color: #eee;
   width: 100%;
   max-width: 724px;
+  height: 100vh;
+}
+#time-of-day {
+  background-color: transparent;
+  color: invert;
+  border: 0;
+  margin-bottom: 1rem;
+  text-align: right;
+}
+#time-of-day img {
+  width: 32px;
+  vertical-align: middle;
+}
+.night #time-of-day, .evening #time-of-day {
+  color: #fff;
 }
 #view {
   font-size: 14px;
+  background-color: #fff;
+  padding: 1rem;
+  border: 1px solid #000;
 }
 b {
   font-weight: bold;
@@ -13,6 +31,9 @@ b {
 a {
   color: blue;
 }
+select {
+  padding: 0.3rem;
+}
 input {
   border: 1px solid #000;
 }
@@ -50,6 +71,15 @@ section {
   display: flex;
 }
 
+@media(max-width: 650px) {
+  #signup {
+    flex-direction: column;
+  }
+  #signup .form-group, #signup button {
+    margin-bottom: 1rem;
+  }
+}
+
 .alert {
   padding: 0.3rem;
   margin-bottom: 0.3rem;
@@ -70,15 +100,19 @@ section {
 }
 
 .avatar-container {
-  width: 64px;
-  height: 64px;
+  max-width: 128px;
 }
 #avatar {
   width: 100%;
 }
-#stat-summary {
+header {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
+  border: 0;
+  margin-bottom: 1rem;
+}
+#player-info {
+  width: 100%;
 }
 #player-section {
   display: flex;
@@ -130,8 +164,6 @@ nav {
   text-align: center;
   padding: 1rem 0;
   background-color: #fff;
-  border: solid 1px #000;
-  margin: 1rem 0;
 }
 nav li {
   display: inline-block;
@@ -196,8 +228,8 @@ nav a.active {
   margin-bottom: 1rem;
 }
 #main-nav section {
-  padding: 1rem;
   min-height: 344px;
+  border: 0;
 }
 
 #stat-breakdown th {
@@ -227,12 +259,15 @@ nav a.active {
 #defender-name {
   text-align: left;
 }
+#fight-results {
+  margin-top: 1rem;
+}
 
 
 #map {
   width: 75%;
-  margin: 2rem auto 1rem;
-  padding: 1rem 2rem 2rem;
+  margin: 0rem auto 1rem;
+  padding: 3rem 2rem 2rem;
   line-height: 1.3rem;
   background: linear-gradient(to bottom, rgba(255,255,255, 0) 0%, rgba(255, 255, 255, 0.5) 30%);
 }
@@ -257,6 +292,13 @@ h3 {
   font-size: 1rem;
 }
 
+#travelling-actions {
+  display: flex;
+  justify-content: center;
+  gap: 1rem;
+  margin-bottom: 1rem;
+}
+
 
 .store-list {
   display: flex;
@@ -334,10 +376,14 @@ h3 {
     flex-direction: column;
   }
   #character-summary {
+    width: 100%;
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
   }
+  #extra-inventory-info {
+    margin-top: 0rem;
+  }
   #inventory-section {
     margin-left: 0;
     margin-top: 2rem;
@@ -399,9 +445,19 @@ h3 {
   font-weight: bold;
 }
 
-#server-stats {
+#game-footer {
+  display: flex;
+  justify-content: space-between;
   margin-top: 1rem;
-  text-align: right;
+  border: 0;
+}
+#game-footer nav {
+  margin: 0;
+  padding: 0;
+}
+#game-footer img {
+  width: 1rem;
+  height: 1rem;
 }
 
 footer {