summaryrefslogtreecommitdiffstats
path: root/assets/css/components/lightbox.css
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/components/lightbox.css')
-rw-r--r--assets/css/components/lightbox.css170
1 files changed, 0 insertions, 170 deletions
diff --git a/assets/css/components/lightbox.css b/assets/css/components/lightbox.css
deleted file mode 100644
index ad34e84..0000000
--- a/assets/css/components/lightbox.css
+++ /dev/null
@@ -1,170 +0,0 @@
-/* lightbox.css */
-
-.photo-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
- gap: 1.5rem;
- margin: 2rem 0;
-}
-
-.photo-card {
- position: relative;
- cursor: pointer;
- overflow: hidden;
- border-radius: 4px;
- border: 1px solid var(--border);
- transition: all var(--duration-base) ease;
-}
-
-.photo-card:hover {
- border-color: var(--accent);
- box-shadow: 0 0 20px rgba(168, 85, 247, 0.2);
- transform: translateY(-4px);
-}
-
-.photo-card img {
- width: 100%;
- height: 200px;
- object-fit: cover;
- display: block;
- transition: transform var(--duration-base) ease;
-}
-
-.photo-card:hover img {
- transform: scale(1.05);
-}
-
-.photo-card figcaption {
- padding: 1rem;
- background: var(--surface);
- font-size: 0.9rem;
- color: var(--text-dim);
-}
-
-/* Lightbox Modal */
-.photo-lightbox {
- position: fixed;
- inset: 0;
- z-index: 200;
- display: none;
- background: rgba(6, 11, 16, 0.95);
- backdrop-filter: blur(4px);
-}
-
-.photo-lightbox.active {
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-.photo-lightbox-backdrop {
- position: absolute;
- inset: 0;
- cursor: pointer;
-}
-
-.photo-lightbox-content {
- position: relative;
- z-index: 201;
- max-width: 90vw;
- max-height: 90vh;
- display: flex;
- flex-direction: column;
- gap: 1rem;
-}
-
-.photo-lightbox-image {
- max-width: 100%;
- max-height: 70vh;
- object-fit: contain;
-}
-
-.photo-lightbox-controls {
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 1rem;
- background: var(--surface);
- border-radius: 4px;
-}
-
-.photo-lightbox-nav {
- display: flex;
- gap: 1rem;
-}
-
-.photo-lightbox-nav button {
- padding: 0.5rem 1rem;
- background: var(--accent);
- color: #000;
- border: none;
- border-radius: 4px;
- cursor: pointer;
- font-weight: 600;
- transition: all var(--duration-base) ease;
-}
-
-.photo-lightbox-nav button:disabled {
- opacity: 0.5;
- cursor: not-allowed;
-}
-
-.photo-lightbox-nav button:not(:disabled):hover {
- box-shadow: 0 0 20px rgba(168, 85, 247, 0.4);
- transform: translateY(-2px);
-}
-
-.photo-lightbox-close {
- position: absolute;
- top: 1rem;
- right: 1rem;
- background: var(--surface);
- border: 1px solid var(--border);
- width: 44px;
- height: 44px;
- border-radius: 50%;
- cursor: pointer;
- display: flex;
- align-items: center;
- justify-content: center;
- font-size: 1.5rem;
- color: var(--text);
- transition: all var(--duration-base) ease;
- z-index: 202;
-}
-
-.photo-lightbox-close:hover {
- background: var(--accent);
- color: #000;
- border-color: var(--accent);
-}
-
-.photo-metadata {
- padding: 1rem;
- background: var(--surface);
- border-radius: 4px;
- font-size: 0.9rem;
- color: var(--text-dim);
-}
-
-.photo-metadata dt {
- font-weight: 600;
- color: var(--text);
- margin-top: 0.5rem;
-}
-
-.photo-metadata dt:first-child {
- margin-top: 0;
-}
-
-.photo-metadata dd {
- margin-left: 1rem;
- font-family: var(--font-mono);
-}
-
-@media (prefers-reduced-motion: reduce) {
- .photo-card:hover img,
- .photo-lightbox-nav button:hover {
- transform: none;
- }
-}