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

switch to BEM naming pattern

Browse source
This commit is contained in:
Sean Yesmunt 2017-06-07 09:06:14 -07:00
parent 0a7626fe49
commit 11fa00504d
2 changed files with 64 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
ui/js/component/video/internal/loading-screen.jsx
View file

@ -1,11 +1,11 @@
import React from "react"; import React from "react";
const LoadingScreen = ({ status }) => const LoadingScreen = ({ status }) =>
<div className="video--loading--screen"> <div className="video--loading-screen">
<div className="loading--screen--content"> <div className="video--loading-screen-content">
<div className="loading--spinner" /> <div className="video--loading-spinner" />
<div className="video--loading--status"> <div className="video--loading-status">
{status} {status}
</div> </div>
</div> </div>

26
ui/scss/component/_video.scss
View file

@ -28,14 +28,21 @@ video {
/*background: none;*/ /*background: none;*/
} }
.video--loading--screen { .plyr {
top: 50%;
transform: translateY(-50%);
}
}
.video--loading-screen {
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
}
.loading--screen--content { .video--loading-spinner {
.loading--spinner {
position: relative; position: relative;
width: 11em; width: 11em;
height: 11em; height: 11em;
@ -80,20 +87,11 @@ video {
background: black; background: black;
border-radius: 50%; border-radius: 50%;
} }
} }
.video--loading-status {
.video--loading--status {
padding-top: 20px; padding-top: 20px;
color: white; color: white;
}
}
}
.plyr {
top: 50%;
transform: translateY(-50%);
}
} }
.video__cover { .video__cover {