mirror of
https://github.com/l1ving/youtube-dl
synced 2025-03-09 07:37:16 +08:00
WIP Redesign youtube-dl website
This commit is contained in:
Tomas
parent
26725aae4e
commit
b3375c7816
83
index.html
83
index.html
@ -1,39 +1,48 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
|
<meta charset="UTF-8">
|
||||||
<title>youtube-dl</title>
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||||
<link rel="stylesheet" href="style.css" type="text/css" />
|
<title>youtube-dl</title>
|
||||||
<link rel="alternate" type="application/atom+xml" title="youtube-dl releases" href="update/releases.atom" />
|
<meta name="description" content="youtube-dl is a command-line program to download videos from YouTube and a few more sites">
|
||||||
</head>
|
<link rel="alternate" type="application/atom+xml" title="youtube-dl releases" href="update/releases.atom" />
|
||||||
<body>
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
<table class="heading"><tr>
|
<body>
|
||||||
<td class="title"><a href="index.html">youtube-dl</a></td>
|
<div class="header">
|
||||||
<td class="subtitle">Download videos from YouTube
|
<h1><a href="index.html">youtube-dl</a></h1>
|
||||||
(and <a href="supportedsites.html" style="color: blue; text-decoration: underline;">more sites</a>)</td>
|
<h2>Download videos from YouTube (and <a href="supportedsites.html">more sites</a>)</h2>
|
||||||
</tr></table>
|
<hr>
|
||||||
|
</div>
|
||||||
<p><em>youtube-dl</em> is a command-line program to download videos from YouTube.com and a few <a href="supportedsites.html" style="color: blue; text-decoration: underline;">more sites</a>. It requires the <a href="http://www.python.org/">Python interpreter</a> (2.6, 2.7, or 3.2+), and it is not platform specific. We also provide a <a href="https://yt-dl.org/latest/youtube-dl.exe">Windows executable</a> that includes Python. youtube-dl should work in your Unix box, in Windows or in Mac OS X. It is released to the public domain, which means you can modify it, redistribute it or use it however you like.</p>
|
<div class="container">
|
||||||
|
<div class="download">
|
||||||
<table border="0" id="rgb">
|
<div class="terminal">
|
||||||
<tr><td><a class="button" id="r" href="https://github.com/ytdl-org/youtube-dl/blob/master/README.md#readme">Documentation</a></td></tr>
|
<p># Latest version</p>
|
||||||
<tr><td><a class="button" id="g" href="download.html">Download</a></td></tr>
|
<p>$ youtube-dl --version</p>
|
||||||
<tr><td><a class="button" id="main-support" href="https://github.com/ytdl-org/youtube-dl/issues/new/choose">Support</a></td></tr>
|
<p>2020.03.08</p></div>
|
||||||
<tr><td><a class="button" id="y" href="https://github.com/ytdl-org/youtube-dl/">Develop</a></td></tr>
|
<p><a class="download-button" id="g" href="download.html">Download</a><p>
|
||||||
<tr><td><a class="button" id="b" href="about.html">About</a></td></tr>
|
</div>
|
||||||
</table>
|
<h3>Description:</h3>
|
||||||
|
<p><em>youtube-dl</em> is a command-line program to download videos from YouTube.com and a few <a href="supportedsites.html">more sites</a>. It requires the <a href="http://www.python.org/">Python interpreter</a> (2.6, 2.7, or 3.2+), and it is not platform specific. We also provide a <a href="https://yt-dl.org/latest/youtube-dl.exe">Windows executable</a> that includes Python. youtube-dl should work in your Unix box, in Windows or in Mac OS X. It is released to the public domain, which means you can modify it, redistribute it or use it however you like.</p>
|
||||||
<p>You can also contact us on the irc channel <a href="irc://chat.freenode.net/#youtube-dl">#youtube-dl</a> (<a href="http://webchat.freenode.net/?randomnick=1&channels=youtube-dl">webchat</a>) on freenode.</p>
|
<div class="terminal">
|
||||||
|
<p># Usage</p>
|
||||||
<p>If you like this project, you may donate <a href="donations.html">here</a>.</p>
|
<p>$ youtube-dl [OPTIONS] URL [URL...]</p>
|
||||||
|
</div>
|
||||||
<div class="note">
|
<p>You can also contact us on the irc channel <a href="irc://chat.freenode.net/#youtube-dl">#youtube-dl</a> (<a href="http://webchat.freenode.net/?randomnick=1&channels=youtube-dl">webchat</a>) on freenode.</p>
|
||||||
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/deed.en_US">
|
<p>If you like this project, you may donate <a href="donations.html">here</a>.</p>
|
||||||
<img alt="Creative Commons License" style="border-width:0"
|
<div class="bottom-navbar">
|
||||||
src="https://i.creativecommons.org/l/by-sa/3.0/80x15.png" /></a><br />
|
<a class="button" id="doc" href="https://github.com/ytdl-org/youtube-dl/blob/master/README.md#readme">Documentation</a>
|
||||||
Copyright © 2006-2011 Ricardo Garcia Gonzalez<br />
|
<a class="button" id="support" href="https://github.com/ytdl-org/youtube-dl/issues/new/choose">Support</a>
|
||||||
Copyright © 2011-2020 youtube-dl developers
|
<a class="button" id="dev" href="https://github.com/ytdl-org/youtube-dl/">Develop</a>
|
||||||
</div>
|
<a class="button" id="about" href="about.html">About</a>
|
||||||
</body>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="note">
|
||||||
|
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/deed.en_US">
|
||||||
|
<img alt="Creative Commons License" src="80x15.png" />
|
||||||
|
</a>
|
||||||
|
<p>Copyright © 2006-2011 Ricardo Garcia Gonzalez</p>
|
||||||
|
<p>Copyright © 2011-2020 youtube-dl developers</p>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
48
index.html.in
Normal file
48
index.html.in
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||||
|
<title>youtube-dl</title>
|
||||||
|
<meta name="description" content="youtube-dl is a command-line program to download videos from YouTube and a few more sites">
|
||||||
|
<link rel="alternate" type="application/atom+xml" title="youtube-dl releases" href="update/releases.atom" />
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="header">
|
||||||
|
<h1><a href="index.html">youtube-dl</a></h1>
|
||||||
|
<h2>Download videos from YouTube (and <a href="supportedsites.html">more sites</a>)</h2>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
<div class="container">
|
||||||
|
<div class="download">
|
||||||
|
<div class="terminal">
|
||||||
|
<p># Latest version</p>
|
||||||
|
<p>$ youtube-dl --version</p>
|
||||||
|
<p>@PROGRAM_VERSION@</p></div>
|
||||||
|
<p><a class="download-button" id="g" href="download.html">Download</a><p>
|
||||||
|
</div>
|
||||||
|
<h3>Description:</h3>
|
||||||
|
<p><em>youtube-dl</em> is a command-line program to download videos from YouTube.com and a few <a href="supportedsites.html">more sites</a>. It requires the <a href="http://www.python.org/">Python interpreter</a> (2.6, 2.7, or 3.2+), and it is not platform specific. We also provide a <a href="https://yt-dl.org/latest/youtube-dl.exe">Windows executable</a> that includes Python. youtube-dl should work in your Unix box, in Windows or in Mac OS X. It is released to the public domain, which means you can modify it, redistribute it or use it however you like.</p>
|
||||||
|
<div class="terminal">
|
||||||
|
<p># Usage</p>
|
||||||
|
<p>$ youtube-dl [OPTIONS] URL [URL...]</p>
|
||||||
|
</div>
|
||||||
|
<p>You can also contact us on the irc channel <a href="irc://chat.freenode.net/#youtube-dl">#youtube-dl</a> (<a href="http://webchat.freenode.net/?randomnick=1&channels=youtube-dl">webchat</a>) on freenode.</p>
|
||||||
|
<p>If you like this project, you may donate <a href="donations.html">here</a>.</p>
|
||||||
|
<div class="bottom-navbar">
|
||||||
|
<a class="button" id="doc" href="https://github.com/ytdl-org/youtube-dl/blob/master/README.md#readme">Documentation</a>
|
||||||
|
<a class="button" id="support" href="https://github.com/ytdl-org/youtube-dl/issues/new/choose">Support</a>
|
||||||
|
<a class="button" id="dev" href="https://github.com/ytdl-org/youtube-dl/">Develop</a>
|
||||||
|
<a class="button" id="about" href="about.html">About</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="note">
|
||||||
|
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/deed.en_US">
|
||||||
|
<img alt="Creative Commons License" src="80x15.png" />
|
||||||
|
</a>
|
||||||
|
<p>Copyright © 2006-2011 Ricardo Garcia Gonzalez</p>
|
||||||
|
<p>Copyright © 2011-2020 youtube-dl developers</p>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
219
style.css
219
style.css
@ -1,156 +1,91 @@
|
|||||||
|
html{
|
||||||
|
position: relative;
|
||||||
|
min-height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
margin-left: 10%;
|
margin: 0;
|
||||||
margin-right: 10%;
|
|
||||||
margin-top: 2ex;
|
|
||||||
margin-bottom: 3ex;
|
margin-bottom: 3ex;
|
||||||
background-color: white;
|
background-color: #ffefdd;
|
||||||
color: black;
|
color: #292929;
|
||||||
/*background-color: #fff1db;*/
|
margin-left: 10vw;
|
||||||
background-color: white;
|
margin-right: 10vw;
|
||||||
/*
|
|
||||||
background-image: url("gradient.png");
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
*/
|
|
||||||
/*
|
|
||||||
background-image: url("gradient2.png");
|
|
||||||
background-repeat: repeat-y;
|
|
||||||
*/
|
|
||||||
/*
|
|
||||||
background-image: url("gradient3.png");
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
*/
|
|
||||||
/*
|
|
||||||
background-image: url("gradient4.png");
|
|
||||||
background-repeat: repeat-y;
|
|
||||||
*/
|
|
||||||
background-image: url("gradient5.png");
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
}
|
}
|
||||||
.heading {
|
|
||||||
border: 0;
|
.header h1 a {
|
||||||
color: black;
|
|
||||||
font-size: xx-large;
|
|
||||||
font-weight: bold;
|
|
||||||
padding-bottom: 1ex;
|
|
||||||
border-bottom: 1px solid black;
|
|
||||||
margin-bottom: 2ex;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.heading tr {
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
.heading td {
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
.heading a {
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
.title {
|
.header {
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.subtitle {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
.toc {
|
|
||||||
padding-left: 2ex;
|
|
||||||
border: 1px solid #aaaaaa;
|
|
||||||
background-color: white;
|
|
||||||
padding-bottom: 1ex;
|
|
||||||
border-radius: 10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
}
|
|
||||||
.toc ul {
|
|
||||||
margin: 0; list-style-type: none;
|
|
||||||
}
|
|
||||||
hr {
|
|
||||||
margin-top: 3ex;
|
|
||||||
margin-bottom: 3ex;
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
.note {
|
|
||||||
margin-top: 10ex;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: x-small;
|
line-height: 1.5em;
|
||||||
}
|
}
|
||||||
h1 {
|
|
||||||
font-size: x-large;
|
.container {
|
||||||
margin-top: 2ex;
|
|
||||||
color: black;
|
|
||||||
margin-left: 2%;
|
|
||||||
margin-right: 2%;
|
|
||||||
}
|
|
||||||
h2 {
|
|
||||||
font-size: large;
|
|
||||||
margin-left: 5%;
|
|
||||||
margin-right: 5%;
|
|
||||||
}
|
|
||||||
p {
|
|
||||||
margin-left: 5%;
|
|
||||||
margin-right: 5%;
|
|
||||||
}
|
|
||||||
ul {
|
|
||||||
margin-left: 5%;
|
|
||||||
margin-right: 5%;
|
|
||||||
}
|
|
||||||
li {
|
|
||||||
margin-left: 3%;
|
|
||||||
margin-top: 0.5ex;
|
|
||||||
margin-bottom: 0.5ex;
|
|
||||||
}
|
|
||||||
tt {
|
|
||||||
padding-left: 0.5ex;
|
|
||||||
padding-right: 0.5ex;
|
|
||||||
background: #dddddd;
|
|
||||||
}
|
|
||||||
#rgb {
|
|
||||||
width: 33%;
|
|
||||||
margin: 3ex auto;
|
|
||||||
}
|
|
||||||
.button {
|
|
||||||
color: white;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: x-large;
|
|
||||||
text-decoration: none;
|
|
||||||
text-align: center;
|
|
||||||
display: block;
|
display: block;
|
||||||
padding: 2ex;
|
margin: 0 0 120px;
|
||||||
border-radius: 10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
}
|
}
|
||||||
#r {
|
.terminal {
|
||||||
background-color: #884444;
|
margin-top: 25px;
|
||||||
border: 2px solid #880000;
|
background-color: #2d2d2d;
|
||||||
|
color: #5eff00;
|
||||||
|
text-align: left;
|
||||||
|
padding-bottom: 25px;
|
||||||
|
line-height: 0.5em;
|
||||||
|
padding-top: 1px;
|
||||||
|
padding-left: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
.download {
|
||||||
|
text-align: center;
|
||||||
|
max-width: 50%;
|
||||||
|
margin-left: 25%;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
text-align: center;
|
||||||
|
height: 85px;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 0.5em;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.download-button {
|
||||||
|
padding: 10px 20px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 15px;
|
||||||
|
border-radius: 2px;
|
||||||
|
text-decoration: none;
|
||||||
|
color: white;
|
||||||
|
border: 1px solid #7d7d7d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom-navbar {
|
||||||
|
font-size: x-large;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 30px;
|
||||||
|
line-height: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom-navbar a{
|
||||||
|
padding: 5px;
|
||||||
|
text-decoration: none;
|
||||||
|
color: #004687;
|
||||||
|
border: 2px solid #004687;
|
||||||
|
margin-left: 20px;
|
||||||
|
margin-right: 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
#g {
|
#g {
|
||||||
background-color: #448844;
|
background-color: #007bff;
|
||||||
border: 2px solid #006600;
|
border-color: #007bff;
|
||||||
}
|
|
||||||
#b {
|
|
||||||
background-color: #444488;
|
|
||||||
border: 2px solid #000088;
|
|
||||||
}
|
|
||||||
#y {
|
|
||||||
background-color: #888844;
|
|
||||||
border: 2px solid #666600;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-support {
|
|
||||||
background-color: #448888;
|
|
||||||
border: 2px solid #008888;
|
|
||||||
}
|
|
||||||
|
|
||||||
code.commands {
|
|
||||||
display:block;
|
|
||||||
margin-top: 0.4em;
|
|
||||||
padding: 0.7em;
|
|
||||||
background: #ccc;
|
|
||||||
background: rgba(200, 200, 200, 0.4);
|
|
||||||
white-space: pre;
|
|
||||||
}
|
|
||||||
|
|
||||||
code.fingerprint {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 140%;
|
|
||||||
}
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user