inhji/chiya
inhji/chiya
1
1
Fork 0
Code Issues 8 Pull requests 9 Activity

add lightbox styles

Browse source
This commit is contained in:
inhji 2023-03-09 09:12:02 +01:00
parent 900219a6e8
commit 0f5e6c54df
1 changed files with 36 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
assets/css/app.css
View file

@ -2,4 +2,39 @@
@import "tailwindcss/components";
@import "tailwindcss/utilities";
/* This file is for your main application CSS */
/* Lightbox Image */
.lightbox {
/* Default to hidden */
display: none;
/* Overlay entire screen */
position: fixed;
z-index: 999;
top: 0;
left: 0;
right: 0;
bottom: 0;
/* A bit of padding around image */
padding: 1em;
/* Translucent background */
background: rgba(0, 0, 0, 0.8);
}
/* Unhide the lightbox when it's the target */
.lightbox:target {
display: block;
}
.lightbox span {
/* Full width and height */
display: block;
width: 100%;
height: 100%;
/* Size and position background image */
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}