80 lines
1.8 KiB
SCSS
80 lines
1.8 KiB
SCSS
.page-container--play {
|
|
// @apply pt-32;
|
|
$margin: 20px;
|
|
.screen {
|
|
@apply overflow-hidden;
|
|
}
|
|
.screen--game {
|
|
@apply py-0 flex;
|
|
|
|
width: 100%;
|
|
margin: 0;
|
|
height: 100dvh;
|
|
|
|
@screen md {
|
|
width: calc(100% - $margin * 2);
|
|
height: calc(99.8dvh - $margin * 2);
|
|
margin: $margin auto 0 auto;
|
|
}
|
|
}
|
|
.app-logo-vector {
|
|
@apply fixed left-0;
|
|
}
|
|
.lhoist-blocks-search-and-find {
|
|
-ms-overflow-style: none; /* IE and Edge */
|
|
scrollbar-width: none; /* Firefox */
|
|
&::-webkit-scrollbar {
|
|
display: none; /* Chrome, Safari, Opera*/
|
|
}
|
|
cursor: url("../../img/cursors/lhoist-curseur-pointeur.svg") 64 64, auto;
|
|
:active {
|
|
cursor: url("../../img/cursors/lhoist-curseur-drag.svg") 64 64, auto;
|
|
}
|
|
@apply w-screen overflow-x-scroll left-0 top-0 absolute h-full;
|
|
|
|
&__background_picture {
|
|
@apply top-0 h-full w-auto block;
|
|
|
|
height: 100%;
|
|
max-width: revert;
|
|
-moz-user-select: none;
|
|
-webkit-user-select: none;
|
|
user-select: none;
|
|
pointer-events: none;
|
|
}
|
|
|
|
&__objects-container {
|
|
@apply w-fit h-full relative;
|
|
|
|
.lhoist-blocks-focus-object {
|
|
cursor: url("../../img/cursors/lhoist-curseur-loupe-objet.svg") 64 64, auto;
|
|
|
|
@apply absolute w-auto block object-contain;
|
|
img {
|
|
@apply h-full;
|
|
}
|
|
|
|
&--inactive img {
|
|
filter: contrast(50%) saturate(0%) brightness(1.3);
|
|
pointer-events: none;
|
|
}
|
|
|
|
&--unsafe::after,
|
|
&--safe::after {
|
|
@apply block absolute top-1/2 left-1/2 w-16 h-16 2xl:h-24 2xl:w-24 bg-no-repeat bg-center bg-contain;
|
|
|
|
content: "";
|
|
z-index: 11;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
&--unsafe::after {
|
|
background-image: url("../../img/icons/anwser_icon_unsafe.svg");
|
|
}
|
|
&--safe::after {
|
|
background-image: url("../../img/icons/anwser_icon_safe.svg");
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|