ctome
/
tldr
mirror of https://github.com/CrimsonTome/tldr.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add new animated svg of tar command (#5507) 

* add new animated svg of tar command

* adjust colours and animation

* remove unused assets
manned-org
Alessio 2021-04-18 16:28:00 +02:00 committed by GitHub
parent 7cc074d4d5
commit 35287e7bce
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 495 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -40,7 +40,7 @@ It certainly doesn't help that the first option explained in `man tar` is:
There seems to be room for simpler help pages, focused on practical examples.
How about:
![screenshot of the tldr-node-client displaying the tldr page for the tar command](images/screenshot.png)
![animated svg of the tldr client displaying the tar command](images/tldr.svg)
This repository is just that: an ever-growing collection of examples
for the most common UNIX, Linux, macOS, SunOS and Windows command-line tools.

BIN
images/screenshot.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 51 KiB

494
images/tldr.svg Normal file
View File

@ -0,0 +1,494 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1250" height="738.14">
<rect width="1250" height="738.14" rx="0" ry="0" class="a" />
<svg height="738.14" viewBox="0 0 125 73.814" width="1250" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<style>@keyframes l{0%{transform:translateX(0)}10.3%{transform:translateX(-125px)}10.5%{transform:translateX(-375px)}19%{transform:translateX(-500px)}20.2%{transform:translateX(-625px)}22.1%{transform:translateX(-750px)}24.9%{transform:translateX(-875px)}27.8%{transform:translateX(-1000px)}29.6%{transform:translateX(-1125px)}31.4%{transform:translateX(-1250px)}32.9%{transform:translateX(-1375px)}35.7%{transform:translateX(-1750px)}44%{transform:translateX(-2000px)}44.2%{transform:translateX(-2250px)}44.5%{transform:translateX(-2625px)}to{transform:translateX(-2750px)}}.a{fill:#000000}.c,.d{fill:#00ff00;font-weight:700;white-space:pre}.d{fill:#00ffff}.e,.g,.h,.i{fill:#ffffff;white-space:pre}.g,.h,.i{fill:#00ff00}.h,.i{fill:#ff0000}.i{fill:#0ff}</style>
<g font-family="Monaco,Consolas,Menlo,'Bitstream Vera Sans Mono','Powerline Symbols',monospace" font-size="1.67">
<defs>
<symbol id="1">
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
</symbol>
<symbol id="2">
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">tldr</text>
</symbol>
<symbol id="3">
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">tldr</text>
<text x="10.02" y="1.67" class="e">tar</text>
</symbol>
<symbol id="4">
<text x="2.004" y="1.67" style="white-space:pre" fill="#fff" font-weight="700">tar</text>
</symbol>
<symbol id="5">
<text x="2.004" y="1.67" class="e">Archiving</text>
<text x="12.024" y="1.67" class="e">utility.</text>
</symbol>
<symbol id="6">
<text x="2.004" y="1.67" class="e">Often</text>
<text x="8.016" y="1.67" class="e">combined</text>
<text x="17.034" y="1.67" class="e">with</text>
<text x="22.044" y="1.67" class="e">a</text>
<text x="24.048" y="1.67" class="e">compression</text>
<text x="36.072" y="1.67" class="e">method,</text>
<text x="44.088" y="1.67" class="e">such</text>
<text x="49.098" y="1.67" class="e">as</text>
<text x="52.104" y="1.67" class="e">gzip</text>
<text x="57.114" y="1.67" class="e">or</text>
<text x="60.12" y="1.67" class="e">bzip2.</text>
</symbol>
<symbol id="7">
<text x="2.004" y="1.67" class="e">More</text>
<text x="7.014" y="1.67" class="e">information:</text>
<text x="20.04" y="1.67" class="e">https://www.gnu.org/software/tar.</text>
</symbol>
<symbol id="8">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">[c]reate</text>
<text x="13.026" y="1.67" class="g">an</text>
<text x="16.032" y="1.67" class="g">archive</text>
<text x="24.048" y="1.67" class="g">from</text>
<text x="29.058" y="1.67" class="g">[f]iles:</text>
</symbol>
<symbol id="9">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">cf</text>
<text x="11.022" y="1.67" class="i">target.tar</text>
<text x="22.044" y="1.67" class="i">file1</text>
<text x="28.056" y="1.67" class="i">file2</text>
<text x="34.068" y="1.67" class="i">file3</text>
</symbol>
<symbol id="10">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">[c]reate</text>
<text x="13.026" y="1.67" class="g">a</text>
<text x="15.03" y="1.67" class="g">g[z]ipped</text>
<text x="25.05" y="1.67" class="g">archive</text>
<text x="33.066" y="1.67" class="g">from</text>
<text x="38.076" y="1.67" class="g">[f]iles:</text>
</symbol>
<symbol id="11">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">czf</text>
<text x="12.024" y="1.67" class="i">target.tar.gz</text>
<text x="26.052" y="1.67" class="i">file1</text>
<text x="32.064" y="1.67" class="i">file2</text>
<text x="38.076" y="1.67" class="i">file3</text>
</symbol>
<symbol id="12">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">[c]reate</text>
<text x="13.026" y="1.67" class="g">a</text>
<text x="15.03" y="1.67" class="g">g[z]ipped</text>
<text x="25.05" y="1.67" class="g">archive</text>
<text x="33.066" y="1.67" class="g">from</text>
<text x="38.076" y="1.67" class="g">a</text>
<text x="40.08" y="1.67" class="g">directory</text>
<text x="50.1" y="1.67" class="g">using</text>
<text x="56.112" y="1.67" class="g">relative</text>
<text x="65.13" y="1.67" class="g">paths:</text>
</symbol>
<symbol id="13">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">czf</text>
<text x="12.024" y="1.67" class="i">target.tar.gz</text>
<text x="26.052" y="1.67" class="h">--directory=</text>
<text x="38.076" y="1.67" class="i">path/to/directory</text>
<text x="56.112" y="1.67" class="h">.</text>
</symbol>
<symbol id="14">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">E[x]tract</text>
<text x="14.028" y="1.67" class="g">a</text>
<text x="16.032" y="1.67" class="g">(compressed)</text>
<text x="29.058" y="1.67" class="g">archive</text>
<text x="37.074" y="1.67" class="g">[f]ile</text>
<text x="44.088" y="1.67" class="g">into</text>
<text x="49.098" y="1.67" class="g">the</text>
<text x="53.106" y="1.67" class="g">current</text>
<text x="61.122" y="1.67" class="g">directory:</text>
</symbol>
<symbol id="15">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">xf</text>
<text x="11.022" y="1.67" class="i">source.tar[.gz|.bz2|.xz]</text>
</symbol>
<symbol id="16">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">E[x]tract</text>
<text x="14.028" y="1.67" class="g">a</text>
<text x="16.032" y="1.67" class="g">(compressed)</text>
<text x="29.058" y="1.67" class="g">archive</text>
<text x="37.074" y="1.67" class="g">[f]ile</text>
<text x="44.088" y="1.67" class="g">into</text>
<text x="49.098" y="1.67" class="g">the</text>
<text x="53.106" y="1.67" class="g">target</text>
<text x="60.12" y="1.67" class="g">directory:</text>
</symbol>
<symbol id="17">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">xf</text>
<text x="11.022" y="1.67" class="i">source.tar[.gz|.bz2|.xz]</text>
<text x="36.072" y="1.67" class="h">--directory=</text>
<text x="48.096" y="1.67" class="i">directory</text>
</symbol>
<symbol id="18">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">[c]reate</text>
<text x="13.026" y="1.67" class="g">a</text>
<text x="15.03" y="1.67" class="g">compressed</text>
<text x="26.052" y="1.67" class="g">archive</text>
<text x="34.068" y="1.67" class="g">from</text>
<text x="39.078" y="1.67" class="g">[f]iles,</text>
<text x="48.096" y="1.67" class="g">using</text>
<text x="54.108" y="1.67" class="g">[a]rchive</text>
<text x="64.128" y="1.67" class="g">suffix</text>
<text x="71.142" y="1.67" class="g">to</text>
<text x="74.148" y="1.67" class="g">determine</text>
<text x="84.168" y="1.67" class="g">the</text>
<text x="88.176" y="1.67" class="g">compression</text>
<text x="100.2" y="1.67" class="g">program:</text>
</symbol>
<symbol id="19">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">caf</text>
<text x="12.024" y="1.67" class="i">target.tar.xz</text>
<text x="26.052" y="1.67" class="i">file1</text>
<text x="32.064" y="1.67" class="i">file2</text>
<text x="38.076" y="1.67" class="i">file3</text>
</symbol>
<symbol id="20">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">Lis[t]</text>
<text x="11.022" y="1.67" class="g">the</text>
<text x="15.03" y="1.67" class="g">contents</text>
<text x="24.048" y="1.67" class="g">of</text>
<text x="27.054" y="1.67" class="g">a</text>
<text x="29.058" y="1.67" class="g">tar</text>
<text x="33.066" y="1.67" class="g">[f]ile</text>
<text x="40.08" y="1.67" class="g">[v]erbosely:</text>
</symbol>
<symbol id="21">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">tvf</text>
<text x="12.024" y="1.67" class="i">source.tar</text>
</symbol>
<symbol id="22">
<text x="2.004" y="1.67" class="g">-</text>
<text x="4.008" y="1.67" class="g">E[x]tract</text>
<text x="14.028" y="1.67" class="g">[f]iles</text>
<text x="22.044" y="1.67" class="g">matching</text>
<text x="31.062" y="1.67" class="g">a</text>
<text x="33.066" y="1.67" class="g">pattern:</text>
</symbol>
<symbol id="23">
<text x="4.008" y="1.67" class="h">tar</text>
<text x="8.016" y="1.67" class="h">xf</text>
<text x="11.022" y="1.67" class="i">source.tar</text>
<text x="22.044" y="1.67" class="h">--wildcards</text>
<text x="34.068" y="1.67" class="h">&quot;</text>
<text x="35.07" y="1.67" class="i">*.html</text>
<text x="41.082" y="1.67" class="h">&quot;</text>
</symbol>
<symbol id="a">
<path fill="transparent" d="M0 0h125v34H0z" />
</symbol>
<symbol id="b">
<path fill="#6f7683" d="M0 0h1.102v2.171H0z" />
</symbol>
</defs>
<path class="a" d="M0 0h125v73.814H0z" />
<g style="animation-duration:6.274285s;animation-iteration-count:infinite;animation-name:l;animation-timing-function:steps(1,end)">
<svg width="2875">
<svg>
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" />
</svg>
<svg x="125">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" />
</svg>
<svg x="250">
<use xlink:href="#a" />
<use xlink:href="#b" x="4.996" />
<use xlink:href="#1" />
</svg>
<svg x="375">
<use xlink:href="#a" />
<use xlink:href="#b" x="4.996" />
<use xlink:href="#1" />
</svg>
<svg x="500">
<use xlink:href="#a" />
<use xlink:href="#b" x="5.996" />
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">t</text>
</svg>
<svg x="625">
<use xlink:href="#a" />
<use xlink:href="#b" x="6.996" />
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">tl</text>
</svg>
<svg x="750">
<use xlink:href="#a" />
<use xlink:href="#b" x="7.996" />
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">tld</text>
</svg>
<svg x="875">
<use xlink:href="#a" />
<use xlink:href="#b" x="8.996" />
<use xlink:href="#2" />
</svg>
<svg x="1000">
<use xlink:href="#a" />
<use xlink:href="#b" x="9.996" />
<use xlink:href="#2" />
</svg>
<svg x="1125">
<use xlink:href="#a" />
<use xlink:href="#b" x="10.996" />
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">tldr</text>
<text x="10.02" y="1.67" class="e">t</text>
</svg>
<svg x="1250">
<use xlink:href="#a" />
<use xlink:href="#b" x="11.996" />
<text y="1.67" class="c">➜</text>
<text x="3.006" y="1.67" class="d">~</text>
<text x="5.01" y="1.67" class="e">tldr</text>
<text x="10.02" y="1.67" class="e">ta</text>
</svg>
<svg x="1375">
<use xlink:href="#a" />
<use xlink:href="#b" x="12.996" />
<use xlink:href="#3" />
</svg>
<svg x="1500">
<use xlink:href="#a" />
<use xlink:href="#b" x="12.996" />
<use xlink:href="#3" />
</svg>
<svg x="1625">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" y="2.146" />
<use xlink:href="#3" />
</svg>
<svg x="1750">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" y="2.146" />
<use xlink:href="#3" />
</svg>
<svg x="1875">
<use xlink:href="#a" />
<use xlink:href="#b" x="47.996" y="45.566" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<text x="4.008" y="47.261" class="h">tar</text>
<text x="8.016" y="47.261" class="h">xf</text>
<text x="11.022" y="47.261" class="i">source.tar[.gz|.bz2|.xz]</text>
<text x="36.072" y="47.261" class="h">--directory=</text>
</svg>
<svg x="2000">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" y="71.618" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<use xlink:href="#17" y="45.591" />
<use xlink:href="#18" y="49.933" />
<use xlink:href="#19" y="52.104" />
<use xlink:href="#20" y="56.446" />
<use xlink:href="#21" y="58.617" />
<use xlink:href="#22" y="62.959" />
<use xlink:href="#23" y="65.13" />
</svg>
<svg x="2125">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" y="71.618" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<use xlink:href="#17" y="45.591" />
<use xlink:href="#18" y="49.933" />
<use xlink:href="#19" y="52.104" />
<use xlink:href="#20" y="56.446" />
<use xlink:href="#21" y="58.617" />
<use xlink:href="#22" y="62.959" />
<use xlink:href="#23" y="65.13" />
</svg>
<svg x="2250">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" y="71.618" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<use xlink:href="#17" y="45.591" />
<use xlink:href="#18" y="49.933" />
<use xlink:href="#19" y="52.104" />
<use xlink:href="#20" y="56.446" />
<use xlink:href="#21" y="58.617" />
<use xlink:href="#22" y="62.959" />
<use xlink:href="#23" y="65.13" />
</svg>
<svg x="2375">
<use xlink:href="#a" />
<use xlink:href="#b" x="4.996" y="71.618" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<use xlink:href="#17" y="45.591" />
<use xlink:href="#18" y="49.933" />
<use xlink:href="#19" y="52.104" />
<use xlink:href="#20" y="56.446" />
<use xlink:href="#21" y="58.617" />
<use xlink:href="#22" y="62.959" />
<use xlink:href="#23" y="65.13" />
<use xlink:href="#1" y="71.643" />
</svg>
<svg x="2500">
<use xlink:href="#a" />
<use xlink:href="#b" x="4.996" y="71.618" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<use xlink:href="#17" y="45.591" />
<use xlink:href="#18" y="49.933" />
<use xlink:href="#19" y="52.104" />
<use xlink:href="#20" y="56.446" />
<use xlink:href="#21" y="58.617" />
<use xlink:href="#22" y="62.959" />
<use xlink:href="#23" y="65.13" />
<use xlink:href="#1" y="71.643" />
</svg>
<svg x="2625">
<use xlink:href="#a" />
<use xlink:href="#b" x="4.996" y="71.618" />
<use xlink:href="#3" />
<use xlink:href="#4" y="4.342" />
<use xlink:href="#5" y="8.684" />
<use xlink:href="#6" y="10.855" />
<use xlink:href="#7" y="13.026" />
<use xlink:href="#8" y="17.368" />
<use xlink:href="#9" y="19.539" />
<use xlink:href="#10" y="23.881" />
<use xlink:href="#11" y="26.052" />
<use xlink:href="#12" y="30.394" />
<use xlink:href="#13" y="32.565" />
<use xlink:href="#14" y="36.907" />
<use xlink:href="#15" y="39.078" />
<use xlink:href="#16" y="43.42" />
<use xlink:href="#17" y="45.591" />
<use xlink:href="#18" y="49.933" />
<use xlink:href="#19" y="52.104" />
<use xlink:href="#20" y="56.446" />
<use xlink:href="#21" y="58.617" />
<use xlink:href="#22" y="62.959" />
<use xlink:href="#23" y="65.13" />
<use xlink:href="#1" y="71.643" />
</svg>
<svg x="2750">
<use xlink:href="#a" />
<use xlink:href="#b" x="-.004" y="71.618" />
<use xlink:href="#4" y="2.171" />
<use xlink:href="#5" y="6.513" />
<use xlink:href="#6" y="8.684" />
<use xlink:href="#7" y="10.855" />
<use xlink:href="#8" y="15.197" />
<use xlink:href="#9" y="17.368" />
<use xlink:href="#10" y="21.71" />
<use xlink:href="#11" y="23.881" />
<use xlink:href="#12" y="28.223" />
<use xlink:href="#13" y="30.394" />
<use xlink:href="#14" y="34.736" />
<use xlink:href="#15" y="36.907" />
<use xlink:href="#16" y="41.249" />
<use xlink:href="#17" y="43.42" />
<use xlink:href="#18" y="47.762" />
<use xlink:href="#19" y="49.933" />
<use xlink:href="#20" y="54.275" />
<use xlink:href="#21" y="56.446" />
<use xlink:href="#22" y="60.788" />
<use xlink:href="#23" y="62.959" />
<use xlink:href="#1" y="69.472" />
</svg>
</svg>
</g>
</g>
</svg>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB