refactor: map 64x64 scailng, map styling fixes and approach to fix eq…

…uipment popup (I have no idea what's going on there and why it's like that)
pollubnet · Nov 20, 2024 · 0dba394 · 0dba394
1 parent fc37cbb
commit 0dba394
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 29 deletions.
diff --git a/Server/Modules/MapGenerator/Services/MapGeneratorService.cs b/Server/Modules/MapGenerator/Services/MapGeneratorService.cs
@@ -35,8 +35,8 @@ public Task<MapData> GetMap(NoiseParameters noiseParameters)
 
     private MapData GenerateMap(NoiseParameters noiseParameters)
     {
-        int width = 32;
-        int height = 32;
+        int width = 64;
+        int height = 64;
         bool useFalloff = true;
         _seed = noiseParameters.UseRandomSeed ? _rnd.Next(int.MaxValue) : noiseParameters.Seed;
 

diff --git a/Server/wwwroot/css/game.css b/Server/wwwroot/css/game.css
@@ -225,6 +225,9 @@ body {
     width: calc(100% - (var(--popup-padding) * 2));
     height: calc(100% - (var(--popup-padding) * 2));
     backdrop-filter: blur(1px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
 
 .statManager {
@@ -282,20 +285,20 @@ body {
     box-shadow: 0px 0px 10px #000;
 }
 
-    .miniMapTable tr td, .mapTable tr td {
-        border: #000 1px solid;
-        background-color: blue;
-    }
+.miniMapTable tr td, .mapTable tr td {
+    border: #000 1px solid;
+    background-color: blue;
+}
 
-    .miniMapTable tr td {
-        width: 5px;
-        height: 5px;
-    }
+.miniMapTable tr td {
+    width: 2px;
+    height: 2px;
+}
 
-    .mapTable tr td {
-        width: 20px;
-        height: 20px;
-    }
+.mapTable tr td {
+    width: 8px;
+    height: 8px;
+}
 
 .settings {
     height: 10%;
@@ -304,7 +307,17 @@ body {
     flex-direction: row;
     align-items: center;
 }
-
+.map{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+
+}
+.mapTable{
+    margin-top: 5px
+
+}
 
 
 .stats {
@@ -347,19 +360,19 @@ body {
     box-shadow: 0px 0px 10px #000;
 }
 
-    .equipmentTable tr td {
-        border: #000 3px solid;
-        margin-left: 5px;
-        margin-right: 5px;
-        width: 100px;
-        height: 100px;
+.equipmentTable tr td {
+    border: #000 3px solid;
+    margin-left: 5px;
+    margin-right: 5px;
+    width: 100px;
+    height: 100px;
+    background-color: rgba(0,0,25,0.7);
+
+}
+
+    .equipmentTable tr td:hover {
         background-color: rgba(0,0,25,0.7);
-
     }
-
-        .equipmentTable tr td:hover {
-            background-color: rgba(0,0,25,0.7);
-        }
 .row{
     display: flex;
     flex-direction: column;
@@ -375,8 +388,9 @@ body {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
-    margin: 0;
     backdrop-filter: blur(1px);
+    height: 200px;
+    width: 200px;
 }
 .buttonEquip {
     background-color: rgba(138, 136, 136, 0.9);
@@ -391,15 +405,14 @@ body {
     backdrop-filter: blur(1px);
 }
 .eqColumn {
-    width: 50%;
-    height: 100%;
     overflow-y: scroll;
     text-align: justify;
     scrollbar-color: rgb(0, 0, 0) rgba(0,0,0,0);
     scrollbar-width: auto;
     scrollbar-arrow-color: black;
     scroll-snap-type: y mandatory;
     scroll-behavior: smooth;
+
 }
 .eqColumn span {
     font-size: 1.1em;