|
|
| Строка 1019: |
Строка 1019: |
| /* Раскрытие картинок во всплывающем окне по клику на них (для удобства назову — FancyBoxAlternative) */ | | /* Раскрытие картинок во всплывающем окне по клику на них (для удобства назову — FancyBoxAlternative) */ |
|
| |
|
| /* Стили для модального окна */
| | #wikiImageModal { |
| .image-modal {
| | animation: fadeIn 0.3s ease; |
| display: none;
| |
| position: fixed;
| |
| z-index: 10000; /* Повышаем z-index чтобы было поверх TimedMediaHandler */
| |
| left: 0;
| |
| top: 0;
| |
| width: 100%;
| |
| height: 100%;
| |
| background-color: rgba(0,0,0,0.9);
| |
| animation: fadeIn 0.3s; | |
| } | | } |
|
| |
|
| Строка 1037: |
Строка 1028: |
| } | | } |
|
| |
|
| .modal-content {
| | #wikiModalClose { |
| position: absolute; | | transition: color 0.2s; |
| top: 50%;
| |
| left: 50%;
| |
| transform: translate(-50%, -50%);
| |
| max-width: 90%;
| |
| max-height: 90%;
| |
| object-fit: contain;
| |
| } | | } |
|
| |
|
| .modal-close {
| | #wikiModalClose:hover { |
| position: absolute;
| | color: #ccc; |
| top: 20px;
| |
| right: 35px;
| |
| color: #fff; | |
| font-size: 40px;
| |
| font-weight: bold;
| |
| cursor: pointer;
| |
| transition: 0.3s;
| |
| z-index: 10001;
| |
| } | | } |
|
| |
|
| .modal-close:hover { | | #content img:not([class*="video"]):not([class*="tmh"]):not(.no-zoom) { |
| color: #bbb; | | cursor: zoom-in; |
| | transition: transform 0.2s, opacity 0.2s; |
| } | | } |
|
| |
|
| .modal-caption {
| | #content img:hover:not([class*="video"]):not([class*="tmh"]):not(.no-zoom) { |
| position: absolute;
| | opacity: 0.9; |
| bottom: 20px;
| |
| left: 0;
| |
| width: 100%;
| |
| text-align: center;
| |
| color: #fff;
| |
| padding: 10px;
| |
| background: rgba(0,0,0,0.7);
| |
| }
| |
| | |
| /* Делаем изображения кликабельными, но исключаем видео-плейсхолдеры */
| |
| #content img:not(.mw-tmh-thumbnail):not(.video-js *), | |
| .mw-body-content img:not(.mw-tmh-thumbnail):not(.video-js *),
| |
| .thumb img:not(.mw-tmh-thumbnail) {
| |
| cursor: pointer;
| |
| transition: transform 0.2s;
| |
| }
| |
| | |
| #content img:hover:not(.mw-tmh-thumbnail):not(.video-js *),
| |
| .mw-body-content img:hover:not(.mw-tmh-thumbnail):not(.video-js *),
| |
| .thumb img:hover:not(.mw-tmh-thumbnail) {
| |
| transform: scale(1.02); | |
| } | | } |