don't calculate styles in JavaScript whenever possible
This commit is contained in:
@@ -114,14 +114,14 @@ a:not(.disabled):hover, i:not(.disabled):hover {
|
|||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
transition: opacity 0.2s ease-out;
|
transition: opacity 0.15s ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app.player .header {
|
.view-player .header {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app.player:hover .header:not(.hide) {
|
.view-player:hover .header:not(.hide) {
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
}
|
}
|
||||||
@@ -144,6 +144,10 @@ a:not(.disabled):hover, i:not(.disabled):hover {
|
|||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.darwin.not-fullscreen .header .nav.left {
|
||||||
|
margin-left: 78px;
|
||||||
|
}
|
||||||
|
|
||||||
.header .nav.right {
|
.header .nav.right {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
@@ -302,7 +306,7 @@ body.drag::before {
|
|||||||
height: 38px;
|
height: 38px;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: all 0.2s ease-out;
|
transition: all 0.15s ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.player:hover .player-controls {
|
.player:hover .player-controls {
|
||||||
|
|||||||
@@ -11,10 +11,11 @@ var TorrentList = require('./torrent-list')
|
|||||||
var isOSX = process.platform === 'darwin'
|
var isOSX = process.platform === 'darwin'
|
||||||
|
|
||||||
function App (state, dispatch) {
|
function App (state, dispatch) {
|
||||||
var cls = []
|
var cls = [
|
||||||
if (state.url === '/player') {
|
process.platform,
|
||||||
cls.push('player')
|
state.isFullScreen ? 'fullscreen' : 'not-fullscreen',
|
||||||
}
|
state.url === '/player' ? 'view-player' : ''
|
||||||
|
]
|
||||||
|
|
||||||
return hx`
|
return hx`
|
||||||
<div class='app ${cls.join(' ')}'>
|
<div class='app ${cls.join(' ')}'>
|
||||||
|
|||||||
@@ -8,14 +8,11 @@ function Header (state, dispatch) {
|
|||||||
var hideControls = state.url === '/player' &&
|
var hideControls = state.url === '/player' &&
|
||||||
state.video.mouseStationarySince !== 0 &&
|
state.video.mouseStationarySince !== 0 &&
|
||||||
new Date().getTime() - state.video.mouseStationarySince > 2000
|
new Date().getTime() - state.video.mouseStationarySince > 2000
|
||||||
var navLeftStyle = (process.platform === 'darwin' && !state.isFullScreen)
|
|
||||||
? { marginLeft: '78px' } /* OSX needs room on the left for min/max/close buttons */
|
|
||||||
: {} /* On Windows and Linux, the header is separate & underneath the title bar */
|
|
||||||
|
|
||||||
return hx`
|
return hx`
|
||||||
<div class='header ${hideControls ? 'hide' : ''}'>
|
<div class='header ${hideControls ? 'hide' : ''}'>
|
||||||
${getTitle()}
|
${getTitle()}
|
||||||
<div class='nav left' style=${navLeftStyle}>
|
<div class='nav left'>
|
||||||
<i
|
<i
|
||||||
class='icon back'
|
class='icon back'
|
||||||
title='back'
|
title='back'
|
||||||
|
|||||||
Reference in New Issue
Block a user