add some tips on index page

This commit is contained in:
Imanoel Ali 2019-01-17 11:58:41 +03:30
parent 6175a9ad11
commit 87b12730c7
2 changed files with 34 additions and 8 deletions

View file

@ -20,7 +20,7 @@ video {
height: 100%; height: 100%;
} }
ul { .controls ul {
font: 20px sans-serif; font: 20px sans-serif;
display: flex; display: flex;
align-items: stretch; align-items: stretch;
@ -30,7 +30,7 @@ ul {
padding: 0; padding: 0;
} }
li { .controls ul li {
flex: 0 1 auto; flex: 0 1 auto;
list-style-type: none; list-style-type: none;
height: 100%; height: 100%;
@ -45,7 +45,7 @@ li {
top: 0; top: 0;
} }
li:first-child { .controls ul li:first-child {
background: #ffffff45; background: #ffffff45;
left: 0; left: 0;
} }
@ -71,7 +71,7 @@ li:first-child {
} }
/* comment to show links */ /* comment to show links */
a { .controls a {
color: #ffffffa6; color: #ffffffa6;
text-decoration: none; text-decoration: none;
text-shadow: 0px 0px 10px #000; text-shadow: 0px 0px 10px #000;
@ -83,12 +83,12 @@ a {
vertical-align: middle; vertical-align: middle;
} }
a:hover { .controls a:hover {
color: white; color: white;
} }
a:active, .controls a:active,
a:focus { .controls a:focus {
color: white; color: white;
text-decoration: underline solid white text-decoration: underline solid white
} }
@ -226,4 +226,20 @@ video::-webkit-media-controls-panel {
.file-area input[type=file]:valid+.file-dummy .default { .file-area input[type=file]:valid+.file-dummy .default {
display: inline-block; display: inline-block;
}
ul.file-tips {
/* list-style-type: none; */
border-top: 1px solid black;
padding: 16px;
width: inherit;
margin: 0;
margin: 29px auto;
text-align: left;
}
h2 {
margin-top: -15%;
margin-bottom: 12%;
font-size: 3em;
} }

View file

@ -19,8 +19,18 @@
<div class="file-area"> <div class="file-area">
<input id="fileinput" type="file"> <input id="fileinput" type="file">
<div class="file-dummy"> <div class="file-dummy">
<span class="default">Select video file </span> <h2>Bandersnatch Interactive Player</h2>
<span class="default">Select Bandersnatch video file ( 5:12:14 ) </span>
<span class="success">Great, your file is selected</span> <span class="success">Great, your file is selected</span>
<ul class="file-tips">
<li>this player only work on google chrome ( on firefox dont work , codec problem,test other browser ?)</li>
<li>download Bandersnatch video file ( 5:12:14 )</li>
<li>drag it on white box on page :)</li>
<li>on full screen video choice dont show !!!</li>
<li>only english subtitle available , if you want add another language subtitle , tell me (<a href="https://github.com/mehotkhan"
target="_blank"> Ali Zemani</a>)</li>
</ul>
</div> </div>
</div> </div>