web-mojo 2.1.156 → 2.1.169

package/dist/lightbox.css

@@ -8,40 +8,40 @@
    ========================================================================== */
 
 .lightbox-component {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  background: #000;
-  overflow: hidden;
-  font-family: var(--bs-font-sans-serif, system-ui, sans-serif);
+    position: relative;
+    width: 100%;
+    height: 100%;
+    background: #000;
+    overflow: hidden;
+    font-family: var(--bs-font-sans-serif, system-ui, sans-serif);
 }
 
 .lightbox-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0,0,0,0.8);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.8);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1;
 }
 
 .lightbox-loading {
-  text-align: center;
-  color: #fff;
+    text-align: center;
+    color: #fff;
 }
 
 .lightbox-loading .spinner-border {
-  width: 2rem;
-  height: 2rem;
-  margin-bottom: 1rem;
+    width: 2rem;
+    height: 2rem;
+    margin-bottom: 1rem;
 }
 
 .lightbox-component.loaded .lightbox-overlay {
-  display: none;
+    display: none;
 }
 
 /* ==========================================================================
@@ -49,96 +49,96 @@
    ========================================================================== */
 
 .image-viewer {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  background: #000;
-  overflow: hidden;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    background: #000;
+    overflow: hidden;
 }
 
 .image-viewer-container {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  min-height: 400px;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    min-height: 400px;
 }
 
 .image-viewer-content {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  cursor: grab;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    cursor: grab;
 }
 
 .image-viewer-content:active {
-  cursor: grabbing;
+    cursor: grabbing;
 }
 
 .image-viewer-content.dragging {
-  cursor: grabbing;
+    cursor: grabbing;
 }
 
 .image-viewer-image {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform-origin: center center;
-  transition: transform 0.2s ease-out;
-  max-width: none;
-  max-height: none;
-  user-select: none;
-  -webkit-user-drag: none;
-  pointer-events: none;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform-origin: center center;
+    transition: transform 0.2s ease-out;
+    max-width: none;
+    max-height: none;
+    user-select: none;
+    -webkit-user-drag: none;
+    pointer-events: none;
 }
 
 .image-viewer-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0,0,0,0.8);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.8);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1;
 }
 
 .image-viewer.loaded .image-viewer-overlay {
-  display: none;
+    display: none;
 }
 
 .image-viewer-controls {
-  position: absolute;
-  bottom: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-  z-index: 10;
-  display: flex;
-  gap: 10px;
-  align-items: center;
-  background: rgba(0,0,0,0.8);
-  padding: 8px 12px;
-  border-radius: 6px;
-  backdrop-filter: blur(4px);
+    position: absolute;
+    bottom: 20px;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 10;
+    display: flex;
+    gap: 10px;
+    align-items: center;
+    background: rgba(0, 0, 0, 0.8);
+    padding: 8px 12px;
+    border-radius: 6px;
+    backdrop-filter: blur(4px);
 }
 
 .image-viewer-info {
-  color: white;
-  font-size: 12px;
-  white-space: nowrap;
-  margin-left: 10px;
+    color: white;
+    font-size: 12px;
+    white-space: nowrap;
+    margin-left: 10px;
 }
 
 .image-viewer-controls .btn {
-  --bs-btn-border-color: rgba(255,255,255,0.2);
-  border-color: rgba(255,255,255,0.2);
+    --bs-btn-border-color: rgba(255, 255, 255, 0.2);
+    border-color: rgba(255, 255, 255, 0.2);
 }
 
 .image-viewer-controls .btn:hover {
-  --bs-btn-border-color: rgba(255,255,255,0.4);
-  border-color: rgba(255,255,255,0.4);
+    --bs-btn-border-color: rgba(255, 255, 255, 0.4);
+    border-color: rgba(255, 255, 255, 0.4);
 }
 
 /* ==========================================================================
@@ -146,149 +146,185 @@
    ========================================================================== */
 
 .image-editor {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  background: #f8f9fa;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    background: #f8f9fa;
 }
 
 .image-editor-toolbar {
-  padding: 8px 12px;
-  background: white;
-  border-bottom: 1px solid #dee2e6;
-  flex-shrink: 0;
+    padding: 8px 12px;
+    background: white;
+    border-bottom: 1px solid #dee2e6;
+    flex-shrink: 0;
 }
 
 .image-editor-filters {
-  background: white;
-  border-bottom: 1px solid #dee2e6;
-  flex-shrink: 0;
+    background: white;
+    border-bottom: 1px solid #dee2e6;
+    flex-shrink: 0;
 }
 
 .image-editor-filters .card {
-  border: none;
-  border-radius: 0;
+    border: none;
+    border-radius: 0;
 }
 
 .image-editor-workspace {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
 }
 
 .image-editor-content {
-  flex: 1;
-  position: relative;
-  background: #000;
-  overflow: hidden;
-  cursor: grab;
+    flex: 1;
+    position: relative;
+    background: #000;
+    overflow: hidden;
+    cursor: grab;
 }
 
 .image-editor-content:active {
-  cursor: grabbing;
+    cursor: grabbing;
 }
 
 .image-editor-content.crop-mode {
-  cursor: crosshair;
+    cursor: crosshair;
 }
 
 .image-editor-image,
 .image-editor-canvas {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform-origin: center center;
-  transition: transform 0.2s ease-out;
-  max-width: none;
-  max-height: none;
-  user-select: none;
-  -webkit-user-drag: none;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform-origin: center center;
+    transition: transform 0.2s ease-out;
+    max-width: none;
+    max-height: none;
+    user-select: none;
+    -webkit-user-drag: none;
 }
 
 .image-editor-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0,0,0,0.8);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.8);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1;
 }
 
 .image-editor.loaded .image-editor-overlay {
-  display: none;
+    display: none;
 }
 
 .image-editor-status {
-  padding: 4px 12px;
-  background: white;
-  border-top: 1px solid #dee2e6;
-  flex-shrink: 0;
+    padding: 4px 12px;
+    background: white;
+    border-top: 1px solid #dee2e6;
+    flex-shrink: 0;
 }
 
 /* Crop Overlay Styles */
 .crop-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 10;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 10;
 }
 
 .crop-box {
-  position: absolute;
-  border: 2px solid #007bff;
-  background: rgba(0, 123, 255, 0.1);
-  cursor: move;
+    position: absolute;
+    border: 2px solid #007bff;
+    background: rgba(0, 123, 255, 0.1);
+    cursor: move;
 }
 
 .crop-box::before {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  border: 1px dashed rgba(255,255,255,0.5);
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    border: 1px dashed rgba(255, 255, 255, 0.5);
 }
 
 .crop-handle {
-  position: absolute;
-  width: 8px;
-  height: 8px;
-  background: #007bff;
-  border: 1px solid white;
-  border-radius: 1px;
-}
-
-.crop-handle-nw { top: -4px; left: -4px; cursor: nw-resize; }
-.crop-handle-ne { top: -4px; right: -4px; cursor: ne-resize; }
-.crop-handle-sw { bottom: -4px; left: -4px; cursor: sw-resize; }
-.crop-handle-se { bottom: -4px; right: -4px; cursor: se-resize; }
-.crop-handle-n { top: -4px; left: 50%; transform: translateX(-50%); cursor: n-resize; }
-.crop-handle-s { bottom: -4px; left: 50%; transform: translateX(-50%); cursor: s-resize; }
-.crop-handle-w { left: -4px; top: 50%; transform: translateY(-50%); cursor: w-resize; }
-.crop-handle-e { right: -4px; top: 50%; transform: translateY(-50%); cursor: e-resize; }
+    position: absolute;
+    width: 8px;
+    height: 8px;
+    background: #007bff;
+    border: 1px solid white;
+    border-radius: 1px;
+}
+
+.crop-handle-nw {
+    top: -4px;
+    left: -4px;
+    cursor: nw-resize;
+}
+.crop-handle-ne {
+    top: -4px;
+    right: -4px;
+    cursor: ne-resize;
+}
+.crop-handle-sw {
+    bottom: -4px;
+    left: -4px;
+    cursor: sw-resize;
+}
+.crop-handle-se {
+    bottom: -4px;
+    right: -4px;
+    cursor: se-resize;
+}
+.crop-handle-n {
+    top: -4px;
+    left: 50%;
+    transform: translateX(-50%);
+    cursor: n-resize;
+}
+.crop-handle-s {
+    bottom: -4px;
+    left: 50%;
+    transform: translateX(-50%);
+    cursor: s-resize;
+}
+.crop-handle-w {
+    left: -4px;
+    top: 50%;
+    transform: translateY(-50%);
+    cursor: w-resize;
+}
+.crop-handle-e {
+    right: -4px;
+    top: 50%;
+    transform: translateY(-50%);
+    cursor: e-resize;
+}
 
 /* Filter Controls */
 .form-range::-webkit-slider-thumb {
-  background: #007bff;
+    background: #007bff;
 }
 
 .form-range::-moz-range-thumb {
-  background: #007bff;
+    background: #007bff;
 }
 
 /* Toolbar States */
 .btn.active {
-  background-color: #007bff;
-  border-color: #007bff;
-  color: white;
+    background-color: #007bff;
+    border-color: #007bff;
+    color: white;
 }
 
 /* ==========================================================================
@@ -296,95 +332,95 @@
    ========================================================================== */
 
 .pdf-viewer {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  background: #f8f9fa;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    background: #f8f9fa;
 }
 
 .pdf-viewer-toolbar {
-  padding: 8px 12px;
-  background: white;
-  border-bottom: 1px solid #dee2e6;
-  flex-shrink: 0;
+    padding: 8px 12px;
+    background: white;
+    border-bottom: 1px solid #dee2e6;
+    flex-shrink: 0;
 }
 
 .pdf-viewer-toolbar .page-input {
-  width: 60px;
+    width: 60px;
 }
 
 .pdf-viewer-toolbar .page-total {
-  background: transparent;
-  border-left: none;
-  font-size: 0.8em;
+    background: transparent;
+    border-left: none;
+    font-size: 0.8em;
 }
 
 .pdf-viewer-content {
-  flex: 1;
-  position: relative;
-  background: #525659;
-  overflow: auto;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+    flex: 1;
+    position: relative;
+    background: #525659;
+    overflow: auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
 
 .pdf-canvas-container {
-  position: relative;
-  background: white;
-  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
-  margin: 20px;
+    position: relative;
+    background: white;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+    margin: 20px;
 }
 
 .pdf-canvas {
-  display: block;
-  max-width: 100%;
-  max-height: 100%;
+    display: block;
+    max-width: 100%;
+    max-height: 100%;
 }
 
 .pdf-viewer-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0,0,0,0.1);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  z-index: 1;
