blog/content/examples/termtosvg-sl.svg

62 lines
350 KiB
XML
Raw Normal View History

2019-04-24 18:06:30 +00:00
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="terminal" baseProfile="full" viewBox="0 0 656 328" width="656" version="1.1">
<defs>
<termtosvg:template_settings xmlns:termtosvg="https://github.com/nbedos/termtosvg">
<termtosvg:screen_geometry columns="82" rows="19"/>
</termtosvg:template_settings>
<style type="text/css" id="generated-style"><![CDATA[:root {
--animation-duration: 8769ms;
}
#screen {
font-family: 'DejaVu Sans Mono', monospace;
font-style: normal;
font-size: 14px;
}
text {
dominant-baseline: text-before-edge;
white-space: pre;
}]]></style>
<style type="text/css" id="user-style">
/* gjm8 color theme (source: https://terminal.sexy/) */
.foreground {fill: #c5c5c5;}
.background {fill: #1c1c1c;}
.color0 {fill: #1c1c1c;}
.color1 {fill: #ff005b;}
.color2 {fill: #cee318;}
.color3 {fill: #ffe755;}
.color4 {fill: #048ac7;}
.color5 {fill: #833c9f;}
.color6 {fill: #0ac1cd;}
.color7 {fill: #e5e5e5;}
.color8 {fill: #1c1c1c;}
.color9 {fill: #ff005b;}
.color10 {fill: #cee318;}
.color11 {fill: #ffe755;}
.color12 {fill: #048ac7;}
.color13 {fill: #833c9f;}
.color14 {fill: #0ac1cd;}
.color15 {fill: #e5e5e5;}
@keyframes progress-bar-animation {
from {
transform: translate(0px, calc(100% - 5px)) scale(0, 1);
}
to {
transform: translate(0px, calc(100% - 5px)) scale(1, 1);
}
}
#progress-bar {
animation-duration: var(--animation-duration);
animation-iteration-count: infinite;
animation-name: progress-bar-animation;
animation-timing-function: linear;
transform-origin: left;
}
</style>
</defs>
<rect width="100%" height="100%" class="background"/>
<svg id="screen" width="656" viewBox="0 0 656 323" preserveAspectRatio="xMidYMin meet">
<rect class="background" height="100%" width="100%" x="0" y="0"/><g display="none"><rect class="foreground" height="17" width="8" x="16" y="17"/><use y="17" xlink:href="#g1"/><animate attributeName="display" begin="0ms; anim_last.end" dur="356ms" from="inline" to="inline"/></g><g display="none"><rect class="foreground" height="17" width="8" x="24" y="17"/><use y="17" xlink:href="#g2"/><animate attributeName="display" begin="356ms; anim_last.end+356ms" dur="215ms" from="inline" to="inline"/></g><g display="none"><rect class="foreground" height="17" width="8" x="32" y="17"/><use y="17" xlink:href="#g3"/><animate attributeName="display" begin="571ms; anim_last.end+571ms" dur="324ms" from="inline" to="inline"/></g><g display="none"><rect class="foreground" height="17" width="8" x="0" y="34"/><use y="34" xlink:href="#g4"/><animate attributeName="display" begin="895ms; anim_last.end+895ms" dur="4ms" from="inline" to="inline"/></g><g display="none"><use y="0" xlink:href="#g5"/><animate attributeName="display" begin="0ms; anim_last.end" dur="900ms" from="inline" to="inline"/></g><g display="none"><use y="17" xlink:href="#g6"/><animate attributeName="display" begin="895ms; anim_last.end+895ms" dur="5ms" from="inline" to="inline"/></g><g display="none"><use y="187" xlink:href="#g7"/><animate attributeName="display" begin="900ms; anim_last.end+900ms" dur="38ms" from="inline" to="inline"/></g><g display="none"><use y="187" xlink:href="#g8"/><use y="204" xlink:href="#g9"/><animate attributeName="display" begin="938ms; anim_last.end+938ms" dur="40ms" from="inline" to="inline"/></g><g display="none"><use y="85" xlink:href="#g7"/><use y="136" xlink:href="#g9"/><animate attributeName="display" begin="978ms; anim_last.end+978ms" dur="40ms" from="inline" to="inline"/></g><g display="none"><use y="153" xlink:href="#g9"/><use y="170" xlink:href="#g9"/><use y="187" xlink:href="#g10"/><use y="204" xlink:href="#g11"/><use y="221" xlink:href="#g12"/><animate attributeName="display" begin="978ms; anim_last.end+978ms" dur="41ms" from="inline" to="inline"/></g><g display="none"><use y="85" xlink:href="#g13"/><use y="102" xlink:href="#g9"/><animate attributeName="display" begin="1018ms; anim_last.end+1018ms" dur="39ms" from="inline" to="inline"/></g><g display="none"><use y="136" xlink:href="#g14"/><use y="119" xlink:href="#g15"/><animate attributeName="display" begin="1018ms; anim_last.end+1018ms" dur="42ms" from="inline" to="inline"/></g><g display="none"><use y="153" xlink:href="#g14"/><use y="170" xlink:href="#g11"/><use y="187" xlink:href="#g16"/><use y="204" xlink:href="#g17"/><use y="221" xlink:href="#g18"/><animate attributeName="display" begin="1019ms; anim_last.end+1019ms" dur="41ms" from="inline" to="inline"/></g><g display="none"><use y="85" xlink:href="#g19"/><use y="102" xlink:href="#g20"/><animate attributeName="display" begin="1057ms; anim_last.end+1057ms" dur="40ms" from="inline" to="inline"/></g><g display="none"><use y="119" xlink:href="#g21"/><animate attributeName="display" begin="1060ms; anim_last.end+1060ms" dur="37ms" from="inline" to="inline"/></g><g display="none"><use y="136" xlink:href="#g22"/><use y="153" xlink:href="#g23"/><use y="170" xlink:href="#g24"/><use y="187" xlink:href="#g25"/><use y="204" xlink:href="#g26"/><use y="221" xlink:href="#g27"/><animate attributeName="display" begin="1060ms; anim_last.end+1060ms" dur="38ms" from="inline" to="inline"/></g><g display="none"><use y="85" xlink:href="#g28"/><use y="102" xlink:href="#g29"/><use y="119" xlink:href="#g30"/><animate attributeName="display" begin="1097ms; anim_last.end+1097ms" dur="39ms" from="inline" to="inline"/></g><g display="none"><use y="136" xlink:href="#g31"/><use y="153" xlink:href="#g32"/><use y="170" xlink:href="#g33"/><use y="187" xlink:href="#g34"/><use y="204" xlink:href="#g35"/><use y="221" xlink:href="#g36"/><animate attributeName="display" begin="1098ms; anim_last.end+1098ms" dur="41ms" from="inline" to="inline"/></g><g display="none"><use y="68" xlink:href="#g37"/><use y="85" xlink:href="#g38"/><use y="102" xlink:href="#g39"/><anima
<rect id="progress-bar" width="100%" height="5" class="color1"/>
</svg>