8b32abbefc
* fix(SW-1563): Added new IconButton component to the design system and removed Icon variant inside the Button component * fix(SW-1563): Added buttons around clickable images and changed to design system components * fix(SW-1563): Renamed variants to match Figma * fix(SW-1563): Renamed AriaButton to ButtonRAC Approved-by: Michael Zetterberg Approved-by: Matilda Landström
58 lines
944 B
CSS
58 lines
944 B
CSS
.overlay {
|
|
position: fixed;
|
|
inset: 0;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
z-index: var(--lightbox-z-index);
|
|
|
|
&[data-entering] {
|
|
animation: darken-background 0.2s;
|
|
}
|
|
|
|
&[data-exiting] {
|
|
animation: darken-background 0.2s reverse;
|
|
}
|
|
}
|
|
|
|
.content {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 0;
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
z-index: var(--lightbox-z-index);
|
|
}
|
|
|
|
@media screen and (min-width: 768px) {
|
|
.content {
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
overflow: hidden;
|
|
|
|
&:not(.fullViewContent) {
|
|
border-radius: var(--Corner-radius-Large);
|
|
}
|
|
|
|
&.fullViewContent {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
}
|
|
|
|
&.galleryContent {
|
|
width: min(var(--max-width-page), 1090px);
|
|
height: min(725px, 85dvh);
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes darken-background {
|
|
from {
|
|
background-color: rgba(0, 0, 0, 0);
|
|
}
|
|
|
|
to {
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
}
|
|
}
|