/!\
{{ warningText }}
+
+
+ /!\
{{ warningText }}
@@ -251,9 +254,14 @@ function check_for_guard(player: Player) {
color: white;
padding: 5px;
border-radius: 5px;
- width: 90px;
+ width: 100px;
font-size: 0.85em;
margin-left: 5px;
+ visibility: hidden
+}
+
+.warning.visible {
+ visibility: visible
}
.warning-fire-gem {
@@ -276,10 +284,11 @@ function check_for_guard(player: Player) {
.stack {
grid-area: stack;
+ margin-left: 75px;
}
.discard {
- margin-top: 50px;
+ margin-top: 40px;
grid-area: discard;
justify-content: start;
cursor: pointer;
@@ -287,18 +296,23 @@ function check_for_guard(player: Player) {
}
.discard.unwrapped {
- z-index: 9;
+ margin-top: 0px;
+
cursor: default;
position: absolute;
padding-bottom: 100px;
+ height: 100%;
}
.discard_container {
+ z-index: 9;
display: flex;
/* background: blue; */
pointer-events: none;
- flex-wrap: wrap;
gap: 2px;
+ padding-left: 40px;
+ flex-wrap: wrap-reverse;
+ align-content: flex-end;
}
#discard_unwrapped_bg {
@@ -309,7 +323,8 @@ function check_for_guard(player: Player) {
height: 100%;
width: 100%;
z-index: 8;
- background: rgba(0, 0, 0, 0.5)
+ background: rgba(0, 0, 0, 0.5);
+ pointer-events: all;
}
#discard_unwrapped_bg.unwrapped {
@@ -331,8 +346,9 @@ function check_for_guard(player: Player) {
.player.discard_unwrapped {
grid-template-areas:
"player_stats player_stats"
- "stack player"
- "discard discard";
+ "stack player";
+ position: relative;
+ isolation: isolate;
}
#current_player_board {
@@ -427,23 +443,38 @@ function check_for_guard(player: Player) {
position: relative;
}
+
#player_banner {
display: flex;
grid-area: player_stats;
- flex-direction: column;
+ flex-direction: row;
align-items: center;
justify-content: center;
position: sticky;
top: 0;
padding-top: 1em;
z-index: 1;
+ pointer-events: none;
}
+#player_banner.small {
+ flex-direction: column
+}
+
+#player_banner>* {
+ pointer-events: all;
+}
+
+
#player_info {
display: flex;
align-items: center;
}
+#player_banner.big>#player_info {
+ margin-left: 500px;
+}
+
#player_stats {
display: flex;
grid-area: player_stats;
@@ -474,7 +505,7 @@ function check_for_guard(player: Player) {
color: white;
border: none;
border-radius: 8px;
- padding: 5px 10px;
+ padding: 13px 10px;
margin: 0 0 0 5px;
font-size: 16px;
font-weight: bold;