UI update

Added two more sections in how it works page
This commit is contained in:
sairaj mote 2021-07-02 22:23:26 +05:30
parent 00b687d10c
commit 8ce7b23447
9 changed files with 4505 additions and 4340 deletions

View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 500"><defs><style>.a{fill:none;stroke:#a7a9ac;stroke-miterlimit:10;stroke-width:8px;}.b,.d{fill:#d1d3d4;}.b{opacity:0.4;}.c{fill:#2fa3dc;}.d{opacity:0.3;}.e{fill:#fff;}</style></defs><rect class="a" x="109.43" y="61.69" width="581.14" height="376.61" rx="16"/><line class="a" x1="109.43" y1="99.72" x2="690.57" y2="99.72"/><rect class="b" x="294.04" y="243.37" width="211.92" height="26.66" rx="13.33"/><path class="c" d="M425.36,186.89l8-8a1.46,1.46,0,0,0,0-2.07,1.48,1.48,0,0,0-1-.43H395.08a1.47,1.47,0,0,0-1.46,1.46v50a1.46,1.46,0,0,0,1.46,1.46,1.49,1.49,0,0,0,1.05-.44l8-8.12a1.43,1.43,0,0,0,.41-1V208.36a1.45,1.45,0,0,1,.44-1l7.95-8a1.47,1.47,0,0,0,0-2.07,1.51,1.51,0,0,0-1.05-.43H406a1.46,1.46,0,0,1-1.47-1.46h0v-6.62a1.48,1.48,0,0,1,1.47-1.46h18.35A1.46,1.46,0,0,0,425.36,186.89Z"/><path class="c" d="M377.45,187.32h9.69a1.46,1.46,0,0,0,1.48-1.45h0v-8a1.47,1.47,0,0,0-1.46-1.46h-4.43a1.47,1.47,0,0,0-1.22.66l-5.28,8a1.46,1.46,0,0,0,.42,2A1.48,1.48,0,0,0,377.45,187.32Z"/><rect class="d" x="166.67" y="302.43" width="469.01" height="47.09" rx="4"/><rect class="d" x="166.67" y="358" width="469.01" height="47.09" rx="4"/><rect class="c" x="139.17" y="124.69" width="77.03" height="18.73" rx="4.19"/><circle class="c" cx="612.54" cy="362.24" r="40.25"/><path class="e" d="M616.3,365.44V345.55a1.4,1.4,0,0,0-1.4-1.4h-5.06a1.4,1.4,0,0,0-1.4,1.4v19.89H601a1.4,1.4,0,0,0-1,2.39l12,12a.71.71,0,0,0,1,0l12-12a1.4,1.4,0,0,0-1-2.39Z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 500"><defs><style>.a{fill:#a7a9ac;opacity:0.15;}.b,.d{fill:#d1d3d4;}.b{opacity:0.5;}.c{fill:#2fa3dc;}.d{opacity:0.3;}.e{fill:#fff;}</style></defs><rect class="a" x="109.43" y="61.69" width="581.14" height="376.61" rx="16"/><rect class="b" x="294.04" y="243.37" width="211.92" height="26.66" rx="13.33"/><path class="c" d="M425.36,186.89l8-8a1.46,1.46,0,0,0,0-2.07,1.48,1.48,0,0,0-1-.43H395.08a1.47,1.47,0,0,0-1.46,1.46v50a1.46,1.46,0,0,0,1.46,1.46,1.49,1.49,0,0,0,1.05-.44l8-8.12a1.43,1.43,0,0,0,.41-1V208.36a1.45,1.45,0,0,1,.44-1l7.95-8a1.47,1.47,0,0,0,0-2.07,1.51,1.51,0,0,0-1.05-.43H406a1.46,1.46,0,0,1-1.47-1.46h0v-6.62a1.48,1.48,0,0,1,1.47-1.46h18.35A1.46,1.46,0,0,0,425.36,186.89Z"/><path class="c" d="M377.45,187.32h9.69a1.46,1.46,0,0,0,1.48-1.45h0v-8a1.47,1.47,0,0,0-1.46-1.46h-4.43a1.47,1.47,0,0,0-1.22.66l-5.28,8a1.46,1.46,0,0,0,.42,2A1.48,1.48,0,0,0,377.45,187.32Z"/><rect class="d" x="166.67" y="302.43" width="469.01" height="47.09" rx="4"/><rect class="d" x="166.67" y="358" width="469.01" height="47.09" rx="4"/><rect class="c" x="139.17" y="144.69" width="77.03" height="18.73" rx="4.19"/><circle class="c" cx="612.54" cy="362.24" r="40.25"/><path class="e" d="M616.3,365.44V345.55a1.4,1.4,0,0,0-1.4-1.4h-5.06a1.4,1.4,0,0,0-1.4,1.4v19.89H601a1.4,1.4,0,0,0-1,2.39l12,12a.71.71,0,0,0,1,0l12-12a1.4,1.4,0,0,0-1-2.39Z"/><path class="a" d="M125.43,61.69H674.57a16,16,0,0,1,16,16v31.63a0,0,0,0,1,0,0H109.43a0,0,0,0,1,0,0V77.69A16,16,0,0,1,125.43,61.69Z"/></svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

