Files
KnockOutWhist-Web/knockoutwhistweb/public/stylesheets/main.css
LQ63 365f9757a2 feat(ui): LESS Integration
Tried to add less integration but came to the problem that node.js is needed for it to work
2025-10-27 22:01:55 +01:00

104 lines
1.6 KiB
CSS

@color: white;
body {
background-image: @background-image;
}
html, body {
height: 100vh;
margin: 0;
}
#sessions {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
text-align: center;
}
#sessions a, h1, p {
color: @color;
font-size: 40px;
font-family: Arial;
}
#ingame {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
height: 100%;
}
#playercards {
display: flex;
flex-direction: row;
justify-content: center;
height: 20%
}
#cardsplayed {
display: flex;
flex-direction: row;
height: 10%;
min-height: 10%
}
#playedcardplayer {
display: flex;
flex-direction: column;
justify-content: flex-end;
}
#playedcardplayer p {
font-size: 12px;
height: 4%;
}
#playedcardplayer img {
height: 90%;
}
#firstCard {
display: flex;
flex-direction: row;
height: 20%;
width: 100%;
justify-content: space-between;
}
#firstCardObject {
display: flex;
flex-direction: column;
margin-right: 4%;
}
#firstCardObject img{
height: 90%;
}
#firstCardObject p{
height: 10%;
font-size: 20px;
}
#trumpsuit {
display: flex;
flex-direction: row;
margin-left: 4%;
}
#nextPlayers {
display: flex;
flex-direction: column;
align-items: center;
height: 0%;
p {
margin-top: 0px;
margin-bottom: 0px;
}
}
#invisible {
visibility: hidden;
}
#selecttrumpsuit {
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
}
#rules {
color: white;
font-size: 1.5em;
font-family: Arial;
}