-  color: #6c757d;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.1);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    z-index: 1;
+    color: #6c757d;
 }
 
 .pdf-viewer.loaded .pdf-viewer-overlay {
-  display: none;
+    display: none;
 }
 
 .pdf-viewer-error {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  z-index: 2;
-  min-width: 300px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 2;
+    min-width: 300px;
 }
 
 .pdf-viewer-status {
-  padding: 4px 12px;
-  background: white;
-  border-top: 1px solid #dee2e6;
-  flex-shrink: 0;
+    padding: 4px 12px;
+    background: white;
+    border-top: 1px solid #dee2e6;
+    flex-shrink: 0;
 }
 
 /* PDF Loading animation */
 .pdf-viewer-loading {
-  text-align: center;
+    text-align: center;
 }
 
 .pdf-viewer-loading .spinner-border {
-  width: 2rem;
-  height: 2rem;
+    width: 2rem;
+    height: 2rem;
 }
 
 /* ==========================================================================
@@ -392,24 +428,24 @@
    ========================================================================== */
 
 .lightbox-toolbar .btn:disabled {
-  opacity: 0.4;
+    opacity: 0.4;
 }
 
 .lightbox-toolbar .btn-group {
-  margin-right: 0.5rem;
+    margin-right: 0.5rem;
 }
 
 .lightbox-controls .btn {
-  border-color: rgba(255,255,255,0.2);
+    border-color: rgba(255, 255, 255, 0.2);
 }
 
 .lightbox-controls .btn:hover:not(:disabled) {
-  border-color: rgba(255,255,255,0.4);
-  background-color: rgba(255,255,255,0.1);
+    border-color: rgba(255, 255, 255, 0.4);
+    background-color: rgba(255, 255, 255, 0.1);
 }
 
 .lightbox-controls .btn:focus {
-  box-shadow: 0 0 0 0.2rem rgba(255,255,255,0.25);
+    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
 }
 
 /* ==========================================================================
@@ -417,51 +453,51 @@
    ========================================================================== */
 
 @media (max-width: 768px) {
-  .image-editor-toolbar .btn-group,
-  .pdf-viewer-toolbar .btn-group {
-    margin-bottom: 4px;
-  }
-
-  .image-editor-toolbar .btn-toolbar,
-  .pdf-viewer-toolbar .btn-toolbar {
-    flex-wrap: wrap;
-  }
-
-  .image-viewer-controls {
-    bottom: 10px;
-    left: 10px;
-    right: 10px;
-    transform: none;
-    flex-wrap: wrap;
-    justify-content: center;
-  }
-
-  .image-editor-filters .row {
-    margin: 0;
-  }
-
-  .image-editor-filters .col-md-6 {
-    margin-bottom: 1rem;
-  }
+    .image-editor-toolbar .btn-group,
+    .pdf-viewer-toolbar .btn-group {
+        margin-bottom: 4px;
+    }
+
+    .image-editor-toolbar .btn-toolbar,
+    .pdf-viewer-toolbar .btn-toolbar {
+        flex-wrap: wrap;
+    }
+
+    .image-viewer-controls {
+        bottom: 10px;
+        left: 10px;
+        right: 10px;
+        transform: none;
+        flex-wrap: wrap;
+        justify-content: center;
+    }
+
+    .image-editor-filters .row {
+        margin: 0;
+    }
+
+    .image-editor-filters .col-md-6 {
+        margin-bottom: 1rem;
+    }
 }
 
 @media (max-width: 576px) {
-  .lightbox-toolbar {
-    padding: 4px 8px;
-  }
+    .lightbox-toolbar {
+        padding: 4px 8px;
+    }
 
-  .lightbox-toolbar .btn-sm {
-    padding: 0.125rem 0.25rem;
-    font-size: 0.75rem;
-  }
+    .lightbox-toolbar .btn-sm {
+        padding: 0.125rem 0.25rem;
+        font-size: 0.75rem;
+    }
 
-  .image-viewer-controls {
-    padding: 6px 8px;
-  }
+    .image-viewer-controls {
+        padding: 6px 8px;
+    }
 
-  .image-viewer-info {
-    font-size: 11px;
-  }
+    .image-viewer-info {
+        font-size: 11px;
+    }
 }
 
 /* ==========================================================================
@@ -469,31 +505,31 @@
    ========================================================================== */
 
 .lightbox-component:focus-within {
-  outline: 2px solid #007bff;
-  outline-offset: 2px;
+    outline: 2px solid #007bff;
+    outline-offset: 2px;
 }
 
 .crop-handle:focus {
-  outline: 2px solid #fff;
-  outline-offset: 1px;
+    outline: 2px solid #fff;
+    outline-offset: 1px;
 }
 
 .lightbox-toolbar .btn:focus,
 .lightbox-controls .btn:focus {
-  z-index: 3;
+    z-index: 3;
 }
 
 /* Screen reader only content */
 .sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border: 0;
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
 }
 
 /* ==========================================================================
@@ -501,31 +537,31 @@
    ========================================================================== */
 
 @media print {
-  .lightbox-toolbar,
-  .lightbox-controls,
-  .lightbox-overlay,
-  .crop-overlay {
-    display: none !important;
-  }
-
-  .pdf-canvas,
-  .image-viewer-image {
-    position: static !important;
-    transform: none !important;
-    max-width: 100% !important;
-    max-height: none !important;
-  }
-
-  .lightbox-component {
-    background: white !important;
-    overflow: visible !important;
-  }
+    .lightbox-toolbar,
+    .lightbox-controls,
+    .lightbox-overlay,
+    .crop-overlay {
+        display: none !important;
+    }
+
+    .pdf-canvas,
+    .image-viewer-image {
+        position: static !important;
+        transform: none !important;
+        max-width: 100% !important;
+        max-height: none !important;
+    }
+
+    .lightbox-component {
+        background: white !important;
+        overflow: visible !important;
+    }
 }
 
 /* ==========================================================================
    Dark Mode Support
    ========================================================================== */