1
assets/context-menu.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 500"><defs><style>.a{fill:#f1f2f2;}.b,.c,.i{fill:#231f20;}.b{opacity:0.1;}.c,.i{font-size:34.6px;font-family:MyriadPro-Regular, Myriad Pro;}.d{letter-spacing:0em;}.e{letter-spacing:-0.01em;}.f{letter-spacing:-0.01em;}.g{letter-spacing:-0.01em;}.h{fill:none;stroke:#a7a9ac;}.h,.r{stroke-miterlimit:10;}.i{opacity:0.6;}.j{letter-spacing:0em;}.k{letter-spacing:-0.01em;}.l{letter-spacing:-0.02em;}.m{letter-spacing:0em;}.n{letter-spacing:0em;}.o{letter-spacing:-0.01em;}.p{letter-spacing:-0.01em;}.q{letter-spacing:-0.01em;}.r{fill:#fff;stroke:#58595b;stroke-width:4px;}</style></defs><rect class="a" x="194.4" y="28.72" width="411.2" height="442.56" rx="8"/><rect class="b" x="194.4" y="158.46" width="411.2" height="87.94"/><text class="c" transform="translate(242.08 212.19)"><tspan class="d">S</tspan><tspan class="e" x="17.16" y="0">a</tspan><tspan class="f" x="33.56" y="0">v</tspan><tspan x="49.85" y="0">e a</tspan><tspan class="g" x="91.2" y="0">s</tspan><tspan x="104.52" y="0">...</tspan></text><line class="h" x1="194.4" y1="148.42" x2="605.6" y2="148.42"/><text class="i" transform="translate(243.53 108.93)"><tspan class="j">R</tspan><tspan x="18.75" y="0">ef</tspan><tspan class="k" x="46.19" y="0">r</tspan><tspan x="57.15" y="0">esh</tspan></text><text class="i" transform="translate(243.53 314.91)"><tspan class="l">P</tspan><tspan class="m" x="17.85" y="0">r</tspan><tspan x="29.3" y="0">i</tspan><tspan class="n" x="37.4" y="0">n</tspan><tspan x="56.46" y="0">t</tspan></text><text class="i" transform="translate(246.16 407.42)"><tspan class="o">C</tspan><tspan x="19.82" y="0">ast media </tspan><tspan class="p" x="166.79" y="0">t</tspan><tspan x="178.04" y="0">o devi</tspan><tspan class="q" x="265.95" y="0">c</tspan><tspan x="281.24" y="0">e</tspan></text><polygon class="r" points="441.81 257.54 433.06 268.1 412.63 292.77 412.63 207.22 484.5 254.87 459.94 256.4 450.95 256.97 441.81 257.54"/></svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 8.6 KiB

