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

fix some scroller issues on mobile devices

Browse source
This commit is contained in:
dkanada 2019-07-04 00:27:42 -07:00
parent 9c9d4ba58c
commit 81be6592d6
7 changed files with 34 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/cardbuilder/card.css
View file

@ -36,6 +36,16 @@ button {
margin-right: -0.6em;
}
/* TODO replace this with a proper fix */
/* doesnt work on mobile devices */
/* negative margin fixes annoying misalignment with cards and title */
@media all and (max-width:50em) {
.itemsContainer {
margin-left: 0;
margin-right: 0;
}
}
.vertical-list {
display: flex;
flex-direction: column;

9
src/components/emby-scrollbuttons/emby-scrollbuttons.css
View file

@ -1,12 +1,3 @@
.emby-scroller-container {
position: relative;
}
.emby-scroller {
margin-left: 4em;
margin-right: 4em;
}
.emby-scrollbuttons {
position: absolute;
top: 0;

17
src/components/emby-scroller/emby-scroller.css Normal file
View file

@ -0,0 +1,17 @@
.emby-scroller-container {
position: relative;
}
.emby-scroller {
margin-left: 3.3%;
margin-right: 3.3%;
}
@media all and (max-width:50em) {
.emby-scroller {
padding-left: 3.3%;
padding-right: 3.3%;
margin-left: 0;
margin-right: 0;
}
}

2
src/components/emby-scroller/emby-scroller.js
View file

@ -1,4 +1,4 @@
define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'browser', 'registerElement'], function (scroller, dom, layoutManager, inputManager, focusManager, browser) {
define(['scroller', 'dom', 'layoutManager', 'inputManager', 'focusManager', 'browser', 'registerElement', 'css!./emby-scroller'], function (scroller, dom, layoutManager, inputManager, focusManager, browser) {
'use strict';
var ScrollerPrototype = Object.create(HTMLDivElement.prototype);

4
src/components/themes/dark/theme.css
View file

@ -19,10 +19,10 @@ html {
background-color: #101010
}
.skinHeader .semiTransparent {
.skinHeader.semiTransparent {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
background-color: rgba(0, 0, 0, 0.7);
background-color: rgba(0, 0, 0, 0.4);
}
.pageTitleWithDefaultLogo {

4
src/components/themes/emby/theme.css
View file

@ -19,10 +19,10 @@ html {
background-color: #1f1f1f
}
.skinHeader .semiTransparent {
.skinHeader.semiTransparent {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
background-color: rgba(0, 0, 0, 0.7);
background-color: rgba(0, 0, 0, 0.4);
}
.pageTitleWithDefaultLogo {

4
src/components/themes/light/theme.css
View file

@ -32,10 +32,10 @@ html {
box-shadow: none !important
}
.skinHeader .semiTransparent {
.skinHeader.semiTransparent {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
background-color: rgba(0, 0, 0, 0.7);
background-color: rgba(0, 0, 0, 0.4);
}
.pageTitleWithDefaultLogo {