LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Fix theater mode related issues (#1377)

Browse source 
* Adjust theater mode and image pages
This commit is contained in:
Rave | 図書館猫 2022-04-21 09:31:58 +02:00 committed by GitHub
parent b832f56929
commit 126ecd38fa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/component/fileRenderFloating/view.jsx
View file

@ -148,7 +148,7 @@ export default function FileRenderFloating(props: Props) {
const isPlayable = RENDER_MODES.FLOATING_MODES.includes(renderMode) || isCurrentClaimLive; const isPlayable = RENDER_MODES.FLOATING_MODES.includes(renderMode) || isCurrentClaimLive;
const isReadyToPlay = isCurrentClaimLive || (isPlayable && streamingUrl); const isReadyToPlay = isCurrentClaimLive || (isPlayable && streamingUrl);
const theaterMode = renderMode === 'video' ? videoTheaterMode : false; const theaterMode = renderMode === 'video' || renderMode === 'audio' ? videoTheaterMode : false;
// **************************************************************************** // ****************************************************************************
// FUNCTIONS // FUNCTIONS

3
ui/component/fileRenderInitiator/view.jsx
View file

@ -71,6 +71,7 @@ export default function FileRenderInitiator(props: Props) {
doFetchChannelLiveStatus, doFetchChannelLiveStatus,
} = props; } = props;
const theaterMode = renderMode === 'video' || renderMode === 'audio' ? videoTheaterMode : false;
const { livestreamPage, layountRendered } = React.useContext(LivestreamContext) || {}; const { livestreamPage, layountRendered } = React.useContext(LivestreamContext) || {};
const isMobile = useIsMobile(); const isMobile = useIsMobile();
@ -163,7 +164,7 @@ export default function FileRenderInitiator(props: Props) {
? 'embed__inline-button' ? 'embed__inline-button'
: classnames('content__cover', { : classnames('content__cover', {
'content__cover--disabled': disabled, 'content__cover--disabled': disabled,
'content__cover--theater-mode': videoTheaterMode && !isMobile, 'content__cover--theater-mode': theaterMode && !isMobile,
'content__cover--text': isText, 'content__cover--text': isText,
'card__media--nsfw': obscurePreview, 'card__media--nsfw': obscurePreview,
}) })

2
ui/component/page/view.jsx
View file

@ -65,7 +65,7 @@ function Page(props: Props) {
location: { pathname }, location: { pathname },
} = useHistory(); } = useHistory();
const theaterMode = renderMode === 'video' ? videoTheaterMode : false; const theaterMode = renderMode === 'video' || renderMode === 'audio' ? videoTheaterMode : false;
const isMediumScreen = useIsMediumScreen(); const isMediumScreen = useIsMediumScreen();
const isMobile = useIsMobile(); const isMobile = useIsMobile();
const isLandscapeRotated = useIsMobileLandscape(); const isLandscapeRotated = useIsMobileLandscape();

2
ui/page/file/view.jsx
View file

@ -86,7 +86,7 @@ export default function FilePage(props: Props) {
const isMobile = useIsMobile(); const isMobile = useIsMobile();
const isLandscapeRotated = useIsMobileLandscape(); const isLandscapeRotated = useIsMobileLandscape();
const theaterMode = renderMode === 'video' ? videoTheaterMode : false; const theaterMode = renderMode === 'video' || renderMode === 'audio' ? videoTheaterMode : false;
const channelSettings = channelId ? settingsByChannelId[channelId] : undefined; const channelSettings = channelId ? settingsByChannelId[channelId] : undefined;
const commentSettingDisabled = channelSettings && !channelSettings.comments_enabled; const commentSettingDisabled = channelSettings && !channelSettings.comments_enabled;
const cost = costInfo ? costInfo.cost : null; const cost = costInfo ? costInfo.cost : null;

2
ui/scss/component/_claim-list.scss
View file

@ -393,7 +393,7 @@
flex-shrink: 0; flex-shrink: 0;
margin-right: var(--spacing-s); margin-right: var(--spacing-s);
box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.2) inset; box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.1) inset;
} }
.media__thumb-placeholder-text { .media__thumb-placeholder-text {

5
ui/scss/component/_file-render.scss
View file

@ -262,8 +262,9 @@
.file-render__img-container { .file-render__img-container {
width: 100%; width: 100%;
// aspect-ratio: 16 / 9; aspect-ratio: 16 / 9;
background-color: #000000; background-color: var(--color-placeholder-background);
// background-color: rgba(25,25,25,0.4);
border-radius: var(--border-radius); border-radius: var(--border-radius);
} }

2
ui/scss/component/_media.scss
View file

@ -10,7 +10,7 @@
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.2) inset; box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.1) inset;
} }
// M E D I A // M E D I A