1
assets/missing-piece.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 500"><defs><style>.a{fill:#006838;}.b{fill:#a7a9ac;}.c{fill:#e6e7e8;}.d{fill:#39b54a;}.e{fill:#009444;}.f{fill:#d1d3d4;}.g{fill:#bcbec0;}</style></defs><path class="a" d="M486.39,172.31c-3.11-1.75-6.81-2.19-10-3.81-7.32-3-13.27-9.87-13-16.4l-.07,26.41c-.25,9.3,9.83,16.35,19.13,18.64,3.56.93,8.1,3.74,8,7.39l.08-26.41C490.6,176,489.08,173.86,486.39,172.31Z"/><path class="b" d="M400.78,153.2c-2.81,3.18-7.27,4.27-11.37,4.52-3.71.31-7.26-.76-10.83-1.6a55.92,55.92,0,0,0-21-.11c-10.7,2.08-22.5,7.06-27.32,17.49a14.78,14.78,0,0,0-1.24,5.78l-.08,26.42c.07-6.88,5-12.56,10.49-16.23,10.55-6.94,23.89-9.12,36.29-7.42,3.24.36,6.3,1.56,9.52,1.95a22.39,22.39,0,0,0,11.31-1.44,11.23,11.23,0,0,0,4.19-2.94l24.38-29.44.07-26.42Z"/><path class="c" d="M425.16,123.76,400.78,153.2c-3.4,4.11-11.92,5.7-19,3.69-17.48-4.88-39.12.36-48.49,11.67-7.62,9.2-4.76,19.58,5.91,25.73a36.45,36.45,0,0,0,8.54,3.51,17.8,17.8,0,0,1,4.2,1.7c4.13,2.38,5.5,6.05,2.84,9.26l-24.38,29.45-46.16-12.89c-7.61-2.13-16.7.08-19.34,4.71a15.14,15.14,0,0,1-1.3,1.9c-8.49,10.27-31.08,14-50.64,8.51a51.43,51.43,0,0,1-11.9-4.86c-11-6.32-14.82-15.5-8.46-23.19a20.35,20.35,0,0,1,1.86-1.92c3.79-3.39,2.74-7.61-1.81-10.23a16.46,16.46,0,0,0-3.83-1.58l-56.32-15.73L222.9,73.77c2.41-2.91,8.46-4.14,13.5-2.73Z"/><path class="d" d="M751.15,150.43c3,1.71,3.9,4.39,2,6.7l-90.4,109.16-51.57-14.4a16.37,16.37,0,0,1-3.82-1.57c-4.2-2.42-5.44-6.22-2.6-9.46,6.67-8.05,2.8-17.22-8.15-23.55a51.87,51.87,0,0,0-11.9-4.86c-19.56-5.46-42.14-1.75-50.44,8.27-3.55,4.53-12,6.33-19.15,4.34l-50.27-14,24.37-29.44c2.67-3.22,1.3-6.89-2.83-9.27a17.2,17.2,0,0,0-4.06-1.66,37.28,37.28,0,0,1-8.68-3.54c-10.67-6.16-13.53-16.54-5.9-25.74,9.36-11.31,31-16.55,48.34-11.71,7.23,2.05,15.75.47,19.16-3.65l24.37-29.43,188.76,52.71A12.4,12.4,0,0,1,751.15,150.43Z"/><path class="e" d="M754.09,155.12s0,.09,0,.14a3.38,3.38,0,0,1-.17.6c0,.06-.06.12-.08.18a4.11,4.11,0,0,1-.21.42l-.2.3c-.09.12-.16.25-.26.37h0l-90.4,109.16-51.57-14.4a17.83,17.83,0,0,1-3.19-1.23l0-18.08c0-5.57-4.13-11.05-11.43-15.27-16.32-9.28-45.69-11-60.63,1.61h0a20.59,20.59,0,0,0-1.71,1.79v0c-4.26,4.92-11.67,5.82-17.77,4.66-.46-.1-.92-.21-1.37-.34l-50.27-14-.07,26.42,50.27,14a17.57,17.57,0,0,0,2.06.46c5.91,1,13,0,17.07-4.79a0,0,0,0,0,0,0c14.59-16.09,54.31-13.16,69,1.66L603.15,271c0,2.16,1.47,4.25,4.13,5.79a17.75,17.75,0,0,0,3.82,1.57l51.57,14.4,90.4-109.16h0l.08-.1c.07-.09.12-.18.18-.27a2.61,2.61,0,0,0,.2-.3l0,0a3,3,0,0,0,.17-.37l.09-.18v0a4,4,0,0,0,.16-.57h0c0-.05,0-.1,0-.15a2.71,2.71,0,0,0,0-.41V181l.08-26.42A2.94,2.94,0,0,1,754.09,155.12Z"/><path class="b" d="M473.64,260.55a12.14,12.14,0,0,1-2.53,6.47,11.09,11.09,0,0,0-1.67,2.6,5.45,5.45,0,0,0-.36,1.87L469,297.91c0-3.08,3-5,3.87-7.77a11.44,11.44,0,0,0,.72-3.88l.07-26.42C473.67,260.08,473.65,260.31,473.64,260.55Z"/><path class="f" d="M462.14,244.5c11,6.32,14.83,15.5,8.46,23.19-2.89,3.47-1.5,7.43,2.87,10a17.74,17.74,0,0,0,4,1.65l50.77,14.18L444.15,395.06c-5.89,7.1-20.62,10.08-32.91,6.65L60,303.6a29.43,29.43,0,0,1-6.74-2.76c-7.24-4.18-9.51-10.7-4.85-16.33l84.12-101.57,55.78,15.57a19.7,19.7,0,0,1,3.87,1.45c5.29,2.78,6,7.18,2.35,10.46a17,17,0,0,0-1.68,1.72c-6.59,7.94-2.72,17.11,8.24,23.44a51.69,51.69,0,0,0,11.9,4.87c19.56,5.46,42.14,1.75,50.44-8.28a15,15,0,0,0,1.49-2.12c2.58-4.84,11.52-6.91,19.88-4.58L379.87,252c7.39,2.07,16.33.25,19.86-4,8.37-10.12,30.95-13.82,50.52-8.36A51.34,51.34,0,0,1,462.14,244.5Z"/><path class="g" d="M444.15,395.06c-7.87,8.53-22.24,9.43-32.91,6.65L60,303.6a33.56,33.56,0,0,1-3.38-1.15,29.67,29.67,0,0,1-3.36-1.61c-4.69-2.71-7.29-6.4-7.28-10.19l-.08,26.42c-.18,6.3,7.63,11.37,14,12.94,2.44.6,351.44,98.33,353.72,98.71a42.29,42.29,0,0,0,15.66.18c4.9-.94,9.83-2.68,13.55-6.09a15.67,15.67,0,0,0,1.26-1.33L528.19,319.9l.08-26.42Z"/></svg>

