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