UI update
Added timeline for bitcoin bonds and bobd fund
This commit is contained in:
sairaj mote
parent
c7980ebd1a
commit
ad37f94085
1
assets/illustrations/buy-colored.svg
Normal file
1
assets/illustrations/buy-colored.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="f469aee4-48cf-47a1-ab24-824bf0e16c09" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><defs><style>.ea077717-9bfb-4d25-9505-ac6b337e749a{fill:#2bb673;}.f3c74d86-25a6-4ab3-89d2-d4531129e5a1{fill:#1c75bc;}</style></defs><path d="M45.64,36.24A14,14,0,1,1,29.12,53.39h0a15.53,15.53,0,0,1-.41-2.5c0-.3,0-.61,0-.92A14,14,0,0,1,42.2,36h0l.27,0h.27c.29,0,.57,0,.86,0l.61.05a13.73,13.73,0,0,1,1.43.23ZM53.44,50a10.71,10.71,0,1,0-10.7,10.7A10.71,10.71,0,0,0,53.44,50Z"/><path class="ea077717-9bfb-4d25-9505-ac6b337e749a" d="M42.74,39.27A10.7,10.7,0,1,1,32,50,10.71,10.71,0,0,1,42.74,39.27Zm5.69,8.86a1.66,1.66,0,0,0-2.35-2.35l-4.85,4.85-1.84-1.84A1.67,1.67,0,0,0,37,51.15l3,3a1.69,1.69,0,0,0,1.18.49,1.67,1.67,0,0,0,1.17-.49Z"/><path d="M48.43,45.78a1.66,1.66,0,0,1,0,2.35l-6,6a1.67,1.67,0,0,1-1.17.49,1.69,1.69,0,0,1-1.18-.49l-3-3a1.67,1.67,0,0,1,2.35-2.36l1.84,1.84,4.85-4.85A1.66,1.66,0,0,1,48.43,45.78Z"/><path d="M45.64,36.24h0A13.73,13.73,0,0,0,44.21,36,13.71,13.71,0,0,1,45.64,36.24Z"/><path d="M44.54,11.45l1.1,24.79A13.71,13.71,0,0,0,44.21,36L43.6,36c-.29,0-.57,0-.86,0h-.27a1.22,1.22,0,0,0-.27,0l-.94-21.08H36.42V17.8a1.71,1.71,0,1,1-3.42,0V14.88H20.33V17.8a1.71,1.71,0,1,1-3.42,0V14.88H12.06l-1.4,31.51A3.43,3.43,0,0,0,14.08,50H28.7c0,.31,0,.62,0,.92a14.49,14.49,0,0,0,.39,2.5h-15a6.85,6.85,0,0,1-6.84-7.15L8.79,11.45h8.12V9.76a9.76,9.76,0,1,1,19.51,0v1.69ZM33,11.45V9.76a6.34,6.34,0,1,0-12.67,0v1.69Z"/><path d="M44.21,36,43.6,36Z"/><path d="M42.47,36l-.27,0h0A1.22,1.22,0,0,1,42.47,36Z"/><path class="f3c74d86-25a6-4ab3-89d2-d4531129e5a1" d="M41.26,14.88,42.2,36A14,14,0,0,0,28.7,50H14.08a3.43,3.43,0,0,1-3.42-3.58l1.4-31.51h4.85V17.8a1.71,1.71,0,1,0,3.42,0V14.88H33V17.8a1.71,1.71,0,1,0,3.42,0V14.88Z"/><path d="M29.14,53.39h0a14.49,14.49,0,0,1-.39-2.5A15.53,15.53,0,0,0,29.14,53.39Z"/></svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
1
assets/illustrations/performance-colored.svg
Normal file
1
assets/illustrations/performance-colored.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="fe165ccb-819f-44fe-a6b3-1b2f8bba4e71" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><defs><style>.f152b250-bb5e-4860-9b08-fa2972c793cc{fill:#1c75bc;}.a8973876-db07-4574-97ed-d5b4aa4f88a8{fill:#e6e7e8;}.a114310d-42a5-4a3a-9def-a38164831dcd{fill:#be1e2d;}</style></defs><path class="f152b250-bb5e-4860-9b08-fa2972c793cc" d="M60.56,3.41a1.81,1.81,0,0,1,.5,1.66L59,15.68,48.28,5,58.89,2.9A1.82,1.82,0,0,1,60.56,3.41Z"/><path class="a8973876-db07-4574-97ed-d5b4aa4f88a8" d="M49.6,14.36a7.17,7.17,0,1,0,0,10.14A7.19,7.19,0,0,0,49.6,14.36Zm-4.67-8.7L58.3,19a11.64,11.64,0,0,1-3,5.38l-18,18-9,9-7.85-7.86-5.31-5.3h0l-2.55-2.54,27-27A11.72,11.72,0,0,1,44.93,5.66Z"/><path d="M47.57,22.48a4.31,4.31,0,1,0-6.09,0A4.31,4.31,0,0,0,47.57,22.48Zm-3,4.12a7.17,7.17,0,1,1,5.07-2.1A7.14,7.14,0,0,1,44.53,26.6Z"/><path class="a114310d-42a5-4a3a-9def-a38164831dcd" d="M35.67,48.05l-1.09,4.38A5.89,5.89,0,0,1,33,55.19l-3.74,3.73.25-4.74Z"/><polygon class="f152b250-bb5e-4860-9b08-fa2972c793cc" points="22.95 50.18 21.04 54.05 9.91 42.92 13.78 41.01 22.95 50.18"/><path class="a114310d-42a5-4a3a-9def-a38164831dcd" d="M16,28.21,10.23,34l-.37.37-4.74.25,3.73-3.73a5.82,5.82,0,0,1,2.76-1.56Z"/><path d="M9.74,60.32l4.06-4.07a1.43,1.43,0,0,1,2,2l-4.06,4.06a1.43,1.43,0,0,1-1,.42,1.43,1.43,0,0,1-1-2.44Z"/><path d="M61.06,5.07A1.85,1.85,0,0,0,58.89,2.9L48.28,5,59,15.68ZM34.58,52.43l1.09-4.38-6.13,6.13-.25,4.74L33,55.19A5.89,5.89,0,0,0,34.58,52.43ZM44.93,5.66a11.72,11.72,0,0,0-5.38,3l-27,27,2.55,2.54h0l5.31,5.3,7.85,7.86,9.05-9,18-18a11.64,11.64,0,0,0,3-5.38ZM6.82,28.83a8.75,8.75,0,0,1,4.1-2.31l9-2.23L37.53,6.67a14.61,14.61,0,0,1,7.56-4L58.35.09a4.7,4.7,0,0,1,5.52,5.52L61.3,18.87a14.5,14.5,0,0,1-4,7.56l-17.7,17.7-2.23,9a8.75,8.75,0,0,1-2.31,4.1l-6.37,6.36a1.44,1.44,0,0,1-1,.42,1.51,1.51,0,0,1-.58-.12,1.43,1.43,0,0,1-.85-1.38l.45-8.58-1.61-1.6-2.35,4.79a1.47,1.47,0,0,1-1.05.78l-.24,0a1.44,1.44,0,0,1-1-.42l-14-14a1.43,1.43,0,0,1,.38-2.3l4.79-2.35L10,37.2l-8.42.44H1.47a1.43,1.43,0,0,1-1-2.44Zm3,5.51.37-.37L16,28.21,11.61,29.3a5.82,5.82,0,0,0-2.76,1.56L5.12,34.59Zm.05,8.58L21,54.05,23,50.18,13.78,41Z"/><path d="M3.65,54.22a1.43,1.43,0,0,1-2-2l4.07-4.06a1.43,1.43,0,0,1,2,2Z"/><path d="M9.74,52.19a1.44,1.44,0,0,1,2,2L3.64,62.35a1.42,1.42,0,0,1-1,.41,1.41,1.41,0,0,1-1-.41,1.44,1.44,0,0,1,0-2Z"/></svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
1
assets/illustrations/product-colored.svg
Normal file
1
assets/illustrations/product-colored.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg id="e2be35ec-37fd-4ab3-ae15-c08124ef196e" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><defs><style>.e1c2c52a-5c8a-4b5f-9adf-cd02529a43a8{fill:#be8b4b;}.bc0efa59-0bb5-4950-a8d8-c4c13160c4c6{fill:#af7331;}.a9a55a04-ffc1-4b71-900b-56f64d39848e{fill:#cd9f61;}</style></defs><polygon class="e1c2c52a-5c8a-4b5f-9adf-cd02529a43a8" points="25.55 7.96 24.67 20.57 6.36 20.57 8.46 7.96 25.55 7.96"/><polygon class="bc0efa59-0bb5-4950-a8d8-c4c13160c4c6" points="35.15 7.96 35.97 20.57 28.04 20.57 28.91 7.96 35.15 7.96"/><polygon class="e1c2c52a-5c8a-4b5f-9adf-cd02529a43a8" points="55.54 7.96 57.64 20.57 39.34 20.57 38.51 7.96 55.54 7.96"/><path class="bc0efa59-0bb5-4950-a8d8-c4c13160c4c6" d="M36.08,23.93v6.64L33,28.41a1.7,1.7,0,0,0-1.9,0l-3.13,2.16V23.93Z"/><path class="a9a55a04-ffc1-4b71-900b-56f64d39848e" d="M57.94,23.93V56H6.06V23.93h18.5v9.84a1.67,1.67,0,0,0,2.63,1.38L32,31.84l4.81,3.31a1.65,1.65,0,0,0,.95.3,1.76,1.76,0,0,0,.78-.19,1.68,1.68,0,0,0,.9-1.49V23.93Z"/><path d="M61.3,22.25V57.72a1.68,1.68,0,0,1-1.68,1.68H4.38A1.68,1.68,0,0,1,2.7,57.72V22.25c0-.05,0-.09,0-.14s0-.09,0-.14L5.38,6A1.68,1.68,0,0,1,7,4.6H57A1.68,1.68,0,0,1,58.62,6l2.66,16c0,.05,0,.09,0,.14S61.3,22.2,61.3,22.25ZM57.94,56V23.93H39.44v9.84a1.68,1.68,0,0,1-.9,1.49,1.76,1.76,0,0,1-.78.19,1.65,1.65,0,0,1-.95-.3L32,31.84l-4.81,3.31a1.67,1.67,0,0,1-2.63-1.38V23.93H6.06V56Zm-.3-35.47L55.54,8h-17l.83,12.61Zm-21.56,10V23.93H27.92v6.64l3.13-2.16a1.7,1.7,0,0,1,1.9,0Zm-.11-10L35.15,8H28.91L28,20.57Zm-11.3,0L25.55,8H8.46L6.36,20.57Z"/></svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
@ -47,43 +47,46 @@
|
||||
</header>
|
||||
<div id="outlet_switcher" class="grid gap-1-5 hide-completely">
|
||||
<div class="flex align-center">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24"
|
||||
<!-- <svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24"
|
||||
height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M21 13.242V20h1v2H2v-2h1v-6.758A4.496 4.496 0 0 1 1 9.5c0-.827.224-1.624.633-2.303L4.345 2.5a1 1 0 0 1 .866-.5H18.79a1 1 0 0 1 .866.5l2.702 4.682A4.496 4.496 0 0 1 21 13.242zm-2 .73a4.496 4.496 0 0 1-3.75-1.36A4.496 4.496 0 0 1 12 14.001a4.496 4.496 0 0 1-3.25-1.387A4.496 4.496 0 0 1 5 13.973V20h14v-6.027zM5.789 4L3.356 8.213a2.5 2.5 0 0 0 4.466 2.216c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 0 0 4.644 0c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 1 0 4.457-2.232L18.21 4H5.79z" />
|
||||
</svg>
|
||||
</svg> -->
|
||||
<span id="outlet_switcher__floor_num" class="weight-500 color-0-8"></span>
|
||||
<button class="justify-right" onclick="hideOutletSwitcher()">
|
||||
<!-- <button class="justify-right" onclick="hideOutletSwitcher()">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-11.414L9.172 7.757 7.757 9.172 10.586 12l-2.829 2.828 1.415 1.415L12 13.414l2.828 2.829 1.415-1.415L13.414 12l2.829-2.828-1.415-1.415L12 10.586z" />
|
||||
</svg>
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
<section id="outlet_switcher__outlet_container" class="outlet_switcher__floor flex align-center"></section>
|
||||
<section id="outlet_switcher__outlet_container" class="outlet_switcher__floor"></section>
|
||||
</div>
|
||||
<main class="page">
|
||||
<section class="outlet-hero-section margin-bottom-3r">
|
||||
<div class="grid">
|
||||
<h2 class="h2 weight-700 margin-bottom-2r">Bitcoin Bonds</h2>
|
||||
<h4 class="margin-bottom-1r">How does it work?</h4>
|
||||
<p class="margin-bottom-3r">
|
||||
Bondholders get a minimum guarantee of 13% interest per annum during the lock-in period or 50% of all Bitcoin price gains whichever is higher.
|
||||
It offers full capital protection if Bitcoin prices fall below acquisition price.
|
||||
</p>
|
||||
</div>
|
||||
<button class="outlet-label">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<!-- <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M21 13.242V20h1v2H2v-2h1v-6.758A4.496 4.496 0 0 1 1 9.5c0-.827.224-1.624.633-2.303L4.345 2.5a1 1 0 0 1 .866-.5H18.79a1 1 0 0 1 .866.5l2.702 4.682A4.496 4.496 0 0 1 21 13.242zm-2 .73a4.496 4.496 0 0 1-3.75-1.36A4.496 4.496 0 0 1 12 14.001a4.496 4.496 0 0 1-3.25-1.387A4.496 4.496 0 0 1 5 13.973V20h14v-6.027zM5.789 4L3.356 8.213a2.5 2.5 0 0 0 4.466 2.216c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 0 0 4.644 0c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 1 0 4.457-2.232L18.21 4H5.79z" />
|
||||
</svg>
|
||||
</svg> -->
|
||||
<span class="outlet-label__name">Outlet</span>
|
||||
<span class="outlet-label__no">Outlet</span>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path d="M12 13.172l4.95-4.95 1.414 1.414L12 16 5.636 9.636 7.05 8.222z" />
|
||||
</svg>
|
||||
</button>
|
||||
<h2 class="h2 weight-700 margin-bottom-2r">Bitcoin Bonds</h2>
|
||||
<h4 class="margin-bottom-1r">How does it work?</h4>
|
||||
<p class="margin-bottom-3r">
|
||||
Bondholders get a minimum guarantee of 13% interest per annum during the lock-in period or 50% of all Bitcoin price gains whichever is higher.
|
||||
It offers full capital protection if Bitcoin prices fall below acquisition price.
|
||||
</p>
|
||||
</section>
|
||||
<header class="rooms__header">
|
||||
<h4 class="room__label">Rooms</h4>
|
||||
@ -93,7 +96,6 @@
|
||||
<a class="room-tile room-tile--main" href="#performance_room">
|
||||
<div class="tile-content">
|
||||
<svg class="room-tile__icon" id="b23be00b-0d64-4bed-9d99-6f7aaf421af4" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M44.53,26.6a7.17,7.17,0,1,1,5.07-2.1h0A7.16,7.16,0,0,1,44.53,26.6Zm0-11.47a4.31,4.31,0,1,0,3,1.26A4.31,4.31,0,0,0,44.53,15.13Z"/><path d="M62.58,1.38A4.7,4.7,0,0,0,58.35.09L45.09,2.66a14.61,14.61,0,0,0-7.56,4L19.92,24.29l-9,2.23a8.75,8.75,0,0,0-4.1,2.31L.46,35.2a1.43,1.43,0,0,0,1,2.44h.08L10,37.2l1.67,1.68L6.85,41.23a1.43,1.43,0,0,0-.38,2.3l14,14a1.44,1.44,0,0,0,1,.42l.24,0a1.47,1.47,0,0,0,1.05-.78l2.35-4.79,1.61,1.6-.45,8.58a1.43,1.43,0,0,0,.85,1.38,1.51,1.51,0,0,0,.58.12,1.44,1.44,0,0,0,1-.42l6.37-6.36a8.75,8.75,0,0,0,2.31-4.1l2.23-9,17.7-17.7a14.5,14.5,0,0,0,4-7.56L63.87,5.61A4.7,4.7,0,0,0,62.58,1.38ZM21,54.05,9.91,42.92,13.78,41,23,50.18ZM8.85,30.86a5.82,5.82,0,0,1,2.76-1.56L16,28.21,10.23,34l-.37.37-4.74.25ZM34.58,52.43A5.89,5.89,0,0,1,33,55.19l-3.74,3.73.25-4.74,6.13-6.13Zm20.68-28-18,18h0l-9,9-7.85-7.86-5.31-5.3h0l-2.55-2.54,27-27a11.72,11.72,0,0,1,5.38-3L58.3,19A11.64,11.64,0,0,1,55.26,24.41Zm5.8-19.34L59,15.68,48.28,5,58.89,2.9a1.85,1.85,0,0,1,2.17,2.17Z"/><path d="M2.63,62.76a1.41,1.41,0,0,1-1-.41,1.44,1.44,0,0,1,0-2l8.12-8.13a1.44,1.44,0,0,1,2,2L3.64,62.35A1.42,1.42,0,0,1,2.63,62.76Z"/><path d="M10.75,62.76a1.43,1.43,0,0,1-1-2.44l4.06-4.07a1.43,1.43,0,0,1,2,2l-4.06,4.06A1.43,1.43,0,0,1,10.75,62.76Z"/><path d="M2.63,54.64a1.43,1.43,0,0,1-1-2.44l4.07-4.06a1.43,1.43,0,0,1,2,2L3.65,54.22A1.44,1.44,0,0,1,2.63,54.64Z"/></svg>
|
||||
<!-- <img class="room-tile__icon" src="./assets/illustrations/performance.svg" alt=""> -->
|
||||
<h4 class="room-tile__title">Performance</h4>
|
||||
</div>
|
||||
</a>
|
||||
@ -106,7 +108,6 @@
|
||||
<a class="room-tile" href="#purchase_room">
|
||||
<div class="tile-content">
|
||||
<svg class="room-tile__icon" id="bb329e59-3d30-49a7-ac0d-b164d3b3b631" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M42.74,64a14,14,0,1,1,14-14A14,14,0,0,1,42.74,64Zm0-24.73A10.7,10.7,0,1,0,53.44,50,10.71,10.71,0,0,0,42.74,39.27Z"/><path d="M28.7,50H14.08a3.43,3.43,0,0,1-3.42-3.58l1.4-31.51h4.85V17.8a1.71,1.71,0,1,0,3.42,0V14.88H33V17.8a1.71,1.71,0,1,0,3.42,0V14.88h4.84L42.2,36c.18,0,.35,0,.54,0a13.92,13.92,0,0,1,2.9.31l-1.1-24.8H36.42V9.76a9.76,9.76,0,1,0-19.51,0v1.69H8.79L7.24,46.24a6.85,6.85,0,0,0,6.84,7.15H29.14A14.24,14.24,0,0,1,28.7,50ZM20.33,9.76A6.34,6.34,0,1,1,33,9.76v1.69H20.33Z"/><path d="M41.23,54.65a1.69,1.69,0,0,1-1.18-.49l-3-3a1.67,1.67,0,0,1,2.35-2.36l1.84,1.84,4.85-4.85a1.66,1.66,0,0,1,2.35,2.35l-6,6A1.67,1.67,0,0,1,41.23,54.65Z"/></svg>
|
||||
<!-- <img class="room-tile__icon" src="./assets/illustrations/purchase.svg" alt=""> -->
|
||||
<h4 class="room-tile__title">Buy</h4>
|
||||
</div>
|
||||
</a>
|
||||
@ -121,7 +122,8 @@
|
||||
<h1 id="hero_title"></h1>
|
||||
<section class="room-carousel">
|
||||
<section id="performance_room" class="grid room">
|
||||
<div id="bit_bond_series__container" class="grid series-container"></div>
|
||||
<p>Bitcoin bonds different series release timeline</p>
|
||||
<ul id="bit_bond_series__container" class="timeline-container"></ul>
|
||||
</section>
|
||||
<section id="product_room" class="grid room">
|
||||
<h4 class="h4 margin-bottom-1r">Description of different bonds</h4>
|
||||
@ -232,7 +234,7 @@
|
||||
The purchase of this product is open only during specified time when we are confident we can
|
||||
give guarantees. It was last open from February 2017 to June 2017.Currently we are doing blockchain
|
||||
version of the product in test mode.If you are interested, please generate your FLO ID while keeping
|
||||
your private key very safe.FLO ID can be generated <a href="https://ranchimall.github.io/flo-webwallet/">here</a> in a single click.We can message
|
||||
your private key very safe.FLO ID can be generated <a href="https://ranchimall.github.io/flo-webwallet/" target="_blank">here</a> in a single click.We can message
|
||||
directly on that FLO ID. Please drop your name and phone number along with FLO ID.
|
||||
</p>
|
||||
</section>
|
||||
@ -340,7 +342,7 @@
|
||||
const frag = document.createDocumentFragment()
|
||||
getRef('bit_bond_series__container').innerHTML = ''
|
||||
bitBondSerieses.forEach((series, index) => {
|
||||
const [currentValue, percentGain] = calcNetValue(series.series, series.startDate, 0.13, 5, 0.5, 6400, 64)
|
||||
const [currentValue, percentGain] = calcNetValue(series.series, series.startDate, 0.13, 5, 0.5, 100, 64)
|
||||
const obj = {
|
||||
series: series.series,
|
||||
percentGain,
|
||||
@ -348,7 +350,15 @@
|
||||
currentValue,
|
||||
percentGain: percentGain.toFixed(0)
|
||||
}
|
||||
frag.append(render.bitBondRow(obj))
|
||||
const timelineItem = document.createElement('li')
|
||||
timelineItem.classList.add('timeline-item')
|
||||
|
||||
const tilelineItemHeader = document.createElement('header')
|
||||
tilelineItemHeader.classList.add('timeline-item__header')
|
||||
tilelineItemHeader.textContent = getFormatedTime(series.startDate, true)
|
||||
|
||||
timelineItem.append(tilelineItemHeader, render.bitBondRow(obj))
|
||||
frag.prepend(timelineItem)
|
||||
})
|
||||
getRef('bit_bond_series__container').append(frag)
|
||||
}
|
||||
|
||||
470
bob'sfund.html
470
bob'sfund.html
@ -55,38 +55,41 @@
|
||||
</section>
|
||||
<div id="outlet_switcher" class="grid gap-1-5 hide-completely">
|
||||
<div class="flex align-center">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24"
|
||||
<!-- <svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24"
|
||||
height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M21 13.242V20h1v2H2v-2h1v-6.758A4.496 4.496 0 0 1 1 9.5c0-.827.224-1.624.633-2.303L4.345 2.5a1 1 0 0 1 .866-.5H18.79a1 1 0 0 1 .866.5l2.702 4.682A4.496 4.496 0 0 1 21 13.242zm-2 .73a4.496 4.496 0 0 1-3.75-1.36A4.496 4.496 0 0 1 12 14.001a4.496 4.496 0 0 1-3.25-1.387A4.496 4.496 0 0 1 5 13.973V20h14v-6.027zM5.789 4L3.356 8.213a2.5 2.5 0 0 0 4.466 2.216c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 0 0 4.644 0c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 1 0 4.457-2.232L18.21 4H5.79z" />
|
||||
</svg>
|
||||
</svg> -->
|
||||
<span id="outlet_switcher__floor_num" class="weight-500 color-0-8"></span>
|
||||
<button class="justify-right" onclick="hideOutletSwitcher()">
|
||||
<!-- <button class="justify-right" onclick="hideOutletSwitcher()">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-11.414L9.172 7.757 7.757 9.172 10.586 12l-2.829 2.828 1.415 1.415L12 13.414l2.828 2.829 1.415-1.415L13.414 12l2.829-2.828-1.415-1.415L12 10.586z" />
|
||||
</svg>
|
||||
</button>
|
||||
</button> -->
|
||||
</div>
|
||||
<section id="outlet_switcher__outlet_container" class="outlet_switcher__floor flex align-center"></section>
|
||||
<section id="outlet_switcher__outlet_container" class="outlet_switcher__floor"></section>
|
||||
</div>
|
||||
<main class="page">
|
||||
<section class="outlet-hero-section margin-bottom-3r">
|
||||
<div class="grid">
|
||||
<h2 class="h2 weight-700 margin-bottom-1r">Bob's Fund</h2>
|
||||
<p>
|
||||
Bobs Fund is a 20 year long term Bitcoin price linked product. Investors are entitled to 100 percent
|
||||
of Bitcoin price gains, but they most hold for 20 years. Over a very long time period, investor returns
|
||||
on an asset like Bitcoin should outstrip returns on conventional assets like real estate and stocks. The
|
||||
management fees on this product is zero. RanchiMall earns by having invested an equal amount as
|
||||
every investor, thus the interests of fund manager, and fund investors are totally aligned.
|
||||
</p>
|
||||
</div>
|
||||
<button class="outlet-label">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M21 13.242V20h1v2H2v-2h1v-6.758A4.496 4.496 0 0 1 1 9.5c0-.827.224-1.624.633-2.303L4.345 2.5a1 1 0 0 1 .866-.5H18.79a1 1 0 0 1 .866.5l2.702 4.682A4.496 4.496 0 0 1 21 13.242zm-2 .73a4.496 4.496 0 0 1-3.75-1.36A4.496 4.496 0 0 1 12 14.001a4.496 4.496 0 0 1-3.25-1.387A4.496 4.496 0 0 1 5 13.973V20h14v-6.027zM5.789 4L3.356 8.213a2.5 2.5 0 0 0 4.466 2.216c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 0 0 4.644 0c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 1 0 4.457-2.232L18.21 4H5.79z"/></svg>
|
||||
<!-- <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M21 13.242V20h1v2H2v-2h1v-6.758A4.496 4.496 0 0 1 1 9.5c0-.827.224-1.624.633-2.303L4.345 2.5a1 1 0 0 1 .866-.5H18.79a1 1 0 0 1 .866.5l2.702 4.682A4.496 4.496 0 0 1 21 13.242zm-2 .73a4.496 4.496 0 0 1-3.75-1.36A4.496 4.496 0 0 1 12 14.001a4.496 4.496 0 0 1-3.25-1.387A4.496 4.496 0 0 1 5 13.973V20h14v-6.027zM5.789 4L3.356 8.213a2.5 2.5 0 0 0 4.466 2.216c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 0 0 4.644 0c.335-.837 1.52-.837 1.856 0a2.5 2.5 0 1 0 4.457-2.232L18.21 4H5.79z"/></svg> -->
|
||||
<span class="outlet-label__name">Outlet</span>
|
||||
<span class="outlet-label__no">Outlet</span>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 13.172l4.95-4.95 1.414 1.414L12 16 5.636 9.636 7.05 8.222z"/></svg>
|
||||
</button>
|
||||
<h2 class="h2 weight-700 margin-bottom-1r">Bob's Fund</h2>
|
||||
<p>
|
||||
Bobs Fund is a 20 year long term Bitcoin price linked product. Investors are entitled to 100 percent
|
||||
of Bitcoin price gains, but they most hold for 20 years. Over a very long time period, investor returns
|
||||
on an asset like Bitcoin should outstrip returns on conventional assets like real estate and stocks. The
|
||||
management fees on this product is zero. RanchiMall earns by having invested an equal amount as
|
||||
every investor, thus the interests of fund manager, and fund investors are totally aligned.
|
||||
</p>
|
||||
</section>
|
||||
<div class="rooms__header">
|
||||
<h4 class="room__label">Rooms</h4>
|
||||
@ -124,7 +127,8 @@
|
||||
<h1 id="hero_title"></h1>
|
||||
<section class="room-carousel">
|
||||
<section id="performance_room" class="grid room">
|
||||
<div id="bob_fund_investors__container" class="grid series-container series-container--bobs-fund"></div>
|
||||
<p>Bobs fund different fund release timeline</p>
|
||||
<ul id="bobs_fund_timeline" class="timeline-container"></ul>
|
||||
</section>
|
||||
<section id="product_room" class="grid room">
|
||||
<p class="margin-bottom-3r">
|
||||
@ -180,168 +184,224 @@
|
||||
<script>
|
||||
const bobFund = [
|
||||
{
|
||||
investorName: 'Amit gupta',
|
||||
invested: 20000,
|
||||
release: 1497970979000,
|
||||
investors: [
|
||||
{
|
||||
investorName: 'Amit gupta',
|
||||
floId: 'FRvaLurkpLNZiADR6aypDuBXjHAXymvoW3',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Vijay sarda',
|
||||
floId: 'FEt4wGCf5aXQvNRju1QyzcXBc21nETSX1H',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Vijesh Raikar',
|
||||
floId: 'FPDdVVeuZv6b8rk8PexTXPMzvKiZ5yRmy2',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Ajit Varshney',
|
||||
floId: 'FCPVSrEB38GeLC75ELXhF853kCMWwVRHQB',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'barun Kumar',
|
||||
floId: 'FTS3FXu8kWHeFbd1V22w2D6P5BYYzEW8i',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Kunal Dikshit',
|
||||
floId: 'FLg6BZejmHdmaKrk9tcwY3i3vHbmMnjBT5',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sundeep Pandey',
|
||||
floId: 'FPB1mtZmMX9dt7XAzBFx27sSyTSi7JNMrj',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Kusumakar Dwivedi',
|
||||
floId: 'F87CMLVrGABco1zLyUiQCPq51QroHkABG9',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Surojeet Sengupta',
|
||||
floId: 'FR6Qh9Szecx3FPNeoo9zWcmAEtuAMbkrFi',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Akash Srivastava',
|
||||
floId: 'FDDtLLE61MKxheSyEHfAvwoD52nwGB98ep',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'V Jayaram',
|
||||
floId: 'FQf65GctPRu1zRHgFk5ynWTjwQeENymPKB',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Mayank Agrawal',
|
||||
floId: 'FQf65GctPRu1zRHgFk5ynWTjwQeENymPKB',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Bhaskar Bhowmik',
|
||||
floId: 'FUN9oiUUB2ueV59DytRyrKv8sBdVH7Jrck',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Rajesh Agrawal',
|
||||
floId: 'FNrovxYR3ZPXcu3LjYiPgj7waDzYiJ9YsA',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Chetan Kulkarni',
|
||||
floId: 'FTDmpz96L3iqc4CrhLW1csjmTVJXV3TT9L',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Amar More',
|
||||
floId: 'FNojhvoi4aaGYK2LZ4ReCGSh5vk7tzZsqt',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Navin Chandiramani',
|
||||
floId: 'F95teUSvUDsyjVju9r9RC4MEJaz9pYNnVH',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Gopal Krishnamurthy',
|
||||
floId: 'F8uYrqM6RuXg7BvypYtZgkADG6YjkrYMZt',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Shivi',
|
||||
floId: 'FBroPjNntF654rQD1niPmzxPEgPEu5L6nZ',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Shankar RS',
|
||||
floId: 'FKENY1WnX4F3CD5NHcidP43sXknxDcfhTA',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Vikram Gupta',
|
||||
floId: 'FKGePGRroHkfcy8yJ4MzNG844uaA2na8Qs',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Rohit Tripathy',
|
||||
floId: 'FGoveDyLJ9MqCvEZXPCHqnkYQzDwLpD8Ue',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'P. Unnikrishnan',
|
||||
floId: 'FN7ih46Qtcv4darXvbBAXAdV1GLkir8uQt',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Arup Vithal',
|
||||
floId: 'FEx6ZLhL5ehpK3jw62DtvG9Mn4L2dzD6mx',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Rahul Pundir',
|
||||
floId: 'FN61MLKRmGiv46TPbXM71Gs91oAF2YDsyn',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Ankur Jain',
|
||||
floId: 'F9fnJrRGHMXsPMHN2eg3oEammcsX7H4J9m',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Pankaj Shete',
|
||||
floId: 'FDzWseokR2jNP8wC9o4qz8pZ22qwrfXWPQ',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sameer Nagpal',
|
||||
floId: 'FS4DLEj6V4FAdsju4CFGhPMqmVoPMAVRgF',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'George Abraham',
|
||||
floId: 'FBfujtTZfu2GPqPwmbxwevSKkLx7hcFj5R',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Samujjwal Ghosh',
|
||||
floId: 'FBtDjYZXM6vNgfbGSGvg7xL8U1bfN5iNAF',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Aniruddha Karnataki',
|
||||
floId: 'FK8nvFGfUYaGNpTbhG6MKBDBa888Bnn4on',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Mohammed Raffe Samathu',
|
||||
floId: 'FMHVLffKLVvGRwedkTeSu9a2DBGupdiEtC',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Ruchir Gupta',
|
||||
floId: 'FALfZbEtu16ATSEmmY7wwtRbMXUBakPMDy',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Santosh Nair',
|
||||
floId: 'FFCHQExESgbzfKeDpm7oghEarHd8XETcwg',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Samit Arora',
|
||||
floId: 'FFJzBT7Xio7XZHoBCvCKZBtimZJtgPcWih',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sumeet Doshi',
|
||||
floId: 'F7kJpgo3fhVahu387JT9hUKQZRUsxYhqcc',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Pradeep Rao',
|
||||
floId: 'FCqr6r6dvKwK1NCqdQomB9kMhvSjWj4BUL',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Gaurav Sadhir',
|
||||
floId: 'FKm7PvnG377tWCsWAJjHqqDoUKiMBdAfg9',
|
||||
invested: 14000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sudhanshu Fadnis',
|
||||
floId: 'FDvNAjNQ1uR1 JsADYNMwFjkiY2vKECnJRV',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Natesh Rao',
|
||||
floId: 'FTB3Vi6Nj6hoFUwiQMadmkjq2M3FpMoe5T',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Kapil Chaturvedi',
|
||||
floId: 'FMG2tashYXZeApqMtikYm4Uck8UxMdxpUZ',
|
||||
invested: 6000,
|
||||
},
|
||||
{
|
||||
investorName: 'Puneet Sondh',
|
||||
floId: 'FTWGujfMdvGNqgMRveXvg93MCn4dUKEHzV',
|
||||
invested: 20000,
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
investorName: 'Vijay sarda',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Vijesh Raikar',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Ajit Varshney',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'barun Kumar',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Kunal Dikshit',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sundeep Pandey',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Kusumakar Dwivedi',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Surojeet Sengupta',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Akash Srivastava',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'V Jayaram',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Mayank Agrawal',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Bhaskar Bhowmik',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Rajesh Agrawal',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Chetan Kulkarni',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Amar More',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Navin Chandiramani',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Gopal Krishnamurthy',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Shivi',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Shankar RS',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Vikram Gupta',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Rohit Tripathy',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'P. Unnikrishnan',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Arup Vithal',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Rahul Pundir',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Ankur Jain',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Pankaj Shete',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sameer Nagpal',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'George Abraham',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Samujjwal Ghosh',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Aniruddha Karnataki',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Mohammed Raffe Samathu',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Ruchir Gupta',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Santosh Nair',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Samit Arora',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sumeet Doshi',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Pradeep Rao',
|
||||
invested: 10000,
|
||||
},
|
||||
{
|
||||
investorName: 'Gaurav Sadhir',
|
||||
invested: 14000,
|
||||
},
|
||||
{
|
||||
investorName: 'Sudhanshu Fadnis',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Natesh Rao',
|
||||
invested: 20000,
|
||||
},
|
||||
{
|
||||
investorName: 'Kapil Chaturvedi',
|
||||
invested: 6000,
|
||||
release: 1622041379000,
|
||||
invested: 13781.70,
|
||||
href: `https://ranchimall.github.io/bobs-fund/#71f37a3b25d513a2b8d5fe155881ffd099c8e961791734e792bb882dd4dd3119`
|
||||
},
|
||||
]
|
||||
|
||||
@ -387,14 +447,60 @@
|
||||
}
|
||||
function renderAllFundInvestors(){
|
||||
const frag = document.createDocumentFragment()
|
||||
getRef('bob_fund_investors__container').innerHTML = ''
|
||||
bobFund.forEach(investor => {
|
||||
let [currentValue, gain] = calcNetValue(2676.5, 64.46, investor.invested, 0)
|
||||
currentValue = parseFloat(currentValue.toFixed(2))
|
||||
timeElapsed = (new Date().getFullYear() - 2017)
|
||||
frag.append(render.bobFundRow({...investor, currentValue, gain, timeElapsed}))
|
||||
const timelineItemsFrag = document.createDocumentFragment()
|
||||
getRef('bobs_fund_timeline').innerHTML = ''
|
||||
bobFund.forEach(fund => {
|
||||
const {release, invested, investors, href} = fund
|
||||
console.log(release, invested, investors, href)
|
||||
const timelineItem = document.createElement('li')
|
||||
timelineItem.classList.add('timeline-item')
|
||||
|
||||
const tilelineItemHeader = document.createElement('header')
|
||||
tilelineItemHeader.classList.add('timeline-item__header')
|
||||
tilelineItemHeader.textContent = getFormatedTime(release, true)
|
||||
console.log(new Date(release))
|
||||
|
||||
if(fund.hasOwnProperty('investors')){
|
||||
investors.forEach(investor => {
|
||||
let [currentValue, gain] = calcNetValue(2676.5, 64.46, investor.invested, 0)
|
||||
currentValue = parseFloat(currentValue.toFixed(2))
|
||||
timeElapsed = (new Date().getFullYear() - 2017)
|
||||
frag.append(render.bobFundRow({...investor, currentValue, gain, timeElapsed}))
|
||||
})
|
||||
const fundContainer = document.createElement('div')
|
||||
fundContainer.classList.add('grid', 'series-container', 'series-container--bobs-fund')
|
||||
|
||||
const heading = document.createElement('h4')
|
||||
heading.classList.add('margin-bottom-1r', 'margin-top-1-5')
|
||||
heading.textContent = 'Fund investors'
|
||||
|
||||
fundContainer.append(frag)
|
||||
timelineItem.append(heading, fundContainer)
|
||||
}
|
||||
else{
|
||||
const fundCard = document.createElement('div')
|
||||
fundCard.classList.add('grid', 'card')
|
||||
let [currentValue, gain] = calcNetValue(37488, 72.56, invested, 0)
|
||||
currentValue = parseFloat(currentValue.toFixed(2))
|
||||
fundCard.innerHTML = `
|
||||
<div class="flex space-between">
|
||||
<div class="grid">
|
||||
<h5 class="label color-0-8 weight-500">Total fund investment</h5>
|
||||
<h3 class="value original-value">${invested.toLocaleString('en-US', {style: 'currency' ,currency: 'USD'})}</h3>
|
||||
</div>
|
||||
<div class="grid justify-right text-align-right">
|
||||
<h4 class="label color-0-8 weight-500">Current value</h4>
|
||||
<h3 class="value current-value" style="color: var(--green)">${currentValue.toLocaleString('en-US', {style: 'currency', currency: 'USD'})}</h3>
|
||||
</div>
|
||||
</div>
|
||||
<a class="button button--filled justify-right" href='${href}' target="_blank">See investors</a>
|
||||
`
|
||||
timelineItem.append(fundCard)
|
||||
}
|
||||
timelineItem.prepend(tilelineItemHeader)
|
||||
timelineItemsFrag.prepend(timelineItem)
|
||||
})
|
||||
getRef('bob_fund_investors__container').append(frag)
|
||||
getRef('bobs_fund_timeline').append(timelineItemsFrag)
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
188
css/main.css
188
css/main.css
@ -76,6 +76,10 @@ body[data-theme=dark] .outlet-preview {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
#my_popup {
|
||||
--width: min(24rem, 100%);
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: calc(400 * var(--font-weight-factor));
|
||||
max-width: 70ch;
|
||||
@ -116,7 +120,6 @@ button {
|
||||
border-radius: 0.2rem;
|
||||
padding: 0.5rem 0.6rem;
|
||||
}
|
||||
|
||||
.button--primary {
|
||||
background: var(--accent-color);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
@ -124,6 +127,12 @@ button {
|
||||
.button--primary .icon {
|
||||
fill: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
.button--outlined {
|
||||
box-shadow: 0 0 0 1px rgba(var(--text-color), 0.5);
|
||||
}
|
||||
.button--filled {
|
||||
background-color: rgba(var(--text-color), 0.2);
|
||||
}
|
||||
|
||||
button:focus-visible {
|
||||
outline: rgba(var(--text-color), 1) 0.1rem solid;
|
||||
@ -805,7 +814,7 @@ ol[type="1"] {
|
||||
position: absolute;
|
||||
line-height: 1;
|
||||
font-size: 1em;
|
||||
font-weight: 900;
|
||||
font-weight: inherit;
|
||||
-webkit-text-stroke: 0;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
@ -825,8 +834,10 @@ ol[type="1"] {
|
||||
padding-bottom: 1.5rem;
|
||||
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
|
||||
}
|
||||
.series-container .bit-bond-series__row,
|
||||
.series-container .bob-fund__row {
|
||||
|
||||
.bit-bond-series__row,
|
||||
.bob-fund__row,
|
||||
.card {
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
@ -836,16 +847,13 @@ ol[type="1"] {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.bit-bond-series__row {
|
||||
grid-auto-flow: column;
|
||||
}
|
||||
|
||||
.bob-fund__row .grid {
|
||||
align-content: flex-start;
|
||||
}
|
||||
|
||||
.bob-fund__row,
|
||||
.bit-bond-series__row {
|
||||
.bit-bond-series__row,
|
||||
.card {
|
||||
gap: 1rem;
|
||||
border-radius: 0.5rem;
|
||||
align-items: flex-start;
|
||||
@ -894,7 +902,7 @@ ol[type="1"] {
|
||||
}
|
||||
|
||||
.person__name {
|
||||
font-size: 1.1rem;
|
||||
font-size: 0.9rem;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
@ -968,64 +976,68 @@ ol[type="1"] {
|
||||
}
|
||||
|
||||
.outlet_switcher__floor {
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.outlet_switcher__button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1rem;
|
||||
padding: 0.4rem 0;
|
||||
flex-shrink: 0;
|
||||
padding: 0.6rem 0;
|
||||
font-weight: calc(500 * var(--font-weight-factor));
|
||||
}
|
||||
.outlet_switcher__button--active {
|
||||
color: var(--accent-color) !important;
|
||||
}
|
||||
.outlet_switcher__button:not(:last-of-type)::after {
|
||||
content: "";
|
||||
position: relative;
|
||||
width: 4vw;
|
||||
height: 0.1rem;
|
||||
margin: 0 0.5rem;
|
||||
background: var(--accent-color);
|
||||
}
|
||||
|
||||
.outlet-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-self: flex-start;
|
||||
color: var(--accent-color);
|
||||
margin-bottom: 0.5rem;
|
||||
font-size: 1.1rem;
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
text-align: left;
|
||||
align-items: center;
|
||||
min-width: 8rem;
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
align-self: flex-start;
|
||||
grid-template-areas: "label icon" "num num";
|
||||
}
|
||||
.outlet-label .icon {
|
||||
grid-area: icon;
|
||||
height: 1.6rem;
|
||||
width: 1.6rem;
|
||||
fill: var(--accent-color);
|
||||
justify-self: flex-end;
|
||||
}
|
||||
|
||||
/* scroll-tab-header{
|
||||
--padding: 0.5rem 0;
|
||||
--border-radius: 0.3rem;
|
||||
--background: transparent;
|
||||
.outlet-label__name {
|
||||
font-size: 1.7rem;
|
||||
color: rgba(var(--text-color), 0.5);
|
||||
font-weight: calc(900 * var(--font-weight-factor));
|
||||
}
|
||||
scroll-tab-panels{
|
||||
--gap: 1.5rem;
|
||||
--background: transparent;
|
||||
margin-bottom: 6rem;
|
||||
& > *{
|
||||
opacity: 0.4;
|
||||
flex-shrink: 0;
|
||||
min-width: 100%;
|
||||
transition: opacity 0.6s;
|
||||
align-self: start;
|
||||
}
|
||||
& > [active]{
|
||||
opacity: 1;
|
||||
}
|
||||
} */
|
||||
|
||||
.outlet-label__no {
|
||||
grid-area: num;
|
||||
display: flex;
|
||||
position: relative;
|
||||
line-height: 1;
|
||||
font-size: 8rem;
|
||||
font-weight: 900;
|
||||
-webkit-text-stroke: 1rem var(--accent-color);
|
||||
-webkit-text-fill-color: var(--background-color);
|
||||
margin: 0 0.5rem;
|
||||
}
|
||||
.outlet-label__no::after {
|
||||
content: attr(data-number);
|
||||
position: absolute;
|
||||
line-height: 1;
|
||||
font-size: 1em;
|
||||
font-weight: inherit;
|
||||
-webkit-text-stroke: 0;
|
||||
color: var(--background-color);
|
||||
}
|
||||
|
||||
.auto-grid-layout {
|
||||
justify-content: flex-start;
|
||||
overflow-x: auto;
|
||||
@ -1146,11 +1158,16 @@ scroll-tab-panels{
|
||||
}
|
||||
|
||||
.room-tile__icon {
|
||||
margin-bottom: 1rem;
|
||||
height: 3rem;
|
||||
width: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.room-tile__icon:not(.room-tile__icon--colored) {
|
||||
fill: rgba(var(--text-color), 1);
|
||||
}
|
||||
.room-tile__icon--colored {
|
||||
filter: drop-shadow(0 1rem 0.5rem rgba(0, 0, 0, 0.2));
|
||||
}
|
||||
|
||||
.room-tile__title {
|
||||
font-size: 1.2rem;
|
||||
@ -1188,6 +1205,15 @@ scroll-tab-panels{
|
||||
background-color: inherit;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
.room-container__header::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 1rem;
|
||||
height: 100%;
|
||||
left: -1rem;
|
||||
top: 0;
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
#hero_title {
|
||||
font-size: 2rem;
|
||||
@ -1215,7 +1241,8 @@ scroll-tab-panels{
|
||||
z-index: 2;
|
||||
overflow-x: auto;
|
||||
align-items: center;
|
||||
padding: 2rem 0.5rem 0.5rem 0.5rem;
|
||||
padding: 2rem 0.5rem 0.5rem 3rem;
|
||||
margin-left: -3rem;
|
||||
background: linear-gradient(0deg, var(--background-color) 70%, rgba(0, 0, 0, 0) 100%);
|
||||
}
|
||||
|
||||
@ -1296,6 +1323,47 @@ scroll-tab-panels{
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.timeline-container {
|
||||
display: grid;
|
||||
padding: 3rem 0;
|
||||
gap: 4rem;
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
display: grid;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
.timeline-item:not(:last-of-type):before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: calc(100% + 4rem);
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(var(--text-color), 0.7);
|
||||
}
|
||||
.timeline-item:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
top: 0;
|
||||
left: -0.3rem;
|
||||
background-color: rgba(var(--text-color), 1);
|
||||
}
|
||||
|
||||
.timeline-item__header {
|
||||
display: flex;
|
||||
font-size: 0.8rem;
|
||||
padding: 0.5rem 0.8rem;
|
||||
border-radius: 0.2rem;
|
||||
justify-self: flex-start;
|
||||
transform: translateY(-0.8rem);
|
||||
box-shadow: 0 0 0 1px rgba(var(--text-color), 0.6);
|
||||
background-color: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 640px) {
|
||||
.hide-on-mobile {
|
||||
display: none;
|
||||
@ -1313,7 +1381,8 @@ scroll-tab-panels{
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.outlet-preview__number {
|
||||
.outlet-preview__number,
|
||||
.outlet-label__no {
|
||||
font-size: 5rem;
|
||||
}
|
||||
|
||||
@ -1325,6 +1394,10 @@ scroll-tab-panels{
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.outlet-label__no {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.series-container {
|
||||
gap: 1rem;
|
||||
}
|
||||
@ -1478,15 +1551,28 @@ scroll-tab-panels{
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.bit-bond-series__row {
|
||||
grid-auto-flow: column;
|
||||
.outlet__title {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
#outlet_switcher {
|
||||
padding: 1rem 1.5rem;
|
||||
}
|
||||
|
||||
.outlet-label {
|
||||
grid-column: 2/3;
|
||||
justify-self: right;
|
||||
}
|
||||
|
||||
.outlet-label__no {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.outlet-hero-section {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
gap: 1.5rem;
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
204
css/main.scss
204
css/main.scss
@ -68,6 +68,10 @@ body[data-theme='dark']{
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
#my_popup{
|
||||
--width: min(24rem, 100%);
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: calc(400 * var(--font-weight-factor));
|
||||
max-width: 70ch;
|
||||
@ -107,12 +111,18 @@ button{
|
||||
.button{
|
||||
border-radius: 0.2rem;
|
||||
padding: 0.5rem 0.6rem;
|
||||
}
|
||||
.button--primary{
|
||||
background: var(--accent-color);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
.icon{
|
||||
fill: rgba(var(--foreground-color), 1);
|
||||
&--primary{
|
||||
background: var(--accent-color);
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
.icon{
|
||||
fill: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
}
|
||||
&--outlined{
|
||||
box-shadow: 0 0 0 1px rgba(var(--text-color), 0.5);
|
||||
}
|
||||
&--filled{
|
||||
background-color: rgba(var(--text-color), 0.2);
|
||||
}
|
||||
}
|
||||
button:focus-visible{
|
||||
@ -714,7 +724,7 @@ ol[type="1"]{
|
||||
position: absolute;
|
||||
line-height: 1;
|
||||
font-size: 1em;
|
||||
font-weight: 900;
|
||||
font-weight: inherit;
|
||||
-webkit-text-stroke: 0;
|
||||
color: rgba(var(--foreground-color), 1);
|
||||
}
|
||||
@ -733,10 +743,11 @@ ol[type="1"]{
|
||||
gap: 1.5rem;
|
||||
padding-bottom: 1.5rem;
|
||||
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
|
||||
.bit-bond-series__row,
|
||||
.bob-fund__row{
|
||||
padding: 1.5rem;
|
||||
}
|
||||
}
|
||||
.bit-bond-series__row,
|
||||
.bob-fund__row,
|
||||
.card{
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.bit-bond-series__row,
|
||||
@ -744,9 +755,6 @@ ol[type="1"]{
|
||||
.person-card{
|
||||
min-width: 100%;
|
||||
}
|
||||
.bit-bond-series__row{
|
||||
grid-auto-flow: column;
|
||||
}
|
||||
|
||||
.bob-fund__row{
|
||||
.grid{
|
||||
@ -755,7 +763,8 @@ ol[type="1"]{
|
||||
}
|
||||
|
||||
.bob-fund__row,
|
||||
.bit-bond-series__row{
|
||||
.bit-bond-series__row,
|
||||
.card{
|
||||
gap: 1rem;
|
||||
border-radius: 0.5rem;
|
||||
align-items: flex-start;
|
||||
@ -800,7 +809,7 @@ ol[type="1"]{
|
||||
border-radius: 50%;
|
||||
}
|
||||
.person__name{
|
||||
font-size: 1.1rem;
|
||||
font-size: 0.9rem;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.investor__bio{
|
||||
@ -863,65 +872,66 @@ ol[type="1"]{
|
||||
outline: none;
|
||||
}
|
||||
.outlet_switcher__floor{
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.outlet_switcher__button{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1rem;
|
||||
padding: 0.4rem 0;
|
||||
flex-shrink: 0;
|
||||
padding: 0.6rem 0;
|
||||
font-weight: calc(500 * var(--font-weight-factor));
|
||||
&--active{
|
||||
color: var(--accent-color) !important;
|
||||
}
|
||||
&:not(:last-of-type)::after{
|
||||
content: '';
|
||||
position: relative;
|
||||
width: 4vw;
|
||||
height: 0.1rem;
|
||||
margin: 0 0.5rem;
|
||||
background: var(--accent-color);
|
||||
}
|
||||
}
|
||||
.outlet-label{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-self: flex-start;
|
||||
color: var(--accent-color);
|
||||
// background-color: rgba(var(--text-color), 0.06);
|
||||
// border-radius: 0.2rem;
|
||||
// padding: 0.8rem 0.8rem;
|
||||
margin-bottom: 0.5rem;
|
||||
font-size: 1.1rem;
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
text-align: left;
|
||||
align-items: center;
|
||||
min-width: 8rem;
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
align-self: flex-start;
|
||||
// border-radius: 0.5rem;
|
||||
// padding: 0.8rem 0.8rem;
|
||||
// background-color: rgba(var(--text-color), 0.06);
|
||||
grid-template-areas: 'label icon' 'num num';
|
||||
.icon{
|
||||
grid-area: icon;
|
||||
height: 1.6rem;
|
||||
width: 1.6rem;
|
||||
fill: var(--accent-color);
|
||||
justify-self: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
/* scroll-tab-header{
|
||||
--padding: 0.5rem 0;
|
||||
--border-radius: 0.3rem;
|
||||
--background: transparent;
|
||||
.outlet-label__name{
|
||||
font-size: 1.7rem;
|
||||
color: rgba(var(--text-color), 0.5);
|
||||
font-weight: calc(900 * var(--font-weight-factor));
|
||||
}
|
||||
scroll-tab-panels{
|
||||
--gap: 1.5rem;
|
||||
--background: transparent;
|
||||
margin-bottom: 6rem;
|
||||
& > *{
|
||||
opacity: 0.4;
|
||||
flex-shrink: 0;
|
||||
min-width: 100%;
|
||||
transition: opacity 0.6s;
|
||||
align-self: start;
|
||||
.outlet-label__no{
|
||||
grid-area: num;
|
||||
display: flex;
|
||||
position: relative;
|
||||
line-height: 1;
|
||||
font-size: 8rem;
|
||||
font-weight: 900;
|
||||
-webkit-text-stroke: 1rem var(--accent-color);
|
||||
-webkit-text-fill-color: var(--background-color);
|
||||
margin: 0 0.5rem;
|
||||
&::after{
|
||||
content: attr(data-number);
|
||||
position: absolute;
|
||||
line-height: 1;
|
||||
font-size: 1em;
|
||||
font-weight: inherit;
|
||||
-webkit-text-stroke: 0;
|
||||
color: var(--background-color);
|
||||
}
|
||||
& > [active]{
|
||||
opacity: 1;
|
||||
}
|
||||
} */
|
||||
}
|
||||
.auto-grid-layout{
|
||||
justify-content: flex-start;
|
||||
overflow-x: auto;
|
||||
@ -1036,10 +1046,15 @@ scroll-tab-panels{
|
||||
}
|
||||
}
|
||||
.room-tile__icon{
|
||||
margin-bottom: 1rem;
|
||||
height: 3rem;
|
||||
width: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
fill: rgba(var(--text-color), 1);
|
||||
&:not(.room-tile__icon--colored){
|
||||
fill: rgba(var(--text-color), 1);
|
||||
}
|
||||
&--colored{
|
||||
filter: drop-shadow(0 1rem 0.5rem rgba(0,0,0,0.2));
|
||||
}
|
||||
}
|
||||
.room-tile__title{
|
||||
font-size: 1.2rem;
|
||||
@ -1074,6 +1089,15 @@ scroll-tab-panels{
|
||||
z-index: 2;
|
||||
background-color: inherit;
|
||||
padding: 1rem 0;
|
||||
&::before{
|
||||
position: absolute;
|
||||
content: '';
|
||||
width: 1rem;
|
||||
height: 100%;
|
||||
left: -1rem;
|
||||
top: 0;
|
||||
background-color: inherit;
|
||||
}
|
||||
}
|
||||
#hero_title{
|
||||
font-size: 2rem;
|
||||
@ -1102,7 +1126,8 @@ scroll-tab-panels{
|
||||
z-index: 2;
|
||||
overflow-x: auto;
|
||||
align-items: center;
|
||||
padding: 2rem 0.5rem 0.5rem 0.5rem;
|
||||
padding: 2rem 0.5rem 0.5rem 3rem;
|
||||
margin-left: -3rem;
|
||||
background: linear-gradient(0deg, var(--background-color) 70%, rgba(0,0,0,0) 100%);
|
||||
}
|
||||
#room_switcher{
|
||||
@ -1181,6 +1206,46 @@ scroll-tab-panels{
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.timeline-container{
|
||||
display: grid;
|
||||
padding: 3rem 0;
|
||||
gap: 4rem;
|
||||
}
|
||||
.timeline-item{
|
||||
position: relative;
|
||||
display: grid;
|
||||
padding-left: 1rem;
|
||||
&:not(:last-of-type):before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: calc(100% + 4rem);
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(var(--text-color), 0.7);
|
||||
}
|
||||
&:after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
padding: 0.3rem;
|
||||
border-radius: 50%;
|
||||
top: 0;
|
||||
left: -0.3rem;
|
||||
background-color: rgba(var(--text-color), 1);
|
||||
}
|
||||
}
|
||||
.timeline-item__header{
|
||||
display: flex;
|
||||
font-size: 0.8rem;
|
||||
padding: 0.5rem 0.8rem;
|
||||
border-radius: 0.2rem;
|
||||
justify-self: flex-start;
|
||||
transform: translateY(-0.8rem);
|
||||
box-shadow: 0 0 0 1px rgba(var(--text-color), 0.6);
|
||||
background-color: rgba(var(--foreground-color), 1);
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 640px) {
|
||||
.hide-on-mobile{
|
||||
display: none;
|
||||
@ -1194,7 +1259,8 @@ scroll-tab-panels{
|
||||
.outlet-preview__number::after{
|
||||
left: 0;
|
||||
}
|
||||
.outlet-preview__number{
|
||||
.outlet-preview__number,
|
||||
.outlet-label__no{
|
||||
font-size: 5rem;
|
||||
}
|
||||
#outlet_switcher{
|
||||
@ -1203,6 +1269,9 @@ scroll-tab-panels{
|
||||
.outlet-hero-section{
|
||||
margin-top: 2rem;
|
||||
}
|
||||
.outlet-label__no{
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.series-container{
|
||||
gap: 1rem;
|
||||
}
|
||||
@ -1279,7 +1348,6 @@ scroll-tab-panels{
|
||||
justify-content: center;
|
||||
.floor_list__header{
|
||||
display: grid;
|
||||
// justify-content: center;
|
||||
}
|
||||
&:not(:last-of-type){
|
||||
padding-bottom: 8vw;
|
||||
@ -1347,14 +1415,26 @@ scroll-tab-panels{
|
||||
}
|
||||
}
|
||||
}
|
||||
.bit-bond-series__row{
|
||||
grid-auto-flow: column;
|
||||
.outlet__title{
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
#outlet_switcher{
|
||||
padding: 1rem 1.5rem;
|
||||
}
|
||||
.outlet-label{
|
||||
grid-column: 2/3;
|
||||
justify-self: right;
|
||||
}
|
||||
.outlet-label__no{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.outlet-hero-section{
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
gap: 1.5rem;
|
||||
margin-top: 4rem;
|
||||
// justify-content: center;
|
||||
}
|
||||
.auto-grid-layout{
|
||||
grid-template-columns: auto 1fr;
|
||||
|
||||
170
ico.html
170
ico.html
@ -109,89 +109,97 @@
|
||||
trading in our own custom exchange. The ICO will resume after de-risking process is complete.
|
||||
</p>
|
||||
</section>
|
||||
<div class="rooms__header">
|
||||
<h4 class="room__label">Rooms</h4>
|
||||
<scroll-tab-header data-target="ico_page_group">
|
||||
<button class="room-button" title="Investors">
|
||||
<svg class="icon button__icon--left" xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>People</title><path d='M402 168c-2.93 40.67-33.1 72-66 72s-63.12-31.32-66-72c-3-42.31 26.37-72 66-72s69 30.46 66 72z' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32'/><path d='M336 304c-65.17 0-127.84 32.37-143.54 95.41-2.08 8.34 3.15 16.59 11.72 16.59h263.65c8.57 0 13.77-8.25 11.72-16.59C463.85 335.36 401.18 304 336 304z' fill='none' stroke='currentColor' stroke-miterlimit='10' stroke-width='32'/><path d='M200 185.94c-2.34 32.48-26.72 58.06-53 58.06s-50.7-25.57-53-58.06C91.61 152.15 115.34 128 147 128s55.39 24.77 53 57.94z' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32'/><path d='M206 306c-18.05-8.27-37.93-11.45-59-11.45-52 0-102.1 25.85-114.65 76.2-1.65 6.66 2.53 13.25 9.37 13.25H154' fill='none' stroke='currentColor' stroke-linecap='round' stroke-miterlimit='10' stroke-width='32'/></svg>
|
||||
<span class="button__label">
|
||||
Contributing Investors
|
||||
</span>
|
||||
<section class="rooms-layout">
|
||||
<div id="expanding_tile" class="hide-completely"></div>
|
||||
<a class="room-tile room-tile--main" href="#investor_room">
|
||||
<div class="tile-content">
|
||||
<svg class="room-tile__icon" id="b23be00b-0d64-4bed-9d99-6f7aaf421af4" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M44.53,26.6a7.17,7.17,0,1,1,5.07-2.1h0A7.16,7.16,0,0,1,44.53,26.6Zm0-11.47a4.31,4.31,0,1,0,3,1.26A4.31,4.31,0,0,0,44.53,15.13Z"/><path d="M62.58,1.38A4.7,4.7,0,0,0,58.35.09L45.09,2.66a14.61,14.61,0,0,0-7.56,4L19.92,24.29l-9,2.23a8.75,8.75,0,0,0-4.1,2.31L.46,35.2a1.43,1.43,0,0,0,1,2.44h.08L10,37.2l1.67,1.68L6.85,41.23a1.43,1.43,0,0,0-.38,2.3l14,14a1.44,1.44,0,0,0,1,.42l.24,0a1.47,1.47,0,0,0,1.05-.78l2.35-4.79,1.61,1.6-.45,8.58a1.43,1.43,0,0,0,.85,1.38,1.51,1.51,0,0,0,.58.12,1.44,1.44,0,0,0,1-.42l6.37-6.36a8.75,8.75,0,0,0,2.31-4.1l2.23-9,17.7-17.7a14.5,14.5,0,0,0,4-7.56L63.87,5.61A4.7,4.7,0,0,0,62.58,1.38ZM21,54.05,9.91,42.92,13.78,41,23,50.18ZM8.85,30.86a5.82,5.82,0,0,1,2.76-1.56L16,28.21,10.23,34l-.37.37-4.74.25ZM34.58,52.43A5.89,5.89,0,0,1,33,55.19l-3.74,3.73.25-4.74,6.13-6.13Zm20.68-28-18,18h0l-9,9-7.85-7.86-5.31-5.3h0l-2.55-2.54,27-27a11.72,11.72,0,0,1,5.38-3L58.3,19A11.64,11.64,0,0,1,55.26,24.41Zm5.8-19.34L59,15.68,48.28,5,58.89,2.9a1.85,1.85,0,0,1,2.17,2.17Z"/><path d="M2.63,62.76a1.41,1.41,0,0,1-1-.41,1.44,1.44,0,0,1,0-2l8.12-8.13a1.44,1.44,0,0,1,2,2L3.64,62.35A1.42,1.42,0,0,1,2.63,62.76Z"/><path d="M10.75,62.76a1.43,1.43,0,0,1-1-2.44l4.06-4.07a1.43,1.43,0,0,1,2,2l-4.06,4.06A1.43,1.43,0,0,1,10.75,62.76Z"/><path d="M2.63,54.64a1.43,1.43,0,0,1-1-2.44l4.07-4.06a1.43,1.43,0,0,1,2,2L3.65,54.22A1.44,1.44,0,0,1,2.63,54.64Z"/></svg>
|
||||
<h4 class="room-tile__title">Investors</h4>
|
||||
</div>
|
||||
</a>
|
||||
<a class="room-tile" href="#product_room">
|
||||
<div class="tile-content">
|
||||
<svg class="room-tile__icon" id="b76bf456-6b89-4220-8b44-f4f7d833bad6" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M61.28,22.11c0-.05,0-.09,0-.14L58.62,6A1.68,1.68,0,0,0,57,4.6H7A1.68,1.68,0,0,0,5.38,6L2.72,22c0,.05,0,.09,0,.14s0,.09,0,.14V57.72A1.68,1.68,0,0,0,4.38,59.4H59.62a1.68,1.68,0,0,0,1.68-1.68V22.25C61.3,22.2,61.28,22.16,61.28,22.11Zm-3.64-1.54H39.34L38.51,8h17ZM27.92,23.93h8.16v6.64L33,28.41a1.7,1.7,0,0,0-1.9,0l-3.13,2.16ZM35.15,8,36,20.57H28L28.91,8ZM8.46,8H25.55l-.88,12.61H6.36ZM57.94,56H6.06V23.93h18.5v9.84a1.67,1.67,0,0,0,2.63,1.38L32,31.84l4.81,3.31a1.65,1.65,0,0,0,.95.3,1.76,1.76,0,0,0,.78-.19,1.68,1.68,0,0,0,.9-1.49V23.93h18.5Z"/></svg>
|
||||
<h4 class="room-tile__title">Product</h4>
|
||||
</div>
|
||||
</a>
|
||||
<a class="room-tile" href="#purchase_room">
|
||||
<div class="tile-content">
|
||||
<svg class="room-tile__icon" id="bb329e59-3d30-49a7-ac0d-b164d3b3b631" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M42.74,64a14,14,0,1,1,14-14A14,14,0,0,1,42.74,64Zm0-24.73A10.7,10.7,0,1,0,53.44,50,10.71,10.71,0,0,0,42.74,39.27Z"/><path d="M28.7,50H14.08a3.43,3.43,0,0,1-3.42-3.58l1.4-31.51h4.85V17.8a1.71,1.71,0,1,0,3.42,0V14.88H33V17.8a1.71,1.71,0,1,0,3.42,0V14.88h4.84L42.2,36c.18,0,.35,0,.54,0a13.92,13.92,0,0,1,2.9.31l-1.1-24.8H36.42V9.76a9.76,9.76,0,1,0-19.51,0v1.69H8.79L7.24,46.24a6.85,6.85,0,0,0,6.84,7.15H29.14A14.24,14.24,0,0,1,28.7,50ZM20.33,9.76A6.34,6.34,0,1,1,33,9.76v1.69H20.33Z"/><path d="M41.23,54.65a1.69,1.69,0,0,1-1.18-.49l-3-3a1.67,1.67,0,0,1,2.35-2.36l1.84,1.84,4.85-4.85a1.66,1.66,0,0,1,2.35,2.35l-6,6A1.67,1.67,0,0,1,41.23,54.65Z"/></svg>
|
||||
<h4 class="room-tile__title">Buy</h4>
|
||||
</div>
|
||||
</a>
|
||||
</section>
|
||||
<section class="room-container hide-completely page-layout">
|
||||
<header class="room-container__header">
|
||||
<button class="grid flow-column gap-1 align-center" onclick="hideRoom()">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M7.828 11H20v2H7.828l5.364 5.364-1.414 1.414L4 12l7.778-7.778 1.414 1.414z"/></svg>
|
||||
<h3 id="room_title" class="hide-completely"></h3>
|
||||
</button>
|
||||
<button class="room-button" title="Phases">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6c-.83 0-1.5.67-1.5 1.5S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.68-1.5 1.5s.68 1.5 1.5 1.5 1.5-.68 1.5-1.5-.67-1.5-1.5-1.5zM7 19h14v-2H7v2zm0-6h14v-2H7v2zm0-8v2h14V5H7z"/></svg>
|
||||
<span class="button__label">
|
||||
Product
|
||||
</span>
|
||||
</button>
|
||||
<button class="room-button" title="Phases">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6c-.83 0-1.5.67-1.5 1.5S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.68-1.5 1.5s.68 1.5 1.5 1.5 1.5-.68 1.5-1.5-.67-1.5-1.5-1.5zM7 19h14v-2H7v2zm0-6h14v-2H7v2zm0-8v2h14V5H7z"/></svg>
|
||||
<span class="button__label">
|
||||
Purchase
|
||||
</span>
|
||||
</button>
|
||||
</scroll-tab-header>
|
||||
</div>
|
||||
<scroll-tab-panels id="ico_page_group">
|
||||
<section class="grid carousel-container">
|
||||
<h3 class="h3 margin-bottom-1-5r">Contributing Investors</h3>
|
||||
<!-- <sm-carousel id="ico_investors" indicator autoplay></sm-carousel> -->
|
||||
<section id="ico_investors" class="people-grid"></section>
|
||||
</header>
|
||||
<h1 id="hero_title"></h1>
|
||||
<section class="room-carousel">
|
||||
<section id="investor_room" class="grid room">
|
||||
<section id="ico_investors" class="people-grid"></section>
|
||||
</section>
|
||||
<section id="product_room" class="grid room">
|
||||
<h3 class="h3 margin-bottom-1-5r">Product</h3>
|
||||
<p class="margin-bottom-3r">
|
||||
Please refer to the whitepaper <a href="https://www.ranchimall.net/ICO/">here</a> for detailed terms.
|
||||
RanchiMall Initial Coin Offering (ICO) abides by the terms we offered in our ICO whitepaper available
|
||||
at link above. We have made certain changes in our terms as our learning has improved. All
|
||||
these changes are to support the interests of our long term investors.
|
||||
</p>
|
||||
<h4 class="h4 margin-bottom-1r">Summary of changes over white paper</h4>
|
||||
<ol type="1">
|
||||
<li>
|
||||
<p>
|
||||
RanchiMall Tokens (RMT) now own the financial gains emerging from all our blockchain contracts
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
RanchiMall FZE has been withdrawn as an asset in view of high holding costs
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
Number of phase have been paused at 2 instead of 14 as initially envisioned
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
Number of RMTs tokens in circulation has been paused to
|
||||
10000 instead of a release schedule of 21 million in 3 years. The un-issued tokens will stay vested
|
||||
with the Founder of RanchiMall.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
The price discovery during active phase has been USD 1500 per
|
||||
token giving RMTs in circulation a valuation of 150 million USD. Unless this price is realised in open
|
||||
makets on sustainable basis, new tokens will not be put in circulation.
|
||||
</p>
|
||||
</li>
|
||||
</ol>
|
||||
</section>
|
||||
<section id="purchase_room" class="grid room">
|
||||
<h3 class="h3 margin-bottom-1-5r">Purchase</h3>
|
||||
<p>
|
||||
Currently we are not selling any RanchiMall Tokens (RMT). You can buy nominal tokens at
|
||||
our last valuation in <a href="https://www.ranchimall.net/exchange/">our exchange</a> for USD 10 or Rs 500 if you want to become a
|
||||
tokenholder, and be part of the learning process through our community. Our rules are designed to
|
||||
favour long term investors.
|
||||
<br> Once you initiate a tokenholder relationship, please be patient to stay the
|
||||
whole course of journey. You will not regret it.
|
||||
</p>
|
||||
</section>
|
||||
</section>
|
||||
<section>
|
||||
<h3 class="h3 margin-bottom-1-5r">Product</h3>
|
||||
<p class="margin-bottom-3r">
|
||||
Please refer to the whitepaper <a href="https://www.ranchimall.net/ICO/">here</a> for detailed terms.
|
||||
RanchiMall Initial Coin Offering (ICO) abides by the terms we offered in our ICO whitepaper available
|
||||
at link above. We have made certain changes in our terms as our learning has improved. All
|
||||
these changes are to support the interests of our long term investors.
|
||||
</p>
|
||||
<h4 class="h4 margin-bottom-1r">Summary of changes over white paper</h4>
|
||||
<ol type="1">
|
||||
<li>
|
||||
<p>
|
||||
RanchiMall Tokens (RMT) now own the financial gains emerging from all our blockchain contracts
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
RanchiMall FZE has been withdrawn as an asset in view of high holding costs
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
Number of phase have been paused at 2 instead of 14 as initially envisioned
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
Number of RMTs tokens in circulation has been paused to
|
||||
10000 instead of a release schedule of 21 million in 3 years. The un-issued tokens will stay vested
|
||||
with the Founder of RanchiMall.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
The price discovery during active phase has been USD 1500 per
|
||||
token giving RMTs in circulation a valuation of 150 million USD. Unless this price is realised in open
|
||||
makets on sustainable basis, new tokens will not be put in circulation.
|
||||
</p>
|
||||
</li>
|
||||
</ol>
|
||||
</section>
|
||||
<section>
|
||||
<h3 class="h3 margin-bottom-1-5r">Purchase</h3>
|
||||
<p>
|
||||
Currently we are not selling any RanchiMall Tokens (RMT). You can buy nominal tokens at
|
||||
our last valuation in <a href="https://www.ranchimall.net/exchange/">our exchange</a> for USD 10 or Rs 500 if you want to become a
|
||||
tokenholder, and be part of the learning process through our community. Our rules are designed to
|
||||
favour long term investors.
|
||||
<br> Once you initiate a tokenholder relationship, please be patient to stay the
|
||||
whole course of journey. You will not regret it.
|
||||
</p>
|
||||
</section>
|
||||
<!-- <ul id="ico_phase_list"></ul> -->
|
||||
</scroll-tab-panels>
|
||||
<footer class="room-container__footer">
|
||||
<h4>Related rooms</h4>
|
||||
<div id="room_switcher"></div>
|
||||
</footer>
|
||||
</section>
|
||||
</main>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.1/gsap.min.js"></script>
|
||||
<script src="js/components.js"></script>
|
||||
|
||||
69
js/index.js
69
js/index.js
@ -46,10 +46,19 @@ if (themeSwitcher) {
|
||||
if (localStorage.theme === "dark") {
|
||||
nightlight();
|
||||
themeSwitcher.checked = true;
|
||||
} else {
|
||||
} else if (localStorage.theme === "light"){
|
||||
daylight();
|
||||
themeSwitcher.checked = false;
|
||||
}
|
||||
else {
|
||||
if (window.matchMedia(`(prefers-color-scheme: dark)`).matches) {
|
||||
nightlight();
|
||||
themeSwitcher.checked = true;
|
||||
} else {
|
||||
daylight();
|
||||
themeSwitcher.checked = false;
|
||||
}
|
||||
}
|
||||
|
||||
function daylight() {
|
||||
document.body.setAttribute("data-theme", "light");
|
||||
@ -139,15 +148,7 @@ function getFormatedTime(time, relative) {
|
||||
|
||||
finalHours = hours >= 12 ? `${finalHours} PM` : `${finalHours} AM`;
|
||||
if (relative) {
|
||||
if (year == currentYear) {
|
||||
if (currentTime[1] === month) {
|
||||
const dateDiff = parseInt(currentTime[2]) - parseInt(date);
|
||||
if (dateDiff === 0) return `${finalHours}`;
|
||||
else if (dateDiff === 1) return `Yesterday`;
|
||||
else if (dateDiff > 1 && dateDiff < 8) return currentTime[0];
|
||||
else return ` ${date} ${month}`;
|
||||
} else return ` ${date} ${month}`;
|
||||
} else return `${month} ${year}`;
|
||||
return `${date} ${month} ${year}`;
|
||||
} else return `${finalHours} ${month} ${date} ${year}`;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
@ -256,13 +257,13 @@ const siteMap = [
|
||||
isSold: true,
|
||||
buyUrl: `purchase_room`
|
||||
},
|
||||
/* {
|
||||
name: "Initial Coin Offering",
|
||||
url: "ico",
|
||||
brief: `The Initial Coin Offering (ICO) of RanchiMall was launched in 2017. It was envisioned to sell 21 million tokens over 14 phases over 3 years.`,
|
||||
isSold: true,
|
||||
buyUrl: `purchase_room`
|
||||
}, */
|
||||
/* {
|
||||
name: "Initial Coin Offering",
|
||||
url: "ico",
|
||||
brief: `The Initial Coin Offering (ICO) of RanchiMall was launched in 2017. It was envisioned to sell 21 million tokens over 14 phases over 3 years.`,
|
||||
isSold: true,
|
||||
buyUrl: `purchase_room`
|
||||
}, */
|
||||
],
|
||||
},
|
||||
/* {
|
||||
@ -359,15 +360,22 @@ bitBondRowTemplate.innerHTML = `
|
||||
<h5 class="label color-0-8 weight-500">Series</h5>
|
||||
<h3 class="value original-value"></h3>
|
||||
</div>
|
||||
<div class="grid justify-right text-align-right">
|
||||
<h5 class="label color-0-8 weight-500">Current value</h5>
|
||||
<h3 class="value current-value" style="color: var(--green)"></h3>
|
||||
<div class="flex align-center">
|
||||
<svg class="icon up-arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M13 7.828V20h-2V7.828l-5.364 5.364-1.414-1.414L12 4l7.778 7.778-1.414 1.414L13 7.828z"/></svg>
|
||||
<span class="percent-gain"></span>
|
||||
<span class="time-elapsed"></span>
|
||||
<div class="flex align-center space-between">
|
||||
<div class="grid">
|
||||
<h5 class="label color-0-8 weight-500">Invested</h5>
|
||||
<h3 class="value">$100</h3>
|
||||
</div>
|
||||
<div class="grid justify-right text-align-right">
|
||||
<h5 class="label color-0-8 weight-500">Current value</h5>
|
||||
<h3 class="value current-value" style="color: var(--green)"></h3>
|
||||
<div class="flex align-center">
|
||||
<svg class="icon up-arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M13 7.828V20h-2V7.828l-5.364 5.364-1.414-1.414L12 4l7.778 7.778-1.414 1.414L13 7.828z"/></svg>
|
||||
<span class="percent-gain"></span>
|
||||
<span class="time-elapsed"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
`
|
||||
|
||||
@ -375,7 +383,8 @@ const bobsFundRowTemplate = document.createElement('template')
|
||||
bobsFundRowTemplate.innerHTML = `
|
||||
<div class="bob-fund__row grid">
|
||||
<div class="grid">
|
||||
<h3 class="value person__name"></h3>
|
||||
<h5 class="label color-0-8 weight-500">FLO ID</h5>
|
||||
<h3 class="person__name breakable"></h3>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<div class="grid">
|
||||
@ -389,7 +398,7 @@ bobsFundRowTemplate.innerHTML = `
|
||||
<svg class="icon up-arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M13 7.828V20h-2V7.828l-5.364 5.364-1.414-1.414L12 4l7.778 7.778-1.414 1.414L13 7.828z"/></svg>
|
||||
<span class="percent-gain"></span>
|
||||
<span class="time-elapsed"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -434,9 +443,9 @@ const render = {
|
||||
return row;
|
||||
},
|
||||
bobFundRow(obj) {
|
||||
const { investorName, invested, currentValue, timeElapsed, gain } = obj;
|
||||
const { investorName, invested, floId, currentValue, timeElapsed, gain } = obj;
|
||||
const row = bobsFundRowTemplate.content.cloneNode(true);
|
||||
row.querySelector(".person__name").textContent = investorName;
|
||||
row.querySelector(".person__name").textContent = floId;
|
||||
row.querySelector(".original-value").textContent = `${invested.toLocaleString(`en-IN`, { style: 'currency', currency: 'INR' })}`;
|
||||
row.querySelector(".current-value").textContent = `${currentValue.toLocaleString(`en-IN`, { style: 'currency', currency: 'INR' })}`;
|
||||
row.querySelector(".percent-gain").textContent = `${gain}%`;
|
||||
@ -768,7 +777,9 @@ function renderFloorOutlets(floorObj, activeOutlet) {
|
||||
break
|
||||
}
|
||||
}
|
||||
document.querySelector('.outlet-label__name').textContent = floorNum > -1 ? `Floor ${floorNum + 1} outlet ${outletNum + 1}` : ''
|
||||
// document.querySelector('.outlet-label__name').textContent = floorNum > -1 ? `Floor ${floorNum + 1} outlet ${outletNum + 1}` : ''
|
||||
document.querySelector('.outlet-label__no').textContent = outletNum + 1
|
||||
document.querySelector('.outlet-label__no').dataset.number = outletNum + 1
|
||||
if (outlets[outletNum].hasOwnProperty('status')) {
|
||||
getRef('main_header').after(render.statusBanner(outlets[outletNum].status))
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user