mirror of
https://github.com/LBRYFoundation/Watch-on-LBRY.git
synced 2025-09-01 01:35:16 +00:00
Improved graphics
Changed HTML and CSS
This commit is contained in:
parent
35ef6d981c
commit
0d373e6322
2 changed files with 57 additions and 41 deletions
|
@ -1,33 +1,55 @@
|
||||||
body {
|
.body {
|
||||||
width: 400px;
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
padding: 10px;
|
||||||
|
width: 50%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background-color: #191a1c;
|
margin-bottom: 15px;
|
||||||
color: whitesmoke;
|
border: 3px;
|
||||||
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
display: block;
|
display: block;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin: 0 auto;
|
margin: auto;
|
||||||
width: 80%;
|
width: 50%;
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
|
border: 3px;
|
||||||
|
padding: 10px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.goButton {
|
.goButton {
|
||||||
|
background-color: transparent;
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 15px 30px;
|
||||||
|
color: teal;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 4px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 24px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
background-color: #075656;
|
display: flex;
|
||||||
border: 4px solid #075656;
|
justify-content: center;
|
||||||
color: whitesmoke;
|
align-items: center;
|
||||||
|
border: transparent;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
padding: 4px 15px;
|
padding: 4px 15px;
|
||||||
margin-right: 25px;
|
margin-right: 25px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
transition: 0.2s;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-top: 90px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.goButton:hover{
|
||||||
|
color: #075656;
|
||||||
|
background: teal;
|
||||||
|
box-shadow: 0 0px 10px teal, 0 0px 40px teal, 0 0 80px teal;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
.label {
|
.label {
|
||||||
font-size: 1.1rem;
|
font-size: 1.1rem;
|
||||||
|
@ -35,23 +57,15 @@ body {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button {
|
.selectYtSubscriptions{
|
||||||
padding: 15px 25px;
|
color: teal;
|
||||||
font-size: 24px;
|
font: 36px Tahoma, Helvetica, Arial, Sans-Serif;
|
||||||
|
text-shadow: 0px 2px 3px rgb(0, 0, 0);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
cursor: pointer;
|
margin: 90px;
|
||||||
outline: none;
|
}
|
||||||
color: #fff;
|
|
||||||
background-color: #4CAF50;
|
.selectYtSubscriptions:hover{
|
||||||
border: none;
|
text-shadow: 0px 2px 3px rgb(0, 255, 255);
|
||||||
border-radius: 15px;
|
transition: 0.2s;
|
||||||
box-shadow: 0 9px #999;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.button:hover {background-color: #3e8e41}
|
|
||||||
|
|
||||||
.button:active {
|
|
||||||
background-color: #3e8e41;
|
|
||||||
box-shadow: 0 5px #666;
|
|
||||||
transform: translateY(4px);
|
|
||||||
}
|
|
|
@ -7,16 +7,18 @@
|
||||||
<script src="YTtoLBRY.js" charset="utf-8"></script>
|
<script src="YTtoLBRY.js" charset="utf-8"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body style="background-color:#474747;">
|
||||||
|
<div class="container">
|
||||||
<iframe width="560" height="315" src="https://lbry.tv/$/embed/howtouseconverter/c9827448d6ac7a74ecdb972c5cdf9ddaf648a28e" allowfullscreen></iframe>
|
<iframe width="100%" height="400px" src="https://lbry.tv/$/embed/howtouseconverter/c9827448d6ac7a74ecdb972c5cdf9ddaf648a28e" allowfullscreen></iframe>
|
||||||
|
<div class="selectYtSubscriptions">Select Youtube Subscriptions</div>
|
||||||
<label for="file">Select Youtube Subscriptions</label>
|
<hr>
|
||||||
<input type="file" id="subconv" class="PickFile">
|
<input type="file" id="subconv" class="PickFile">
|
||||||
<input type="button" id="go-button" value="GO" class="goButton">
|
<hr>
|
||||||
<ul id="lbry-channel-list">
|
<input type="button" id="go-button" value="All done!" class="goButton">
|
||||||
</ul>
|
<ul id="lbry-channel-list">
|
||||||
<script type="text/javascript" src="content.js"></script>
|
</ul>
|
||||||
|
<script type="text/javascript" src="content.js"></script>
|
||||||
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Add table
Reference in a new issue