After

Width:  |  Height:  |  Size: 3.7 KiB

View File

@ -332,7 +332,7 @@ ul {
display: grid;
gap: 0.5rem;
width: 100%;
padding: 1rem 1.5rem;
padding: 0 1.5rem 0 0.5rem;
align-items: center;
grid-template-columns: auto 1fr;
}
@ -800,10 +800,6 @@ sm-option {
}
@media only screen and (max-width: 640px) {
.popup__header {
padding: 0 1.5rem 0 0.5rem;
}
.torrent-card {
grid-template-columns: 1fr;
}

2
css/main.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -280,7 +280,7 @@ ul{
display: grid;
gap: 0.5rem;
width: 100%;
padding: 1rem 1.5rem;
padding: 0 1.5rem 0 0.5rem;
align-items: center;
grid-template-columns: auto 1fr;
}
@ -720,9 +720,6 @@ sm-option{
background-color: rgba(var(--text-color), 0.06);
}
@media only screen and (max-width: 640px) {
.popup__header{
padding: 0 1.5rem 0 0.5rem;
}
.torrent-card{
grid-template-columns: 1fr;
&__icon{

File diff suppressed because it is too large Load Diff

View File

@ -280,6 +280,24 @@
</p>
</div>
</section>
<section class="info-section">
<object class="info__image" data="assets/missing-piece.svg" type="image/svg+xml"></object>
<div class="textual-info">
<h2 class="info__title h2">But why?</h2>
<p>
This solution decentralises storage of Torrent files which was the last missing piece in decentralisation of torrent ecosystem. After this the entire chain of torrent ecosystem is decentralised.
</p>
</div>
</section>
<section class="info-section">
<object class="info__image" data="assets/context-menu.svg" type="image/svg+xml"></object>
<div class="textual-info">
<h2 class="info__title h2">What if we get blocked?</h2>
<p>
No worries, this app is comletely contained within single HTML file so even if the site URL is blocked if you saved this webpage as HTML file it will work seamlessly.
</p>
</div>
</section>
</section>
</main>
<footer id="main_footer" class="page-layout">