mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Use built-in swiper classes

Browse source
This commit is contained in:
Dmitry Lyzo 2020-05-07 09:45:49 +03:00
parent 41ba09a316
commit 5b40232b7b
2 changed files with 2 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/components/slideshow/slideshow.js
View file

@ -260,8 +260,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
loop: false, loop: false,
zoom: { zoom: {
minRatio: 1, minRatio: 1,
toggle: true, toggle: true
containerClass: 'slider-zoom-container'
}, },
autoplay: !options.interactive, autoplay: !options.interactive,
keyboard: { keyboard: {
@ -328,7 +327,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
function getSwiperSlideHtmlFromSlide(item) { function getSwiperSlideHtmlFromSlide(item) {
var html = ''; var html = '';
html += '<div class="swiper-slide" data-original="' + item.originalImage + '" data-itemid="' + item.Id + '" data-serverid="' + item.ServerId + '">'; html += '<div class="swiper-slide" data-original="' + item.originalImage + '" data-itemid="' + item.Id + '" data-serverid="' + item.ServerId + '">';
html += '<div class="slider-zoom-container">'; html += '<div class="swiper-zoom-container">';
html += '<img src="' + item.originalImage + '" class="swiper-slide-img">'; html += '<img src="' + item.originalImage + '" class="swiper-slide-img">';
html += '</div>'; html += '</div>';
if (item.title || item.subtitle) { if (item.title || item.subtitle) {

21
src/components/slideshow/style.css
View file

@ -40,16 +40,6 @@
text-shadow: 3px 3px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; text-shadow: 3px 3px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
} }
.swiper-slide-img {
max-height: 100%;
max-width: 100%;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
margin: auto;
}
.slideshowButtonIcon { .slideshowButtonIcon {
color: #fff; color: #fff;
opacity: 0.7; opacity: 0.7;
@ -134,14 +124,3 @@
.slideSubtitle { .slideSubtitle {
color: #ccc; color: #ccc;
} }
.swiper-slide {
display: flex;
flex-direction: column;
}
.slider-zoom-container {
margin: auto;
max-height: 100%;
max-width: 100%;
}