-
+/*
 @media (prefers-color-scheme: dark) {
   .image-editor,
   .pdf-viewer {
@@ -562,31 +598,33 @@
     border-color: #86b7fe;
     color: #fff;
   }
-}
+}*/
 
 /* ==========================================================================
    Animation and Transitions
    ========================================================================== */
 
 .lightbox-component * {
-  transition: opacity 0.2s ease-out, transform 0.2s ease-out;
+    transition:
+        opacity 0.2s ease-out,
+        transform 0.2s ease-out;
 }
 
 .crop-box {
-  transition: all 0.1s ease-out;
+    transition: all 0.1s ease-out;
 }
 
 .lightbox-overlay {
-  transition: opacity 0.3s ease-out;
+    transition: opacity 0.3s ease-out;
 }
 
 .btn {
-  transition: all 0.15s ease-in-out;
+    transition: all 0.15s ease-in-out;
 }
 
 /* Smooth scrolling for PDF viewer */
 .pdf-viewer-content {
-  scroll-behavior: smooth;
+    scroll-behavior: smooth;
 }
 
 /* ==========================================================================
@@ -594,13 +632,13 @@
    ========================================================================== */
 
 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
-  .pdf-canvas {
-    image-rendering: -webkit-optimize-contrast;
-    image-rendering: crisp-edges;
-  }
-
-  .crop-handle {
-    width: 10px;
-    height: 10px;
-  }
+    .pdf-canvas {
+        image-rendering: -webkit-optimize-contrast;
+        image-rendering: crisp-edges;
+    }
+
+    .crop-handle {
+        width: 10px;
+        height: 10px;
+    }
 }