49 lines
1.1 KiB
CSS
49 lines
1.1 KiB
CSS
.BoardPieces {
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: absolute;
|
|
align-items: flex-end;
|
|
height: 6rem;
|
|
right: 30rem;
|
|
bottom: 11rem; /* 1rem over top of Resource cards in hand */
|
|
z-index: 1000;
|
|
padding-bottom: 0.5rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.BoardPieces > div {
|
|
display: flex;
|
|
justify-items: flex-start;
|
|
}
|
|
|
|
.BoardPieces[data-active="true"] > div > div {
|
|
filter: drop-shadow(0px 0px 5px black);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.BoardPieces[data-active="true"] > div > div:hover {
|
|
filter: drop-shadow(0px 0px 5px white);
|
|
}
|
|
|
|
.BoardPieces .Shape {
|
|
margin: 0.25rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.BoardPieces .Road .Shape {
|
|
width: 0.5rem;
|
|
height: 1.5rem;
|
|
}
|
|
|
|
.BoardPieces .Settlement .Shape {
|
|
width: 1.25rem;
|
|
height: 1.25rem;
|
|
clip-path: polygon(50% 0%,70% 15%,70% 2%,90% 2%,90% 30%,100% 40%,100% 100%,65% 100%,65% 65%,35% 65%,35% 100%,0% 100%,0% 40%);
|
|
}
|
|
|
|
.BoardPieces .City .Shape {
|
|
width: 1.25rem;
|
|
height: 1.25rem;
|
|
clip-path: polygon(15% 0%,39% 23%,39% 52%,100% 56%,100% 74%,100% 100%,80% 100%,63% 100%,62% 75%,46% 75%,47% 100%,0% 100%,0% 24%);
|
|
}
|