574 lines
34 KiB
HTML
574 lines
34 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>RanchiMall</title>
|
|
<meta name="description" content="">
|
|
<link rel="shortcut icon" href="assets/RM logo.png" type="image/png">
|
|
<link rel="stylesheet" href="css/main.min.css">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400..900&display=swap" rel="stylesheet">
|
|
</head>
|
|
<body data-theme="light">
|
|
<sm-notifications id="notification_drawer"></sm-notifications>
|
|
<!-- Component templates -->
|
|
|
|
<template id="ico_investor_row">
|
|
<div class="investor-card grid gap-1-5">
|
|
<img class="investor__image" src="" alt="" loading="lazy">
|
|
<div class="grid">
|
|
<h3 class="investor__name value capitalize"></h3>
|
|
<p class="investor__bio color-0-8"></p>
|
|
</div>
|
|
<div class="grid investor__contribution-container">
|
|
<h4 class="label color-0-8 weight-500">Contribution</h4>
|
|
<p class="investor__contribution weight-700"></p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<template id="floor_indicator_template">
|
|
<div class="floor-label interact">
|
|
<span class="floor-circle"></span>
|
|
</div>
|
|
</template>
|
|
|
|
<!-- -->
|
|
|
|
|
|
<!-- Popup -->
|
|
|
|
<section id="elevator_popup" class="grid hide-completely">
|
|
<header class="elevator__header">
|
|
<button class="close-button justify-self-start" onclick="hideSiteMap()">
|
|
<svg class="icon icon-only close-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 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z"/></svg>
|
|
</button>
|
|
</header>
|
|
<ul id="floor_list" class="grid"></ul>
|
|
</section>
|
|
|
|
<!-- -->
|
|
|
|
<header id="main_header" class="grid align-center full-bleed">
|
|
<button id="elevator_button" class="button" onclick="showSiteMap()">
|
|
<svg class="icon button__icon--left" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 3L16.3301 10.5H7.66987L12 3Z"/><path d="M12 21L7.66987 13.5L16.3301 13.5L12 21Z"/></svg>
|
|
<span class="button__label">
|
|
Elevator
|
|
</span>
|
|
</button>
|
|
<a href="index.html" class="main-logo flex align-center page-link justify-self-center" data-target="home_page">
|
|
<svg id="main_header__logo" class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.46,21.32C20,19.78,18.6,18.59,15.3,17a12.67,12.67,0,0,1-2.64-1.56,4.27,4.27,0,0,1-.79-1,2.6,2.6,0,0,1,0-1.41c.24-.68.49-1,2.43-2.85a7.18,7.18,0,0,0,2.09-2.92,4.25,4.25,0,0,0,0-1.77,6.52,6.52,0,0,0-2.85-3.11c-.56-.36-.81-.4-.81-.15a2.33,2.33,0,0,1-.18.45L12.4,3l-.53-.36c-.28-.21-.64-.41-.77-.49s-.46-.11-.46,0a6.21,6.21,0,0,1-.37.83s-.08,0-.17-.08c-1.15-.83-1.64-1-1.64-.73A7.33,7.33,0,0,1,7.7,3.65C6.48,5.68,5.24,6.7,4,6.7c-.56,0-.54,0-.37.64s.2.58.68.43a3.37,3.37,0,0,0,1.09-.54.86.86,0,0,1,.3-.17,1.34,1.34,0,0,1,.13.39.79.79,0,0,0,.17.4A3.5,3.5,0,0,0,7.37,7.3L7.8,7l.09.34c.12.45.19.51.62.39a4.25,4.25,0,0,0,2.17-1.54l.38-.45,0,.39A5.92,5.92,0,0,1,8.89,9.54L7.67,10.71c-2,1.93-1.89,3.51.37,5a27.41,27.41,0,0,0,2.89,1.51c.17.07.62.32,1,.54C14,19,15,20.23,15,21.48a2,2,0,0,0,0,.49h0c0,.05,0,.05.56-.1a1.89,1.89,0,0,0,.53-.21,2.41,2.41,0,0,0-.34-1.15,7.05,7.05,0,0,0-1.68-1.77,21.91,21.91,0,0,0-3.2-1.83A9.53,9.53,0,0,1,8.16,15.2a2.18,2.18,0,0,1-.74-1.55C7.42,12.79,7.86,12,9,11c1.77-1.64,2.45-2.45,2.92-3.55a2.28,2.28,0,0,0,.26-1.26A2,2,0,0,0,12,5.06l-.2-.45L12,4.3l.28-.49.09-.18L12.6,4a3.69,3.69,0,0,1,.61,1.76A3.47,3.47,0,0,1,12.94,7l-.09.25s-.21.37-.41.69A17.78,17.78,0,0,1,9.91,10.6c-1.07,1-1.43,1.62-1.47,2.47a2.05,2.05,0,0,0,.7,1.73,10.47,10.47,0,0,0,3.28,2.08c2.28,1.13,3.26,1.81,4,2.73a2.94,2.94,0,0,1,.74,1.75,1.26,1.26,0,0,0,.09.57.48.48,0,0,0,.26,0l.51-.13.29-.08,0-.28c-.13-1-1-2-2.47-3a25.52,25.52,0,0,0-3.26-1.77,8.59,8.59,0,0,1-2.23-1.43,2.09,2.09,0,0,1-.5-2.62c.26-.53.5-.83,2.35-2.6,1.51-1.45,2.15-2.58,2.15-3.79A3.67,3.67,0,0,0,13,3.48a3,3,0,0,1-.4-.42A1.85,1.85,0,0,1,13,2.33a6.74,6.74,0,0,1,1.83,1.73,2.62,2.62,0,0,1,.47,1.68,3,3,0,0,1-.55,1.84c-.45.78-.79,1.14-2.67,2.93a5.56,5.56,0,0,0-1.3,1.64,1.77,1.77,0,0,0-.21,1,1.76,1.76,0,0,0,.19.92,6.28,6.28,0,0,0,2.9,2.34,21.6,21.6,0,0,1,3.66,2c1.35,1,2,2,2,3a1.06,1.06,0,0,0,.05.47,2.83,2.83,0,0,0,1-.24C20.56,21.68,20.56,21.66,20.46,21.32ZM7.29,6.4h0a2.23,2.23,0,0,1-.9.28L6,6.72l.43-.53a15.22,15.22,0,0,0,1.89-3,3.52,3.52,0,0,1,.38-.67c.07-.08.49.2,1,.64l.39.35L9.66,4A6.7,6.7,0,0,1,7.29,6.4Zm3.58-1.11A5.8,5.8,0,0,1,9.25,6.51h0a3.3,3.3,0,0,1-.74.17l-.35,0,.39-.49a15.64,15.64,0,0,0,1.32-2,4.63,4.63,0,0,1,.28-.49c.06-.08.33.26.57.77l.28.57Zm1-1.4a1.63,1.63,0,0,1-.28.4A6.63,6.63,0,0,1,11,3.72l-.53-.56.12-.29c.2-.49.24-.51.64-.19a5.57,5.57,0,0,1,.85.78A2.78,2.78,0,0,1,11.87,3.89Z"/></svg>
|
|
<h4 class="h4 header__company-name">RanchiMall</h4>
|
|
</a>
|
|
<label class="theme-switcher" title="Change theme">
|
|
<input id="theme_switcher" class="theme-switcher__checkbox" type="checkbox">
|
|
<svg class="icon moon-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="M10 6a8 8 0 0 0 11.955 6.956C21.474 18.03 17.2 22 12 22 6.477 22 2 17.523 2 12c0-5.2 3.97-9.474 9.044-9.955A7.963 7.963 0 0 0 10 6zm-6 6a8 8 0 0 0 8 8 8.006 8.006 0 0 0 6.957-4.045c-.316.03-.636.045-.957.045-5.523 0-10-4.477-10-10 0-.321.015-.64.045-.957A8.006 8.006 0 0 0 4 12zm14.164-9.709L19 2.5v1l-.836.209a2 2 0 0 0-1.455 1.455L16.5 6h-1l-.209-.836a2 2 0 0 0-1.455-1.455L13 3.5v-1l.836-.209A2 2 0 0 0 15.29.836L15.5 0h1l.209.836a2 2 0 0 0 1.455 1.455zm5 5L24 7.5v1l-.836.209a2 2 0 0 0-1.455 1.455L21.5 11h-1l-.209-.836a2 2 0 0 0-1.455-1.455L18 8.5v-1l.836-.209a2 2 0 0 0 1.455-1.455L20.5 5h1l.209.836a2 2 0 0 0 1.455 1.455z"/></svg>
|
|
<svg class="icon sun-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 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12zm0-2a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM11 1h2v3h-2V1zm0 19h2v3h-2v-3zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05 3.515 4.93zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414-2.121-2.121zm2.121-14.85l1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414 2.121-2.121zM23 11v2h-3v-2h3zM4 11v2H1v-2h3z"/></svg>
|
|
</label>
|
|
</header>
|
|
<article id="home_page" class="page">
|
|
<aside id="floor_line_map" class="grid">
|
|
<div class="flex line-map justify-center">
|
|
<div id="floor_line_map__circle" class="line-map__circle"></div>
|
|
<div class="line-map__bar"></div>
|
|
</div>
|
|
<div id="floor_label_container"></div>
|
|
</aside>
|
|
<main id="floor_container" class="grid">
|
|
<section id="floor_1" class="floor">
|
|
<header class="floor__header grid align-center">
|
|
<h4 class="floor__num">Floor 1</h5>
|
|
<h4 class="floor__title">
|
|
Current Projects
|
|
</h3>
|
|
</header>
|
|
<main id="floor_1__outlets" class="grid outlets-container">
|
|
<p>
|
|
This floor contains all the products for which we have current paying customers. This floor services our current customers.
|
|
</p>
|
|
<div id="bit_bond_outlet" class="outlet-preview carousel-container">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">1</div>
|
|
<h3 class="outlet__title">bitcoin bonds</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Bondholders get a minimum guarantee of 13 percent 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>
|
|
<a href="bitcoinbonds.html" class="button outlet-preview__button">
|
|
<span class="button__label">Visit</span>
|
|
</a>
|
|
</div>
|
|
<div class="grid carousel-holder carousel-holder--right">
|
|
<sm-carousel id="bit_bond_series__container" class="outlet-preview__carousel" indicator></sm-carousel>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="bob_fund_outlet" class="outlet-preview carousel-container">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">2</div>
|
|
<h3 class="outlet__title">Bob's Fund</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
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.
|
|
</p>
|
|
<a href="bob'sfund.html" class="button outlet-preview__button">
|
|
<span class="button__label">Visit</span>
|
|
</a>
|
|
</div>
|
|
<div class="grid carousel-holder carousel-holder--left">
|
|
<sm-carousel id="bob_fund_investors__container" class="outlet-preview__carousel" indicator></sm-carousel>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="ico_outlet" class="outlet-preview carousel-container">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">3</div>
|
|
<h3 class="outlet__title">Initial Coin Offering</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
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.
|
|
</p>
|
|
<a href="ico.html" class="button outlet-preview__button">
|
|
<span class="button__label">Visit</span>
|
|
</a>
|
|
</div>
|
|
<div class="grid carousel-holder carousel-holder--right">
|
|
<sm-carousel id="ico_investors__container" class="outlet-preview__carousel" indicator></sm-carousel>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
</main>
|
|
</section>
|
|
<section id="floor_2" class="floor">
|
|
<header class="floor__header grid align-center">
|
|
<h4 class="floor__num">Floor 2</h5>
|
|
<h4 class="floor__title">
|
|
Blockchain Contracts
|
|
</h3>
|
|
</header>
|
|
<main id="floor_2__outlets" class="grid outlets-container">
|
|
<p>
|
|
Blockchain Contracts is one of the flagship innovation from RanchiMall.
|
|
We believe each of these blockchain contracts will be transformational in its area, and will add
|
|
tremendously to our enterprise value.Second Floor of RanchiMall isdedicated to Blockchain
|
|
Contracts.
|
|
</p>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">2</div>
|
|
<h3 class="outlet__title">Incorporation Blockchain Contract</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
RanchiMall is incorporated on the blockchain and structured as Incorporation Blockchain Contract. Incorporation Blockchain Contract owns all the other blockchain contracts of RanchiMall.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bob'sfund">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">1</div>
|
|
<h3 class="outlet__title">Internship Blockchain Contract</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Internship Blockchain Contract tokenizes all our internship initiatives. This is owned by Incorporation Blockchain Contract.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">3</div>
|
|
<h3 class="outlet__title">FLO Blockchain Contract</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
FLO Blockchain contract consists of all projects RanchiMall performs on FLO Blockchain (previously called Florincoin).
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="ico">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
</main>
|
|
</section>
|
|
<section id="floor_3" class="floor">
|
|
<header class="floor__header grid align-center">
|
|
<h4 class="floor__num">Floor 3</h5>
|
|
<h4 class="floor__title">
|
|
Blockchain Apps
|
|
</h3>
|
|
</header>
|
|
<main id="floor_3__outlets" class="grid outlets-container">
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">1</div>
|
|
<h3 class="outlet__title">Web Wallet</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">2</div>
|
|
<h3 class="outlet__title">FLO Messenger</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">3</div>
|
|
<h3 class="outlet__title">Content Collaboration</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">4</div>
|
|
<h3 class="outlet__title">RanchiMall Times</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
</main>
|
|
</section>
|
|
<section id="floor_4" class="floor">
|
|
<header class="floor__header grid align-center">
|
|
<h4 class="floor__num">Floor 4</h5>
|
|
<h4 class="floor__title">
|
|
Experimental Ideas
|
|
</h3>
|
|
</header>
|
|
<main id="floor_4__outlets" class="grid outlets-container">
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">1</div>
|
|
<h3 class="outlet__title">Blockchain Cloud</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">2</div>
|
|
<h3 class="outlet__title">UPI on Blockchain</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bob'sfund">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">3</div>
|
|
<h3 class="outlet__title">E-Commerce on Blockchain</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="ico">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
</main>
|
|
</section>
|
|
<section id="floor_5" class="floor">
|
|
<header class="floor__header grid align-center">
|
|
<h4 class="floor__num">Floor 5</h5>
|
|
<h4 class="floor__title">
|
|
Statistics and Administration
|
|
</h3>
|
|
</header>
|
|
<main id="floor_5__outlets" class="grid outlets-container">
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">1</div>
|
|
<h3 class="outlet__title">Incorporation</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bitbonds">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">2</div>
|
|
<h3 class="outlet__title">Team</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="bob'sfund">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
<div id="" class="outlet-preview">
|
|
<div class="grid outlet-preview__info">
|
|
<h5 class="h5 margin-bottom-0-5r">Outlet no.</h5>
|
|
<div class="outlet-number">3</div>
|
|
<h3 class="outlet__title">Operational Statistics</h3>
|
|
<p class="outlet__description margin-bottom-1-5r">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam reprehenderit cumque sequi earum.
|
|
</p>
|
|
<button class="button page-link outlet-preview__button" data-target="ico">
|
|
<span class="button__label">Visit</span>
|
|
</button>
|
|
</div>
|
|
<div class="outlet-preview__border"></div>
|
|
</div>
|
|
</main>
|
|
</section>
|
|
</main>
|
|
</article>
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.1/gsap.min.js"></script>
|
|
<script src="js/components.js"></script>
|
|
<script src="js/index.js"></script>
|
|
|
|
<script>
|
|
|
|
const icoInvestors = [
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Abhijeet Das Gupta',
|
|
bio: 'Product and Technology Solutions Architect at 366Pi Technologies',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Amit Jagetia',
|
|
bio: 'IT Professional in FinTech Industry',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Amitesh Anand',
|
|
bio: 'Co-founder and CEO, 366Pi Technologies and Director of Technology, Fennex Ltd.',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Atul Agarwal',
|
|
bio: 'Entrepreneur, Real Estate Developer, Blockchain Entrepreneur, Iconoclast',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Barun Kumar',
|
|
bio: 'Cybersecurity Professional, Founder of Mantran Consulting, Singapore',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Janardan Tiwary',
|
|
bio: 'Retd. General Manager Coal India, Ranchi, Mining Engineer from IIT Dhanbad',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Kanwal Koul',
|
|
bio: 'Working Professional in the power sector',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Mansoor Ahmed',
|
|
bio: 'Cybersecurity Expert, Founder, and Director Winged World',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Meghna Patel',
|
|
bio: 'Marketing Professional turned Blockchain Enthusiast',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Nikhil Kulkarni',
|
|
bio: 'CTO and Co-Founder of tripDarwin.com',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Pankaj Miglani',
|
|
bio: 'Professional Services Consultant at AWS Cybersecurity',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Rajeev Kumar Gupta',
|
|
bio: 'Curator cum Organizer, TEDx Kanke, and Former DGM-Corporate & Regulatory Affairs at JWS Steel ',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Sudhir Taneja',
|
|
bio: 'Sales and Marketing Professional, Associate Vice President, HDFC Life',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Varucchi Dubey',
|
|
bio: 'Founder and Managing Director, DNV Security Solutions Pvt Ltd.',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
{
|
|
extension: 'jpg',
|
|
investorName: 'Venkat Narayanan',
|
|
bio: 'Business Excellence Professional, Sr. Manager at Tata Consultancy Services',
|
|
contribution: 'Helping us in social media with increasing reach of Twitter',
|
|
},
|
|
]
|
|
|
|
function renderAllSeries(){
|
|
const frag = document.createDocumentFragment()
|
|
getRef('bit_bond_series__container').innerHTML = ''
|
|
bitBondSerieses.forEach((series, index) => {
|
|
frag.append(render.bitBondRow(series))
|
|
})
|
|
getRef('bit_bond_series__container').append(frag)
|
|
}
|
|
function renderAllFundInvestors(){
|
|
const frag = document.createDocumentFragment()
|
|
getRef('bob_fund_investors__container').innerHTML = ''
|
|
bobFund.forEach(investor => {
|
|
frag.append(render.bobFundRow(investor))
|
|
})
|
|
getRef('bob_fund_investors__container').append(frag)
|
|
}
|
|
function renderAllIcoInvestors(){
|
|
const frag = document.createDocumentFragment()
|
|
getRef('ico_investors__container').innerHTML = ''
|
|
icoInvestors.forEach(investor => {
|
|
frag.append(render.icoInvestorRow(investor, {thumbnail: true}))
|
|
})
|
|
getRef('ico_investors__container').append(frag)
|
|
}
|
|
renderAllIcoInvestors()
|
|
renderAllSeries()
|
|
renderAllFundInvestors()
|
|
|
|
|
|
function showOutletSwitcher(button){
|
|
if(isOutletSwitcherOpen) return
|
|
isOutletSwitcherOpen = true
|
|
const buttonDimensions = button.getBoundingClientRect()
|
|
getRef('outlet_switcher').setAttribute('style', `top: ${buttonDimensions.top + document.documentElement.scrollTop}px; left: ${buttonDimensions.left}px;`)
|
|
getRef('outlet_switcher').classList.remove('hide')
|
|
getRef('outlet_switcher').animate(slideInDown, {
|
|
duration: 300,
|
|
easing: easeOutOvershoot,
|
|
fill: 'forwards'
|
|
})
|
|
}
|
|
|
|
const allOutletCarousels = document.querySelectorAll('.outlet-preview sm-carousel')
|
|
|
|
let homepagePercent = floorLineMapPercent = 0
|
|
const RO = new ResizeObserver(entries => {
|
|
entries.forEach(entry => {
|
|
homepagePercent = getRef('floor_container').scrollHeight / 100
|
|
floorLineMapPercent = getRef('floor_line_map').getBoundingClientRect().height / 100
|
|
renderAllFloorLabels()
|
|
updatePos()
|
|
});
|
|
})
|
|
RO.observe(document.body)
|
|
function getScrollPercent() {
|
|
const root = getRef('home_page')
|
|
return (root.scrollTop) / ((root.scrollHeight) - root.clientHeight) * 100;
|
|
}
|
|
|
|
getRef('home_page').addEventListener('scroll', e => {
|
|
throttle(updatePos, 1000 / 30)
|
|
}, {passive: true})
|
|
|
|
function updatePos(){
|
|
window.requestAnimationFrame(() => {
|
|
getRef('floor_line_map__circle').setAttribute('style', `transform: translateY(${(getScrollPercent()) * (floorLineMapPercent)}px)`)
|
|
})
|
|
}
|
|
|
|
|
|
function renderAllFloorLabels(){
|
|
const frag = document.createDocumentFragment()
|
|
document.querySelectorAll('.floor').forEach((floor, index) => {
|
|
getRef('floor_label_container').innerHTML = ''
|
|
const top = ((floor.getBoundingClientRect().top - getRef('floor_container').getBoundingClientRect().top + getRef('floor_container').offsetTop) / homepagePercent) * floorLineMapPercent
|
|
const label = render.floorLabel(index + 1, top)
|
|
frag.append(label)
|
|
})
|
|
getRef('floor_label_container').append(frag)
|
|
}
|
|
|
|
const floorObserver = new IntersectionObserver( entries => {
|
|
entries.forEach(entry => {
|
|
if(entry.isIntersecting){
|
|
document.querySelector(`.floor-label[data-target="${entry.target.id}"]`).classList.add('floor-label--active')
|
|
}
|
|
else{
|
|
document.querySelector(`.floor-label[data-target="${entry.target.id}"]`).classList.remove('floor-label--active')
|
|
}
|
|
})
|
|
},
|
|
{
|
|
threshold: 0.2
|
|
})
|
|
document.querySelectorAll('.floor').forEach(floor => floorObserver.observe(floor))
|
|
|
|
</script>
|
|
</body>
|
|
</html> |