mirror of
https://github.com/l1ving/youtube-dl
synced 2025-03-07 04:10:12 +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>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
|
||||
<title>youtube-dl</title>
|
||||
<link rel="stylesheet" href="style.css" type="text/css" />
|
||||
<link rel="alternate" type="application/atom+xml" title="youtube-dl releases" href="update/releases.atom" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<table class="heading"><tr>
|
||||
<td class="title"><a href="index.html">youtube-dl</a></td>
|
||||
<td class="subtitle">Download videos from YouTube
|
||||
(and <a href="supportedsites.html" style="color: blue; text-decoration: underline;">more sites</a>)</td>
|
||||
</tr></table>
|
||||
|
||||
<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>
|
||||
|
||||
<table border="0" id="rgb">
|
||||
<tr><td><a class="button" id="r" href="https://github.com/ytdl-org/youtube-dl/blob/master/README.md#readme">Documentation</a></td></tr>
|
||||
<tr><td><a class="button" id="g" href="download.html">Download</a></td></tr>
|
||||
<tr><td><a class="button" id="main-support" href="https://github.com/ytdl-org/youtube-dl/issues/new/choose">Support</a></td></tr>
|
||||
<tr><td><a class="button" id="y" href="https://github.com/ytdl-org/youtube-dl/">Develop</a></td></tr>
|
||||
<tr><td><a class="button" id="b" href="about.html">About</a></td></tr>
|
||||
</table>
|
||||
|
||||
<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="note">
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/deed.en_US">
|
||||
<img alt="Creative Commons License" style="border-width:0"
|
||||
src="https://i.creativecommons.org/l/by-sa/3.0/80x15.png" /></a><br />
|
||||
Copyright © 2006-2011 Ricardo Garcia Gonzalez<br />
|
||||
Copyright © 2011-2020 youtube-dl developers
|
||||
</div>
|
||||
</body>
|
||||
<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>2020.03.08</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>
|
||||
|
||||
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 {
|
||||
font-family: sans-serif;
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
margin-top: 2ex;
|
||||
margin: 0;
|
||||
margin-bottom: 3ex;
|
||||
background-color: white;
|
||||
color: black;
|
||||
/*background-color: #fff1db;*/
|
||||
background-color: white;
|
||||
/*
|
||||
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;
|
||||
background-color: #ffefdd;
|
||||
color: #292929;
|
||||
margin-left: 10vw;
|
||||
margin-right: 10vw;
|
||||
}
|
||||
.heading {
|
||||
border: 0;
|
||||
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 {
|
||||
|
||||
.header h1 a {
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
}
|
||||
.title {
|
||||
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;
|
||||
.header {
|
||||
text-align: center;
|
||||
font-size: x-small;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
h1 {
|
||||
font-size: x-large;
|
||||
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;
|
||||
|
||||
.container {
|
||||
display: block;
|
||||
padding: 2ex;
|
||||
border-radius: 10px;
|
||||
-moz-border-radius: 10px;
|
||||
margin: 0 0 120px;
|
||||
}
|
||||
#r {
|
||||
background-color: #884444;
|
||||
border: 2px solid #880000;
|
||||
.terminal {
|
||||
margin-top: 25px;
|
||||
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 {
|
||||
background-color: #448844;
|
||||
border: 2px solid #006600;
|
||||
background-color: #007bff;
|
||||
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