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

Decrease --header-height by 20%

Browse source
This commit is contained in:
Rafael 2021-12-20 09:40:24 -03:00 committed by Thomas Zarebczan
parent 75b441e7cb
commit 56603be2f9
4 changed files with 8 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -18,6 +18,10 @@ import { useHistory } from 'react-router';
import { isURIEqual } from 'util/lbryURI'; import { isURIEqual } from 'util/lbryURI';
import AutoplayCountdown from 'component/autoplayCountdown'; import AutoplayCountdown from 'component/autoplayCountdown';
// scss/init/vars.scss
// --header-height
const HEADER_HEIGHT = 64;
const IS_DESKTOP_MAC = typeof process === 'object' ? process.platform === 'darwin' : false; const IS_DESKTOP_MAC = typeof process === 'object' ? process.platform === 'darwin' : false;
const DEBOUNCE_WINDOW_RESIZE_HANDLER_MS = 100; const DEBOUNCE_WINDOW_RESIZE_HANDLER_MS = 100;
export const INLINE_PLAYER_WRAPPER_CLASS = 'inline-player__wrapper'; export const INLINE_PLAYER_WRAPPER_CLASS = 'inline-player__wrapper';
@ -339,8 +343,7 @@ export default function FileRenderFloating(props: Props) {
width: fileViewerRect.width, width: fileViewerRect.width,
height: fileViewerRect.height, height: fileViewerRect.height,
left: fileViewerRect.x, left: fileViewerRect.x,
// 80px is header height in scss/init/vars.scss top: fileViewerRect.windowOffset + fileViewerRect.top - HEADER_HEIGHT - (IS_DESKTOP_MAC ? 24 : 0),
top: fileViewerRect.windowOffset + fileViewerRect.top - 80 - (IS_DESKTOP_MAC ? 24 : 0),
} }
: {} : {}
} }

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

@ -103,7 +103,7 @@
position: absolute; position: absolute;
left: 0; left: 0;
right: 0; right: 0;
top: calc(var(--header-height) - (var(--height-input)) + 3px); top: calc(var(--header-height) - var(--spacing-m) - 3px);
@extend .card; @extend .card;
box-shadow: var(--card-box-shadow); box-shadow: var(--card-box-shadow);
border-top-right-radius: 0; border-top-right-radius: 0;

2
ui/scss/component/menu-button.scss
View file

@ -86,7 +86,7 @@
.menu__list--header { .menu__list--header {
@extend .menu__list; @extend .menu__list;
margin-top: 19px; margin-top: var(--spacing-s);
} }
.menu__list--comments { .menu__list--comments {

2
ui/scss/init/_vars.scss
View file

@ -66,7 +66,7 @@
// Header // Header
// This is tied to the floating player so it knows where to attach to // This is tied to the floating player so it knows where to attach to
// ui/component/fileRenderFloating/view.jsx // ui/component/fileRenderFloating/view.jsx
--header-height: 80px; --header-height: 64px;
// Inline Player // Inline Player
--inline-player-max-height: calc(100vh - var(--header-height) - var(--spacing-l) * 4); --inline-player-max-height: calc(100vh - var(--header-height) - var(--spacing-l) * 4);