mirror of
https://github.com/ivabus/www
synced 2025-06-08 13:30:26 +03:00
Merge branch 'website-version-3' into feature/sort-packages
This commit is contained in:
neil
commit
73f79245d8
34 changed files with 3972 additions and 221 deletions
|
|
@ -30,7 +30,7 @@
|
||||||
<div class="container hero-container">
|
<div class="container hero-container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<h1>Keep <span class="white">what</span><br><span class="hero-float" style="float:right;"><span class="white">is</span> yours.</span></h1>
|
<h1 class="impact">Keep <span class="white">what</span><br><span class="hero-float" style="float:right;"><span class="white">is</span> yours.</span></h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
@ -177,12 +177,26 @@
|
||||||
<!-- Package CTA Section -->
|
<!-- Package CTA Section -->
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
<section package-cta-section>
|
<section class="package-cta-section" id="authenticate">
|
||||||
<div class="container package-cta-container">
|
<div class="container package-cta-container two-boxes">
|
||||||
<div class="row" style="margin-bottom: 20px;">
|
<div class="row one-box-down">
|
||||||
<div class="col" style="margin: 150px 0px;">
|
<div class="col-lg-9">
|
||||||
<h3 class="text-center">Authenticate your GitHub for an even bigger sip</h3>
|
<h3>Authenticate your GitHub for an even bigger sip</h3>
|
||||||
<p class="text-center">Using tea without authenticating is like playing a video game without the DLC. There’s so much more to our ecosystem than a command line interface, and we want you to be a part of it.</p>
|
<p class="lead">Using tea without authenticating is like playing a video game without the DLC. There’s so much more to our ecosystem than a command line interface, and we want you to be a part of it.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12 one-box-down">
|
||||||
|
<h5>heading one</h5>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12 one-box-down">
|
||||||
|
<h5>heading one</h5>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12 one-box-down">
|
||||||
|
<h5>heading one</h5>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -209,7 +223,9 @@
|
||||||
<h2>sta'tea'stics</h2>
|
<h2>sta'tea'stics</h2>
|
||||||
<p class="lead">The problem is bigger than most realize. While everyday people use software every day, very few understand that the technology underlying their daily routine is provided by uncompensated labor.</p>
|
<p class="lead">The problem is bigger than most realize. While everyday people use software every day, very few understand that the technology underlying their daily routine is provided by uncompensated labor.</p>
|
||||||
<p>Even many developers don’t fully recognize the security risks of unpaid open-source until something deep in the stack collapses, like log4J.We want to shine a light on the scale of OSS usage, both to celebrate the achievements of unsung heroes as well as highlight the need for a better way.</p><br>
|
<p>Even many developers don’t fully recognize the security risks of unpaid open-source until something deep in the stack collapses, like log4J.We want to shine a light on the scale of OSS usage, both to celebrate the achievements of unsung heroes as well as highlight the need for a better way.</p><br>
|
||||||
|
<!-- Commenting this out until more data is available. Everything can fit on the homepage as of now.
|
||||||
{{- partial "detail-btn-large.html" "#" -}}
|
{{- partial "detail-btn-large.html" "#" -}}
|
||||||
|
-->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
|
@ -258,8 +274,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="row pt-5">
|
<div class="row pt-5">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<img class="partner-logo" id="binance-logo" src="/Images/binance-logo-white.svg" alt="Binance Logo" style="width:16.183vw;">
|
<img class="partner-logo" id="binance-logo" src="/Images/binance-logo-white.svg" alt="Binance Logo" style="width:16.183vw; z-index:2; position:relative;">
|
||||||
<img class="partner-logo ps-5" id="galaxy-eco-labs" src="/Images/galaxy-eco.svg" alt="Galaxy Eco Logo" style="width:40%;">
|
<img class="partner-logo ps-5" id="galaxy-eco-labs" src="/Images/galaxy-eco.svg" alt="Galaxy Eco Logo" style="width:40%; z-index:2; position:relative;">
|
||||||
<img class="mobile-grid-element" src="/Images/mobile-grid-element-3-rows.svg" alt="grid" style="margin-top: -2.8vw;">
|
<img class="mobile-grid-element" src="/Images/mobile-grid-element-3-rows.svg" alt="grid" style="margin-top: -2.8vw;">
|
||||||
<div class="gen-art-mobile" id="m-gen-art-9"></div>
|
<div class="gen-art-mobile" id="m-gen-art-9"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -2,19 +2,11 @@
|
||||||
|
|
||||||
<div class="container auth-success-container">
|
<div class="container auth-success-container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col my-auto">
|
<div class="col success-container">
|
||||||
<div class="success-div p-4" style="
|
<div class="success-content">
|
||||||
margin: 0;
|
<h1 class="text-center display-4">Thanks for Authenticating!</h1>
|
||||||
position: absolute;
|
<p class="lead text-center">You've just become an integral part in the future of the internet, AND you'll be entitled to a variety of exciting rewards such as minted NFT badges to honor your work thus far.</p>
|
||||||
top: 50%;
|
<button onclick="window.location.href='/';" id="return-home" class="detail-btn-large"><i class="icon-enter-arrow"></i>RETURN HOME</button>
|
||||||
left: 50%;
|
|
||||||
width:70%;
|
|
||||||
-ms-transform: translate(-50%, -50%);
|
|
||||||
transform: translate(-50%, -50%);">
|
|
||||||
<h1 class="display-4 text-center">Thanks for Authenticating!</h1>
|
|
||||||
<p class="lead text-center mb-5">You've just become an integral part in the future of the internet, AND you'll be entitled to a variety of exciting rewards such as minted NFT badges to honor your work thus far.</p>
|
|
||||||
<a class="btn btn-primary mb-5" href="https://tea.xyz"
|
|
||||||
role="button">Return to Home</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -22,46 +14,24 @@
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
.auth-success-container{
|
.success-container{
|
||||||
height:100vh;
|
height: 80vh;
|
||||||
position: relative;
|
position: relative;
|
||||||
background-image: url("/Images/tea-steam-dark.svg");
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: contain;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-primary{
|
.success-content{
|
||||||
display: block;
|
margin: 0;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#return-home{
|
||||||
|
display:block;
|
||||||
margin-left:auto;
|
margin-left:auto;
|
||||||
margin-right:auto;
|
margin-right:auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.success-gif{
|
|
||||||
width: 7vw;
|
|
||||||
height: 7vw;
|
|
||||||
border-radius: 100px;
|
|
||||||
background-image: url("/Images/auth-success.gif");
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: cover;
|
|
||||||
display: block;
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (max-width: 720px) {
|
|
||||||
.success-div{
|
|
||||||
width: 100% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success-gif{
|
|
||||||
width: 18vw;
|
|
||||||
height: 18vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="nb-man-about">
|
<section class="nb-man-about two-boxes">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
|
|
@ -25,104 +25,153 @@
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.wrapper {
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
height: 90%;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 5%;
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aspect {
|
||||||
|
padding-bottom: 70%;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aspect-inner {
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook {
|
||||||
|
height: 100%;
|
||||||
|
transition: margin-left 0.25s ease-out;
|
||||||
|
width: 100%;
|
||||||
|
-webkit-touch-callout: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-khtml-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook .page {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook .page img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<section class="nb-man-latest">
|
<section class="nb-man-latest">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-4 col-md-4 col-sm-12 col-12">
|
<div class="col">
|
||||||
<img src="/Images/nebraska-man-cover-issue-1l.jpg" alt="Nebraska Man Issue 1" style="width:100%;">
|
<div class="wrapper">
|
||||||
</div>
|
<div class="aspect">
|
||||||
<div class="col-lg-8 col-md-8 col-sm-12 col-12 my-auto">
|
<div class="aspect-inner">
|
||||||
<h3>Latest Release</h3>
|
<div class="flipbook" id="flipbook">
|
||||||
<p>Created by Niel Edwards (sp?), a frequent collaborator for Marvel and DC Comics, this first issue tells the story of Nebraska Man’s plight as an unthanked and uncompensated open-source dev. He is then approached by the Shadowy Super Coder and learns about a powerful new technology that could save the day.</p>
|
<div class="page"><img src="/Images/placeholder/batman-2016-120-1.jpeg" draggable="false" alt="" /></div>
|
||||||
|
<div class="page"><img src="/Images/placeholder/batman-2016-120-3.jpeg" draggable="false" alt="" /></div>
|
||||||
|
<div class="page"><img src="/Images/placeholder/batman-2016-120-4.jpeg" draggable="false" alt="" /></div>
|
||||||
|
<div class="page"><img src="/Images/placeholder/batman-2016-120-5.jpeg" draggable="false" alt="" /></div>
|
||||||
|
<div class="page"><img src="/Images/placeholder/batman-2016-120-6.jpeg" draggable="false" alt="" /></div>
|
||||||
|
<div class="page"><img src="/Images/placeholder/batman-2016-120-7.jpeg" draggable="false" alt="" /></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{{- partial "full-width-cta.html" . -}}
|
<hr>
|
||||||
|
<div class="row button-container">
|
||||||
|
<a href="#" role="button" class="btn btn-primary text-center auth-btn mt-lg-0 mt-md-0 mt-sm-0 mt-0" id="nav-cta">DOWNLOAD ISSUE #1</a>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
|
||||||
<section class="nb-man-catalog">
|
<section>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h3>catalog</h3>
|
<div class="row two-boxes">
|
||||||
</div>
|
<div class="col">
|
||||||
<hr>
|
<h3>Take 'saving the internet' one step further...</h3>
|
||||||
<div class="accordion" id="accordionExample">
|
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||||
<div class="accordion-item">
|
|
||||||
<h2 class="accordion-header" id="headingOne">
|
|
||||||
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
|
||||||
Issue #1 // Who Will You Meet in the Shadows?
|
|
||||||
</button>
|
|
||||||
</h2>
|
|
||||||
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
|
||||||
<div class="accordion-body">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
|
|
||||||
<img class="comic-thumb" src="/Images/nebraska-man-cover-issue-1l.jpg" alt="">
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-9 col-md-8 col-sm-12 col-12 my-auto">
|
|
||||||
<h4>Issue Title. Issue No. </h4>
|
|
||||||
<p class="small"> Release Date | Author Name | Illustrator Name</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
||||||
<div class="parallel-btn-container">
|
|
||||||
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>DOWNLOAD ISSUE</button>
|
|
||||||
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>READ IN-BROWSER</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="accordion-item">
|
<hr>
|
||||||
<h2 class="accordion-header" id="headingTwo">
|
<div class="row gx-5 one-box">
|
||||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
<div class="col">
|
||||||
Issue #2 // Teamwork Makes the Dream Work
|
<h4>How to earn your Nebraska Man cover NFT's.</h4>
|
||||||
</button>
|
<ul class="list-group">
|
||||||
</h2>
|
<li class="list-group-item">Follow our Twitter</li>
|
||||||
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
<li class="list-group-item">Like the Nebraska Man tweet</li>
|
||||||
<div class="accordion-body">
|
<li class="list-group-item">Retweet</li>
|
||||||
<div class="row">
|
<li class="list-group-item">Join Discord</li>
|
||||||
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
|
<li class="list-group-item">Attend AMA</li>
|
||||||
<img class="comic-thumb" src="/Images/nebraska-man-cover-issue-1l.jpg" alt="">
|
<li class="list-group-item">Join Subreddit</li>
|
||||||
</div>
|
<li class="list-group-item">Subscribe Youtube</li>
|
||||||
<div class="col-lg-9 col-md-8 col-sm-12 col-12 my-auto">
|
</ul>
|
||||||
<h4>Issue Title. Issue No. </h4>
|
|
||||||
<p class="small"> Release Date | Author Name | Illustrator Name</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
||||||
<div class="parallel-btn-container">
|
|
||||||
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>DOWNLOAD ISSUE</button>
|
|
||||||
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>READ IN-BROWSER</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="col">
|
||||||
<div class="accordion-item">
|
|
||||||
<h2 class="accordion-header" id="headingThree">
|
|
||||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
|
|
||||||
Issue #3 // The Battle to Save the Internet
|
|
||||||
</button>
|
|
||||||
</h2>
|
|
||||||
<div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
|
||||||
<div class="accordion-body">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
|
|
||||||
<img class="comic-thumb" src="/Images/nebraska-man-cover-issue-1l.jpg" alt="">
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-9 col-md-8 col-sm-12 col-12 my-auto">
|
|
||||||
<h4>Issue Title. Issue No. </h4>
|
|
||||||
<p class="small"> Release Date | Author Name | Illustrator Name</p>
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
||||||
<div class="parallel-btn-container">
|
|
||||||
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>DOWNLOAD ISSUE</button>
|
|
||||||
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>READ IN-BROWSER</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
|
function loadApp() {
|
||||||
|
|
||||||
|
// Create the flipbook
|
||||||
|
|
||||||
|
$('.flipbook').turn({
|
||||||
|
|
||||||
|
// Enable gradients
|
||||||
|
|
||||||
|
gradients: true,
|
||||||
|
|
||||||
|
// Auto center this flipbook
|
||||||
|
|
||||||
|
autoCenter: true
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Load the HTML4 version if there's not CSS transform
|
||||||
|
|
||||||
|
yepnope({
|
||||||
|
test : Modernizr.csstransforms,
|
||||||
|
yep: ['/js/turn.js'],
|
||||||
|
nope: ['/js/turn.html4.min.js'],
|
||||||
|
both: ['/css/basic.css'],
|
||||||
|
complete: loadApp
|
||||||
|
});
|
||||||
|
|
||||||
|
var flipbookEL = document.getElementById('flipbook');
|
||||||
|
|
||||||
|
window.addEventListener('resize', function (e) {
|
||||||
|
flipbookEL.style.width = '';
|
||||||
|
flipbookEL.style.height = '';
|
||||||
|
$(flipbookEL).turn('size', flipbookEL.clientWidth, flipbookEL.clientHeight);
|
||||||
|
});
|
||||||
|
|
||||||
|
$(flipbookEL).turn({
|
||||||
|
autoCenter: true
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
<div class="container product-container" lang="en">
|
<div class="container product-container" lang="en">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<h1>Products</h1>
|
<h1 style="position:relative; z-index:3;">Products</h1>
|
||||||
<div class="lead-container">
|
<div class="lead-container">
|
||||||
<p class="lead animated-5 animatedFadeInUp fadeInUp">Just like the perfect cup or tea, greatness needs time to steep. But the wait is over… it’s time to take your first sip.</p>
|
<p class="lead animated-5 animatedFadeInUp fadeInUp">Just like the perfect cup or tea, greatness needs time to steep. But the wait is over… it’s time to take your first sip.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -85,10 +85,6 @@
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<!-- IF POSSIBLE:
|
|
||||||
|
|
||||||
I'd like to directly feed the .MD onto the this page instead of using an iFrame to display the PDF. Will look cleaner that way. Alterntively, we can just have a an accordion for the different languages with CTAs that open the white paper in a new tab. Just no iframes.
|
|
||||||
|
|
||||||
<!-- Start PDF
|
<!-- Start PDF
|
||||||
|
|
||||||
<div class="container pdf-iframe"
|
<div class="container pdf-iframe"
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
<!-- The button used to copy the text -->
|
<!-- The button used to copy the text -->
|
||||||
|
|
||||||
<button class="clipboard-copy" id="copy-icon" onclick="myFunction()" data-bs-toggle="modal" data-bs-target="#exampleModal">copy</button>
|
<button type="button" class="clipboard-copy" id="liveToastBtn" onclick="myFunction()">copy</button>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
|
|
|
||||||
83
src/layouts/partials/comic-catalog.html
Normal file
83
src/layouts/partials/comic-catalog.html
Normal file
|
|
@ -0,0 +1,83 @@
|
||||||
|
<section class="nb-man-catalog">
|
||||||
|
<div class="container">
|
||||||
|
<h3>catalog</h3>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
<div class="accordion" id="accordionExample">
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingOne">
|
||||||
|
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||||||
|
Issue #1 // Who Will You Meet in the Shadows?
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
|
||||||
|
<img class="comic-thumb" src="/Images/nebraska-man-cover-issue-1l.jpg" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-9 col-md-8 col-sm-12 col-12 my-auto">
|
||||||
|
<h4>Issue Title. Issue No. </h4>
|
||||||
|
<p class="small"> Release Date | Author Name | Illustrator Name</p>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||||
|
<div class="parallel-btn-container">
|
||||||
|
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>DOWNLOAD ISSUE</button>
|
||||||
|
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>READ IN-BROWSER</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingTwo">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
||||||
|
Issue #2 // Teamwork Makes the Dream Work
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
|
||||||
|
<img class="comic-thumb" src="/Images/nebraska-man-cover-issue-1l.jpg" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-9 col-md-8 col-sm-12 col-12 my-auto">
|
||||||
|
<h4>Issue Title. Issue No. </h4>
|
||||||
|
<p class="small"> Release Date | Author Name | Illustrator Name</p>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||||
|
<div class="parallel-btn-container">
|
||||||
|
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>DOWNLOAD ISSUE</button>
|
||||||
|
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>READ IN-BROWSER</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="accordion-item">
|
||||||
|
<h2 class="accordion-header" id="headingThree">
|
||||||
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
|
||||||
|
Issue #3 // The Battle to Save the Internet
|
||||||
|
</button>
|
||||||
|
</h2>
|
||||||
|
<div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
|
||||||
|
<div class="accordion-body">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
|
||||||
|
<img class="comic-thumb" src="/Images/nebraska-man-cover-issue-1l.jpg" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-9 col-md-8 col-sm-12 col-12 my-auto">
|
||||||
|
<h4>Issue Title. Issue No. </h4>
|
||||||
|
<p class="small"> Release Date | Author Name | Illustrator Name</p>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
||||||
|
<div class="parallel-btn-container">
|
||||||
|
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>DOWNLOAD ISSUE</button>
|
||||||
|
<button href="#" class="detail-btn-large"><i class="icon-enter-arrow"></i>READ IN-BROWSER</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
@ -5,15 +5,15 @@
|
||||||
@media only screen and (min-width: 1200px) {
|
@media only screen and (min-width: 1200px) {
|
||||||
|
|
||||||
.gf-container {
|
.gf-container {
|
||||||
width: 8vw;
|
width: 20vw;
|
||||||
height: 8vw;
|
height: 4vw;
|
||||||
border-radius: 100px;
|
border-radius: 100px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding-top: .3vw;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
text-align:center;
|
font-size: 1vw;
|
||||||
padding-top: 3vw;
|
|
||||||
font-size: 1.562vw;
|
|
||||||
background-color: #1a1a1a !important;
|
background-color: #1a1a1a !important;
|
||||||
border: 2px solid #949494;
|
border: 2px solid #949494;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|
@ -39,15 +39,15 @@
|
||||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
||||||
|
|
||||||
.gf-container {
|
.gf-container {
|
||||||
width: 8.333vw;
|
width: 20vw;
|
||||||
height: 8.333vw;
|
height: 5vw;
|
||||||
border-radius: 100px;
|
border-radius: 100px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding-top: .3vw;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
text-align:center;
|
font-size: 1.2vw;
|
||||||
padding-top: 3vw;
|
|
||||||
font-size: 1.562vw;
|
|
||||||
background-color: #1a1a1a !important;
|
background-color: #1a1a1a !important;
|
||||||
border: 2px solid #949494;
|
border: 2px solid #949494;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|
@ -73,14 +73,15 @@
|
||||||
@media only screen and (min-width: 768px) and (max-width: 992px) {
|
@media only screen and (min-width: 768px) and (max-width: 992px) {
|
||||||
|
|
||||||
.gf-container {
|
.gf-container {
|
||||||
width: 8vw;
|
width: 20vw;
|
||||||
height: 8vw;
|
height: 5vw;
|
||||||
border-radius: 100px;
|
border-radius: 100px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding-top: 0.3vw;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
padding-top: 3vw;
|
|
||||||
font-size: 1.562vw;
|
font-size: 1.562vw;
|
||||||
background-color: #1a1a1a !important;
|
background-color: #1a1a1a !important;
|
||||||
border: 2px solid #949494;
|
border: 2px solid #949494;
|
||||||
|
|
@ -89,7 +90,7 @@
|
||||||
font-family: "pp-neue-machina", sans-serif;
|
font-family: "pp-neue-machina", sans-serif;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
right: 15px;
|
right: 15px;
|
||||||
top: 5.3vw;
|
top: 12vw;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
transition: 0.2s ease-in-out;
|
transition: 0.2s ease-in-out;
|
||||||
|
|
@ -107,15 +108,16 @@
|
||||||
@media only screen and (min-width: 576px) and (max-width: 768px) {
|
@media only screen and (min-width: 576px) and (max-width: 768px) {
|
||||||
|
|
||||||
.gf-container {
|
.gf-container {
|
||||||
width: 8vw;
|
width: 32vw;
|
||||||
height: 8vw;
|
height: 8vw;
|
||||||
border-radius: 100px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100px;
|
||||||
|
padding-top: 0.3vw;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
padding-top: 3vw;
|
font-size: 2.5vw;
|
||||||
font-size: 1.562vw;
|
|
||||||
background-color: #1a1a1a !important;
|
background-color: #1a1a1a !important;
|
||||||
border: 2px solid #949494;
|
border: 2px solid #949494;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|
@ -123,7 +125,7 @@
|
||||||
font-family: "pp-neue-machina", sans-serif;
|
font-family: "pp-neue-machina", sans-serif;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
right: 15px;
|
right: 15px;
|
||||||
top: 5.3vw;
|
bottom: 2.5vw;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
transition: 0.2s ease-in-out;
|
transition: 0.2s ease-in-out;
|
||||||
|
|
@ -141,14 +143,15 @@
|
||||||
@media only screen and (max-width: 576px) {
|
@media only screen and (max-width: 576px) {
|
||||||
|
|
||||||
.gf-container {
|
.gf-container {
|
||||||
width: 20vw;
|
width: 48vw;
|
||||||
height: 20vw;
|
height: 12vw;
|
||||||
border-radius: 100px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100px;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
padding-top: 7vw;
|
padding-top:0.4vw;
|
||||||
font-size: 4vw;
|
font-size: 4vw;
|
||||||
background-color: #1a1a1a !important;
|
background-color: #1a1a1a !important;
|
||||||
border: 2px solid #949494;
|
border: 2px solid #949494;
|
||||||
|
|
@ -175,5 +178,5 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz" class="gf-container animated-5 animatedFadeInUp fadeInUp" style="background-color:#8EC7BF;">
|
<a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz" class="gf-container animated-5 animatedFadeInUp fadeInUp" style="background-color:#8EC7BF;">
|
||||||
JOIN
|
AUTHENTICATE
|
||||||
</a>
|
</a>
|
||||||
|
|
|
||||||
|
|
@ -189,3 +189,17 @@ integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+
|
||||||
.catch(err => { throw err });
|
.catch(err => { throw err });
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
const toastTrigger = document.getElementById('liveToastBtn')
|
||||||
|
const toastLiveExample = document.getElementById('liveToast')
|
||||||
|
if (toastTrigger) {
|
||||||
|
toastTrigger.addEventListener('click', () => {
|
||||||
|
const toast = new bootstrap.Toast(toastLiveExample)
|
||||||
|
|
||||||
|
toast.show()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -44,6 +44,9 @@
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<script type="text/javascript" src="/js/jquery.min.1.7.js"></script>
|
||||||
|
<script type="text/javascript" src="/js/modernizr.2.5.3.min.js"></script>
|
||||||
|
|
||||||
<!-- Enable Klaviyo Signup Form -->
|
<!-- Enable Klaviyo Signup Form -->
|
||||||
|
|
||||||
<script async type="text/javascript" src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=VAwqJH"></script>
|
<script async type="text/javascript" src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=VAwqJH"></script>
|
||||||
|
|
@ -101,5 +104,7 @@
|
||||||
|
|
||||||
{{- partial "floating-join-btn.html" . -}}
|
{{- partial "floating-join-btn.html" . -}}
|
||||||
|
|
||||||
|
{{- partial "toast.html" -}}
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
</head>
|
</head>
|
||||||
|
|
|
||||||
|
|
@ -1,50 +1,34 @@
|
||||||
<div class="klaviyo-form-WUxzRc"></div>
|
<hr>
|
||||||
|
<div class="klaviyo-form-WUxzRc"></div>
|
||||||
|
<hr>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
.kl-private-reset-css-Xuajs1{
|
.needsclick.klaviyo-form.klaviyo-form-version-cid_1.kl-private-reset-css-Xuajs1{
|
||||||
display: block !important;
|
max-width: 100% !important;
|
||||||
padding: 0px !important;
|
padding: 0px !important;
|
||||||
margin-top: auto !important;
|
}
|
||||||
margin-bottom: auto !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.go3894874857{
|
.needsclick{
|
||||||
width: 100% !important;
|
min-height: none;
|
||||||
background-color: #54BAAB !important;
|
}
|
||||||
height: 45px !important;
|
|
||||||
border: none !important;
|
|
||||||
border-radius: 60px !important;
|
|
||||||
transition: 0.2s ease-in-out !important;
|
|
||||||
font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
|
|
||||||
font-weight: 700 !important;
|
|
||||||
font-size: 16px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.go3894874857:hover{
|
input#email_48240998.needsclick.go2381409361.kl-private-reset-css-Xuajs1{
|
||||||
background-color: #62CFBF !important;
|
border: none !important;
|
||||||
}
|
background-color: #1a1a1a !important;
|
||||||
|
border-radius: 0px !important;
|
||||||
|
padding: 0px !important;
|
||||||
|
min-height: 4.185vw !important;
|
||||||
|
font-family: "pp-neue-machina", sans-serif !important;
|
||||||
|
text-transform: uppercase !important;
|
||||||
|
}
|
||||||
|
|
||||||
::placeholder{
|
input#email_48240998.needsclick.go2381409361.kl-private-reset-css-Xuajs1:focus{
|
||||||
font-size: 16px !important;
|
outline:none !important;
|
||||||
}
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
#email_48240998{
|
|
||||||
width: 100%;
|
|
||||||
height: 45px !important;
|
|
||||||
font-size: 16px !important;
|
|
||||||
margin-bottom: 10px !important;
|
|
||||||
border: none !important;
|
|
||||||
border-radius: 30px !important;
|
|
||||||
background-color: #3F4346 !important;
|
|
||||||
padding: 10px 30px !important;
|
|
||||||
color: white !important;
|
|
||||||
transition: 0.1s ease-in-out !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#email_48240998:focus{
|
|
||||||
border: 1px solid #54BAAB !important;
|
|
||||||
box-shadow: 0px 0px 4px rgba(84, 186, 171, 0.5) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
#email_48240998{
|
||||||
|
min-height: 4.185vw !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
40
src/layouts/partials/toast.html
Normal file
40
src/layouts/partials/toast.html
Normal file
|
|
@ -0,0 +1,40 @@
|
||||||
|
<div class="toast-container position-fixed bottom-0 end-0 p-3">
|
||||||
|
<div id="liveToast" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
|
||||||
|
<div class="toast-header">
|
||||||
|
<i class="icon-tea-logo-iconasset-1 me-3 teal"></i>
|
||||||
|
<strong class="me-auto teal">Copied!</strong>
|
||||||
|
<small id="time"></small>
|
||||||
|
<button type="button" class="toast-close" data-bs-dismiss="toast" aria-label="Close">X</button>
|
||||||
|
</div>
|
||||||
|
<div class="toast-body">
|
||||||
|
Copied to clipboard. Now paste that command into your terminal.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
#liveToast{
|
||||||
|
background-color:#1a1a1a !important;
|
||||||
|
color: white;
|
||||||
|
border-radius: 0px;
|
||||||
|
font-family: "sono";
|
||||||
|
border: 2px solid #949494;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toast-header{
|
||||||
|
background-color:#1a1a1a;
|
||||||
|
color: white !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toast-container{
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toast-close{
|
||||||
|
background-color: #1a1a1a;
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
BIN
src/static/Images/placeholder/batman-2016-120-1.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-1.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.9 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-10.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-10.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-11.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-11.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-12.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-12.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-13.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-13.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-3.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-3.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.8 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-4.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-4.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-5.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-5.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-6.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-6.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-7.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-7.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-8.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-8.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 MiB |
BIN
src/static/Images/placeholder/batman-2016-120-9.jpeg
Normal file
BIN
src/static/Images/placeholder/batman-2016-120-9.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 MiB |
64
src/static/css/basic.css
Normal file
64
src/static/css/basic.css
Normal file
|
|
@ -0,0 +1,64 @@
|
||||||
|
/* Basic sample */
|
||||||
|
|
||||||
|
.latest-container{
|
||||||
|
overflow:hidden;
|
||||||
|
background-color:#1a1a1a;
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook-viewport{
|
||||||
|
overflow:hidden;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook-viewport .container{
|
||||||
|
top:50%;
|
||||||
|
left:50%;
|
||||||
|
margin:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook-viewport .flipbook{
|
||||||
|
width:922px;
|
||||||
|
height:600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook-viewport .page{
|
||||||
|
width:461px;
|
||||||
|
height:600px;
|
||||||
|
background-color:white;
|
||||||
|
background-repeat:no-repeat;
|
||||||
|
background-size:100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook .page{
|
||||||
|
-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
||||||
|
-moz-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
||||||
|
-ms-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
||||||
|
-o-box-shadow:0 0 20px rgba(0,0,0,0.2);
|
||||||
|
box-shadow:0 0 20px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook-viewport .page img{
|
||||||
|
-webkit-touch-callout: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-khtml-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flipbook-viewport .shadow{
|
||||||
|
-webkit-transition: -webkit-box-shadow 0.5s;
|
||||||
|
-moz-transition: -moz-box-shadow 0.5s;
|
||||||
|
-o-transition: -webkit-box-shadow 0.5s;
|
||||||
|
-ms-transition: -ms-box-shadow 0.5s;
|
||||||
|
|
||||||
|
-webkit-box-shadow:0 0 20px #ccc;
|
||||||
|
-moz-box-shadow:0 0 20px #ccc;
|
||||||
|
-o-box-shadow:0 0 20px #ccc;
|
||||||
|
-ms-box-shadow:0 0 20px #ccc;
|
||||||
|
box-shadow:0 0 20px #ccc;
|
||||||
|
}
|
||||||
|
|
@ -38,7 +38,8 @@
|
||||||
|
|
||||||
/* Icon Styling */
|
/* Icon Styling */
|
||||||
|
|
||||||
.btn-primary .icon-enter-arrow{
|
.btn-primary .icon-enter-arrow,
|
||||||
|
.btn-primary .icon-download-arrow{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-right: 0.558vw;
|
margin-right: 0.558vw;
|
||||||
|
|
|
||||||
|
|
@ -281,8 +281,17 @@ mark{
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (min-width: 768px) and (max-width: 992px) {
|
@media only screen and (min-width: 768px) and (max-width: 992px) {
|
||||||
|
|
||||||
|
.hero-section{
|
||||||
|
background-image: url("/Images/large-grid.svg");
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: top;
|
||||||
|
background-repeat: repeat;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
|
||||||
.metric-block{
|
.metric-block{
|
||||||
padding: 4.185vw;
|
padding: 4.185vw;
|
||||||
border: 2px solid #949494;
|
border: 2px solid #949494;
|
||||||
|
|
@ -316,7 +325,8 @@ mark{
|
||||||
background-attachment: fixed;
|
background-attachment: fixed;
|
||||||
background-position: top;
|
background-position: top;
|
||||||
background-repeat: repeat;
|
background-repeat: repeat;
|
||||||
background-size: contain; }
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
.metric-block{
|
.metric-block{
|
||||||
padding: 4.185vw;
|
padding: 4.185vw;
|
||||||
|
|
@ -347,7 +357,8 @@ mark{
|
||||||
@media only screen and (max-width: 576px) {
|
@media only screen and (max-width: 576px) {
|
||||||
|
|
||||||
.hero-section{
|
.hero-section{
|
||||||
padding: 1vw 4vw !important;
|
padding-right: 4vw !important;
|
||||||
|
padding-left: 4vw !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-container{
|
.hero-container{
|
||||||
|
|
@ -355,8 +366,8 @@ mark{
|
||||||
background-position: top;
|
background-position: top;
|
||||||
background-repeat: repeat-y;
|
background-repeat: repeat-y;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
padding-top: 17.5vw;
|
padding-top: 21.800vw !important;
|
||||||
padding-bottom: 21vw;
|
padding-bottom: 21.800vw !important;
|
||||||
border: 1px solid #949494;
|
border: 1px solid #949494;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -33,6 +33,14 @@
|
||||||
border-bottom: 2px solid #949494;
|
border-bottom: 2px solid #949494;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.nb-man-latest{
|
||||||
|
background-image: url("/Images/x-large-grid.svg");
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-position: top;
|
||||||
|
background-repeat: repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
#nb-man-float{
|
#nb-man-float{
|
||||||
position: relative;
|
position: relative;
|
||||||
padding-left: 25vw;
|
padding-left: 25vw;
|
||||||
|
|
|
||||||
|
|
@ -75,7 +75,7 @@ li{
|
||||||
|
|
||||||
h3{
|
h3{
|
||||||
font-size: 3.8rem;
|
font-size: 3.8rem;
|
||||||
line-height: 8.3vw;
|
line-height: 4.8vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
h4{
|
h4{
|
||||||
|
|
@ -221,6 +221,11 @@ li{
|
||||||
|
|
||||||
@media only screen and (max-width: 576px) {
|
@media only screen and (max-width: 576px) {
|
||||||
|
|
||||||
|
.impact{
|
||||||
|
font-size: 24vw !important;
|
||||||
|
line-height: 20.4vw;
|
||||||
|
}
|
||||||
|
|
||||||
h1{
|
h1{
|
||||||
font-size: 16vw;
|
font-size: 16vw;
|
||||||
line-height: 20.4vw;
|
line-height: 20.4vw;
|
||||||
|
|
|
||||||
94
src/static/js/basic.js
Normal file
94
src/static/js/basic.js
Normal file
|
|
@ -0,0 +1,94 @@
|
||||||
|
/*
|
||||||
|
* Basic sample
|
||||||
|
*/
|
||||||
|
|
||||||
|
function addPage(page, book) {
|
||||||
|
|
||||||
|
var id, pages = book.turn('pages');
|
||||||
|
|
||||||
|
// Create a new element for this page
|
||||||
|
var element = $('<div />', {});
|
||||||
|
|
||||||
|
// Add the page to the flipbook
|
||||||
|
if (book.turn('addPage', element, page)) {
|
||||||
|
|
||||||
|
// Add the initial HTML
|
||||||
|
// It will contain a loader indicator and a gradient
|
||||||
|
element.html('<div class="gradient"></div><div class="loader"></div>');
|
||||||
|
|
||||||
|
// Load the page
|
||||||
|
loadPage(page, element);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadPage(page, pageElement) {
|
||||||
|
|
||||||
|
// Create an image element
|
||||||
|
|
||||||
|
var img = $('<img />');
|
||||||
|
|
||||||
|
img.mousedown(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
img.load(function() {
|
||||||
|
|
||||||
|
// Set the size
|
||||||
|
$(this).css({width: '100%', height: '100%'});
|
||||||
|
|
||||||
|
// Add the image to the page after loaded
|
||||||
|
|
||||||
|
$(this).appendTo(pageElement);
|
||||||
|
|
||||||
|
// Remove the loader indicator
|
||||||
|
|
||||||
|
pageElement.find('.loader').remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Load the page
|
||||||
|
|
||||||
|
img.attr('src', 'pages/' + page + '.jpg');
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function loadLargePage(page, pageElement) {
|
||||||
|
|
||||||
|
var img = $('<img />');
|
||||||
|
|
||||||
|
img.load(function() {
|
||||||
|
|
||||||
|
var prevImg = pageElement.find('img');
|
||||||
|
$(this).css({width: '100%', height: '100%'});
|
||||||
|
$(this).appendTo(pageElement);
|
||||||
|
prevImg.remove();
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
// Loadnew page
|
||||||
|
|
||||||
|
img.attr('src', 'pages/' + page + '-large.jpg');
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function loadSmallPage(page, pageElement) {
|
||||||
|
|
||||||
|
var img = pageElement.find('img');
|
||||||
|
|
||||||
|
img.css({width: '100%', height: '100%'});
|
||||||
|
|
||||||
|
img.unbind('load');
|
||||||
|
// Loadnew page
|
||||||
|
|
||||||
|
img.attr('src', 'pages/' + page + '.jpg');
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// http://code.google.com/p/chromium/issues/detail?id=128488
|
||||||
|
function isChrome() {
|
||||||
|
|
||||||
|
return navigator.userAgent.indexOf('Chrome')!=-1;
|
||||||
|
|
||||||
|
}
|
||||||
4
src/static/js/jquery.min.1.7.js
Normal file
4
src/static/js/jquery.min.1.7.js
Normal file
File diff suppressed because one or more lines are too long
4
src/static/js/modernizr.2.5.3.min.js
vendored
Normal file
4
src/static/js/modernizr.2.5.3.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
48
src/static/js/turn.html4.min.js
vendored
Normal file
48
src/static/js/turn.html4.min.js
vendored
Normal file
|
|
@ -0,0 +1,48 @@
|
||||||
|
/* turn.js 4.1.0 | Copyright (c) 2012 Emmanuel Garcia | turnjs.com | turnjs.com/license.txt */
|
||||||
|
|
||||||
|
(function(f){function s(a,b,c){if(!c[0]||"object"==typeof c[0])return b.init.apply(a,c);if(b[c[0]])return b[c[0]].apply(a,Array.prototype.slice.call(c,1));throw k(c[0]+" is an invalid value");}function q(a,b,c,d){return{css:{position:"absolute",top:a,left:b,overflow:d||"hidden","z-index":c||"auto"}}}function t(a,b,c,d,e){var g=1-e,f=g*g*g,l=e*e*e;return m(Math.round(f*a.x+3*e*g*g*b.x+3*e*e*g*c.x+l*d.x),Math.round(f*a.y+3*e*g*g*b.y+3*e*e*g*c.y+l*d.y))}function m(a,b){return{x:a,y:b}}function j(a,b){return Object.prototype.hasOwnProperty.call(b,
|
||||||
|
a)}function k(a){function b(a){this.name="TurnJsError";this.message=a}b.prototype=Error();b.prototype.constructor=b;return new b(a)}function v(){return""}var r="",n={down:"mousedown",move:"mousemove",up:"mouseup",over:"mouseover",out:"mouseout"},p={backward:["l"],forward:["r"],all:["l","r"]},x=["single","double"],y=["ltr","rtl"],z={acceleration:!0,display:"double",duration:600,page:1,gradients:!0,when:null},A={acceleration:!0,corners:"forward",cornerSize:100,duration:600,gradients:!0},i={init:function(a){if(1<
|
||||||
|
this.length)throw k("This selector has more than 1 element");for(var b=["Moz","Webkit","Khtml","O","ms"],c=b.length,d="";c--;)b[c]+"Transform"in document.body.style&&(d="-"+b[c].toLowerCase()+"-");r=d;var e,b=0,g=this.data(),c=this.children(),a=f.extend({width:this.width(),height:this.height(),direction:this.attr("dir")||this.css("direction")||"ltr"},z,a);g.opts=a;g.pageObjs={};g.pages={};g.pageWrap={};g.pagePlace={};g.pageMv=[];g.zoom=1;g.totalPages=a.pages||0;g.docEvents={mouseStart:function(a){for(var b in g.pages)if(j(b,
|
||||||
|
g.pages)&&!1===h._eventStart.call(g.pages[b],a))return!1},mouseMove:function(a){for(var b in g.pages)j(b,g.pages)&&h._eventMove.call(g.pages[b],a)},mouseEnd:function(a){for(var b in g.pages)j(b,g.pages)&&h._eventEnd.call(g.pages[b],a)}};if(a.when)for(e in a.when)j(e,a.when)&&this.bind(e,a.when[e]);this.css({position:"relative",width:a.width,height:a.height});this.turn("display",a.display);""!==a.direction&&this.turn("direction",a.direction);for(e=0;e<c.length;e++)"1"!=f(c[e]).attr("ignore")&&this.turn("addPage",
|
||||||
|
c[e],++b);f(this).bind(n.down,g.docEvents.mouseStart).bind("start",i._start).bind("end",i._end).bind("pressed",i._pressed).bind("released",i._released).bind("flip",i._flip);f(document).bind(n.move,g.docEvents.mouseMove).bind(n.up,g.docEvents.mouseEnd);this.turn("page",a.page);g.done=!0;return this},addPage:function(a,b){var c,d=!1,e=this.data(),g=e.totalPages+1;if(e.destroying)return!1;if(c=/\bp([0-9]+)\b/.exec(f(a).attr("class")))b=parseInt(c[1],10);if(b)if(b==g)d=!0;else{if(b>g)throw k('Page "'+
|
||||||
|
b+'" cannot be inserted');}else b=g,d=!0;1<=b&&b<=g&&(c="double"==e.display?b%2?" odd":" even":"",e.done&&this.turn("stop"),b in e.pageObjs&&i._movePages.call(this,b,1),d&&(e.totalPages=g),e.pageObjs[b]=f(a).css({"float":"left"}).addClass("page p"+b+c),i._addPage.call(this,b),e.done&&this.turn("update"),i._removeFromDOM.call(this));return this},_addPage:function(a){var b=this.data(),c=b.pageObjs[a];if(c)if(i._necessPage.call(this,a)){if(!b.pageWrap[a]){var d=i._pageSize.call(this,a,!0);c.css({width:d.width,
|
||||||
|
height:d.height});b.pagePlace[a]=a;b.pageWrap[a]=f("<div/>",{"class":"turn-page-wrapper",page:a,css:{position:"absolute",overflow:"hidden"}}).css(d);this.append(b.pageWrap[a]);b.pageWrap[a].prepend(b.pageObjs[a])}(!a||1==i._setPageLoc.call(this,a))&&i._makeFlip.call(this,a)}else b.pagePlace[a]=0,b.pageObjs[a]&&b.pageObjs[a].remove()},hasPage:function(a){return j(a,this.data().pageObjs)},center:function(a){var b=this.data(),c=f(this).turn("size"),d=c.width/(2*b.zoom)-c.width/2;"double"==b.display&&
|
||||||
|
(a=this.turn("view",a||b.tpage||b.page),"ltr"==b.direction?a[0]?a[1]||(d+=c.width/4):d-=c.width/4:a[0]?a[1]||(d-=c.width/4):d+=c.width/4);f(this).css({marginLeft:d});return this},destroy:function(){var a=this.data();a.destroying=!0;f(this).unbind(n.down).unbind("end").unbind("first").unbind("flip").unbind("last").unbind("pressed").unbind("released").unbind("start").unbind("turning").unbind("turned").unbind("zooming");for(f(document).unbind(n.move,a.docEvents.mouseMove).unbind(n.up,a.docEvents.mouseEnd);0!==
|
||||||
|
a.totalPages;)this.turn("removePage",a.totalPages);a.fparent&&a.fparent.remove();a.shadow&&a.shadow.remove();this.removeData();return this},is:function(){return"object"==typeof this.data().pages},zoom:function(a){var b=this.data();if("number"==typeof a){if(0.0010>a||100<a)throw k(a+" is not a value for zoom");var c=f.Event("zooming");this.trigger(c,[a,b.zoom]);if(c.isDefaultPrevented())return this;var c=f(this).turn("size"),d=1/b.zoom,e=Math.round(c.width*d*a),g=Math.round(c.height*d*a);b.zoom=a;
|
||||||
|
f(this).turn("stop").turn("size",e,g).css({marginTop:c.height*d/2-g/2});b.opts.autoCenter?this.turn("center"):f(this).css({marginLeft:c.width*d/2-e/2});i._updateShadow.call(this);return this}return b.zoom},_pageSize:function(a,b){var c=this.data(),d={};if("single"==c.display)d.width=this.width(),d.height=this.height(),b&&(d.top=0,d.left=0,d.right="auto");else{var e=this.width()/2,g=this.height();c.pageObjs[a].hasClass("own-size")?(d.width=c.pageObjs[a].width(),d.height=c.pageObjs[a].height()):(d.width=
|
||||||
|
e,d.height=g);if(b){var f=a%2;d.top=(g-d.height)/2;"ltr"==c.direction?(d[f?"right":"left"]=e-d.width,d[f?"left":"right"]="auto"):(d[f?"left":"right"]=e-d.width,d[f?"right":"left"]="auto")}}return d},_makeFlip:function(a){var b=this.data();if(!b.pages[a]&&b.pagePlace[a]==a){var c="single"==b.display,d=a%2;b.pages[a]=b.pageObjs[a].css(i._pageSize.call(this,a)).flip({page:a,next:d||c?a+1:a-1,turn:this,duration:b.opts.duration,acceleration:b.opts.acceleration,gradients:b.opts.gradients}).flip("disable",
|
||||||
|
b.disabled)}return b.pages[a]},_makeRange:function(){var a,b;if(!(1>this.data().totalPages)){b=this.turn("range");for(a=b[0];a<=b[1];a++)i._addPage.call(this,a)}},range:function(a){var b,c,d,e=this.data(),a=a||e.tpage||e.page||1;d=i._view.call(this,a);if(1>a||a>e.totalPages)throw k('"'+a+'" is not a page for range');d[1]=d[1]||d[0];1<=d[0]&&d[1]<=e.totalPages?(a=Math.floor(2),e.totalPages-d[1]>d[0]?(b=Math.min(d[0]-1,a),c=2*a-b):(c=Math.min(e.totalPages-d[1],a),b=2*a-c)):c=b=5;return[Math.max(1,d[0]-
|
||||||
|
b),Math.min(e.totalPages,d[1]+c)]},_necessPage:function(a){if(0===a)return!0;var b=this.data(),c=this.turn("range");return b.pageObjs[a].hasClass("fixed")||a>=c[0]&&a<=c[1]},_removeFromDOM:function(){var a,b=this.data();for(a in b.pageWrap)j(a,b.pageWrap)&&!i._necessPage.call(this,a)&&i._removePageFromDOM.call(this,a)},_removePageFromDOM:function(a){var b=this.data();if(b.pages[a]){var c=b.pages[a].data();h._moveFoldingPage.call(b.pages[a],!1);c.f&&c.f.fwrapper&&c.f.fwrapper.remove();b.pages[a].removeData();
|
||||||
|
b.pages[a].remove();delete b.pages[a]}b.pageObjs[a]&&b.pageObjs[a].remove();b.pageWrap[a]&&(b.pageWrap[a].remove(),delete b.pageWrap[a]);delete b.pagePlace[a]},removePage:function(a){var b=this.data();if(1>a||a>b.totalPages)throw k("The page "+a+" doesn't exist");b.pageObjs[a]&&(this.turn("stop"),i._removePageFromDOM.call(this,a),delete b.pageObjs[a]);i._movePages.call(this,a,-1);b.totalPages-=1;b.page>b.totalPages?this.turn("page",b.totalPages):i._makeRange.call(this);return this},_movePages:function(a,
|
||||||
|
b){var c,d=this,e=this.data(),g="single"==e.display,f=function(a){var c=a+b,f=c%2,h=f?" odd ":" even ";e.pageObjs[a]&&(e.pageObjs[c]=e.pageObjs[a].removeClass("p"+a+" odd even").addClass("p"+c+h));e.pagePlace[a]&&e.pageWrap[a]&&(e.pagePlace[c]=c,e.pageWrap[c]=e.pageObjs[c].hasClass("fixed")?e.pageWrap[a].attr("page",c):e.pageWrap[a].css(i._pageSize.call(d,c,!0)).attr("page",c),e.pages[a]&&(e.pages[c]=e.pages[a].flip("options",{page:c,next:g||f?c+1:c-1,corners:g?"all":f?"forward":"backward"})),b&&
|
||||||
|
(delete e.pages[a],delete e.pagePlace[a],delete e.pageObjs[a],delete e.pageWrap[a],delete e.pageObjs[a]))};if(0<b)for(c=e.totalPages;c>=a;c--)f(c);else for(c=a;c<=e.totalPages;c++)f(c)},display:function(a){var b=this.data(),c=b.display;if(a){if(-1==f.inArray(a,x))throw k('"'+a+'" is not a value for display');"single"==a?b.pageObjs[0]||(this.turn("stop").css({overflow:"hidden"}),b.pageObjs[0]=f("<div />",{"class":"page p-temporal"}).css({width:this.width(),height:this.height()}).appendTo(this)):b.pageObjs[0]&&
|
||||||
|
(this.turn("stop").css({overflow:""}),b.pageObjs[0].remove(),delete b.pageObjs[0]);b.display=a;c&&(a=this.turn("size"),i._movePages.call(this,1,0),this.turn("size",a.width,a.height).turn("update"));return this}return c},direction:function(a){var b=this.data();if("undefined"==typeof a)return b.direction;a=a.toLowerCase();if(-1==f.inArray(a,y))throw k('"'+a+'" is not a value for direction');"rtl"==a&&f(this).attr("dir","ltr").css({direction:"ltr"});b.direction=a;b.done&&this.turn("size",f(this).width(),
|
||||||
|
f(this).height());return this},animating:function(){return 0<this.data().pageMv.length},disable:function(a){var b,c=this.data(),d=this.turn("view");c.disabled=void 0===a||!0===a;for(b in c.pages)j(b,c.pages)&&c.pages[b].flip("disable",a?f.inArray(b,d):!1);return this},disabled:function(a){return void 0===a?!0===this.data().disabled:this.turn("disable",a)},size:function(a,b){if(a&&b){var c,d,e=this.data();d="double"==e.display?a/2:a;this.css({width:a,height:b});e.pageObjs[0]&&e.pageObjs[0].css({width:d,
|
||||||
|
height:b});for(c in e.pageWrap)j(c,e.pageWrap)&&(d=i._pageSize.call(this,c,!0),e.pageObjs[c].css({width:d.width,height:d.height}),e.pageWrap[c].css(d),e.pages[c]&&e.pages[c].css({width:d.width,height:d.height}));this.turn("resize");return this}return{width:this.width(),height:this.height()}},resize:function(){var a,b=this.data();b.pages[0]&&(b.pageWrap[0].css({left:-this.width()}),b.pages[0].flip("resize",!0));for(a=1;a<=b.totalPages;a++)b.pages[a]&&b.pages[a].flip("resize",!0)},_removeMv:function(a){var b,
|
||||||
|
c=this.data();for(b=0;b<c.pageMv.length;b++)if(c.pageMv[b]==a)return c.pageMv.splice(b,1),!0;return!1},_addMv:function(a){var b=this.data();i._removeMv.call(this,a);b.pageMv.push(a)},_view:function(a){var b=this.data(),a=a||b.page;return"double"==b.display?a%2?[a-1,a]:[a,a+1]:[a]},view:function(a){var b=this.data(),a=i._view.call(this,a);return"double"==b.display?[0<a[0]?a[0]:0,a[1]<=b.totalPages?a[1]:0]:[0<a[0]&&a[0]<=b.totalPages?a[0]:0]},stop:function(){if(this.turn("animating")){var a,b,c,d=this.data(),
|
||||||
|
e=d.pageMv;d.pageMv=[];d.tpage&&(d.page=d.tpage,delete d.tpage);for(a=0;a<e.length;a++)c=d.pages[e[a]],b=c.data().f.opts,c.flip("hideFoldedPage",!1),h._moveFoldingPage.call(c,!1),d.pagePlace[b.next]=b.next,b.force&&(b.next=0===b.page%2?b.page-1:b.page+1,delete b.force)}this.turn("update");return this},pages:function(a){var b=this.data();if(a){if(a<b.totalPages){for(var c=a+1;c<=b.totalPages;c++)this.turn("removePage",c);this.turn("page")>a&&this.turn("page",a)}b.totalPages=a;return this}return b.totalPages},
|
||||||
|
_missing:function(a){for(var b=this.data(),c=this.turn("range",a),d=[],a=c[0];a<=c[1];a++)b.pageObjs[a]||d.push(a);0<d.length&&this.trigger("missing",[d])},_fitPage:function(a){var b=this.data(),c=this.turn("view",a);i._missing.call(this,a);b.pageObjs[a]&&(b.page=a,this.turn("stop"),i._removeFromDOM.call(this),i._makeRange.call(this),i._updateShadow.call(this),this.trigger("turned",[a,c]),b.opts.autoCenter&&this.turn("center"))},_turnPage:function(a,b){var c,d,e=this.data(),g=e.pagePlace[a],h=this.turn("view"),
|
||||||
|
l=this.turn("view",a);if(e.page!=a){var w=f.Event("turning");this.trigger(w,[a,l]);if(w.isDefaultPrevented())return;-1!=f.inArray(1,l)&&this.trigger("first");-1!=f.inArray(e.totalPages,l)&&this.trigger("last")}if(b)this.turn("stop",g);else{i._missing.call(this,a);if(!e.pageObjs[a])return;this.turn("stop");e.page=a}i._makeRange.call(this);"single"==e.display?(c=h[0],d=l[0]):h[1]&&a>h[1]?(c=h[1],d=l[0]):h[0]&&a<h[0]&&(c=h[0],d=l[1]);e.pages[c]&&(g=e.pages[c].data().f.opts,e.tpage=d,g.next!=d&&(g.next=
|
||||||
|
d,e.pagePlace[d]=g.page,g.force=!0),"single"==e.display?"ltr"==e.direction?e.pages[c].flip("turnPage",l[0]>h[0]?"r":"l"):e.pages[c].flip("turnPage",l[0]>h[0]?"l":"r"):e.pages[c].flip("turnPage"))},page:function(a){var a=parseInt(a,10),b=this.data();return 0<a&&a<=b.totalPages?(!b.done||-1!=f.inArray(a,this.turn("view"))?i._fitPage.call(this,a):i._turnPage.call(this,a),this):b.page},next:function(){return this.turn("page",i._view.call(this,this.data().page).pop()+1)},previous:function(){return this.turn("page",
|
||||||
|
i._view.call(this,this.data().page).shift()-1)},peel:function(){return this},_addMotionPage:function(){var a=f(this).data().f.opts,b=a.turn,c=b.data();i._addMv.call(b,a.page);c.pagePlace[a.next]=a.page;b.turn("update")},_start:function(a,b,c){var d=b.turn.data();a.isDefaultPrevented()||("single"==d.display&&c&&("l"==c&&"ltr"==d.direction||"r"==c&&"rtl"==d.direction?(b.next=b.next<b.page?b.next:b.page-1,b.force=!0):b.next=b.next>b.page?b.next:b.page+1),i._addMotionPage.call(a.target));i._updateShadow.call(b.turn)},
|
||||||
|
_end:function(a,b,c){f(a.target).data();var a=b.turn,d=a.data();if(c||d.tpage){if(d.tpage==b.next||d.tpage==b.page)delete d.tpage,i._fitPage.call(a,d.tpage||b.next,!0)}else i._removeMv.call(a,b.page),i._updateShadow.call(a),a.turn("update")},_pressed:function(a){a.stopPropagation();var b,a=f(a.target).data().f,c=a.opts.turn.data().pages;for(b in c)b!=a.opts.page&&c[b].flip("disable",!0);return a.time=(new Date).getTime()},_released:function(a,b){a.stopPropagation();var c,d=f(a.target),e=d.data().f,
|
||||||
|
g=e.opts.turn,u=g.data();c="single"==u.display?"r"==b.corner?b.x<d.width()/2:b.x>d.width()/2:0>b.x||b.x>d.width();if(200>(new Date).getTime()-e.time||c)a.preventDefault(),i._turnPage.call(g,e.opts.next,!1===h._cornerActivated.call(d,b,1));u.mouseAction=!1},_flip:function(a){a.stopPropagation();a=f(a.target).data().f.opts;a.turn.trigger("turn",[a.next]);a.turn.data().opts.autoCenter&&a.turn.turn("center",a.next)},calculateZ:function(a){var b,c,d,e,g=this,f=this.data();b=this.turn("view");var h=b[0]||
|
||||||
|
b[1],i={pageZ:{},partZ:{},pageV:{}},j=function(a){a=g.turn("view",a);a[0]&&(i.pageV[a[0]]=!0);a[1]&&(i.pageV[a[1]]=!0)};for(b=0;b<a.length;b++)c=a[b],d=f.pages[c].data().f.opts.next,e=f.pagePlace[c],j(c),j(d),c=f.pagePlace[d]==d?d:c,i.pageZ[c]=f.totalPages-Math.abs(h-c),i.partZ[e]=2*f.totalPages+Math.abs(h-c);return i},update:function(){var a,b=this.data();if(b.pageMv.length&&0!==b.pageMv[0]){var c,d=this.turn("calculateZ",b.pageMv);this.turn("view",b.tpage);for(a in b.pageWrap)if(j(a,b.pageWrap)&&
|
||||||
|
(c=b.pageObjs[a].hasClass("fixed"),b.pageWrap[a].css({display:d.pageV[a]||c?"":"none","z-index":d.pageZ[a]||(c?-1:0)}),c=b.pages[a]))c.flip("z",d.partZ[a]||null),d.pageV[a]&&c.flip("resize"),b.tpage&&c.flip("disable",!0)}else for(a in b.pageWrap)j(a,b.pageWrap)&&(d=i._setPageLoc.call(this,a),b.pages[a]&&b.pages[a].flip("disable",b.disabled||1!=d).flip("z",null))},_updateShadow:function(){var a,b,c=this.data(),d=this.width(),e=this.height(),g="single"==c.display?d:d/2;a=this.turn("view");c.shadow||
|
||||||
|
(c.shadow=f("<div />",{"class":"shadow",css:q(0,0,0).css}).appendTo(this));for(var h=0;h<c.pageMv.length&&a[0]&&a[1];h++)a=this.turn("view",c.pages[c.pageMv[h]].data().f.opts.next),b=this.turn("view",c.pageMv[h]),a[0]=a[0]&&b[0],a[1]=a[1]&&b[1];switch(a[0]?a[1]?3:"ltr"==c.direction?2:1:"ltr"==c.direction?1:2){case 1:c.shadow.css({width:g,height:e,top:0,left:g});break;case 2:c.shadow.css({width:g,height:e,top:0,left:0});break;case 3:c.shadow.css({width:d,height:e,top:0,left:0})}},_setPageLoc:function(a){var b=
|
||||||
|
this.data(),c=this.turn("view");if(a==c[0]||a==c[1])return b.pageWrap[a].css({zIndex:b.totalPages,display:""}),1;if("single"==b.display&&a==c[0]+1||"double"==b.display&&a==c[0]-2||a==c[1]+2)return b.pageWrap[a].css({zIndex:b.totalPages-1,display:""}),2;b.pageWrap[a].css({zIndex:0,display:b.pageObjs[a].hasClass("fixed")?"":"none"});return 0},options:function(a){if(void 0===a)return this.data().opts;var b=this.data();f.extend(b.opts,a);a.pages&&this.turn("pages",a.pages);a.page&&this.turn("page",a.page);
|
||||||
|
a.display&&this.turn("display",a.display);a.direction&&this.turn("direction",a.direction);a.width&&a.height&&this.turn("size",a.width,a.height);if(a.when)for(var c in a.when)j(c,a.when)&&this.unbind(c).bind(c,a.when[c]);return this},version:function(){return"4.1.0"}},h={init:function(a){this.data({f:{effect:"r"==a.corners||"l"==a.corners?"hard":"sheet"}});this.flip("options",a);h._addPageWrapper.call(this);return this},setData:function(a){var b=this.data();b.f=f.extend(b.f,a);return this},options:function(a){var b=
|
||||||
|
this.data().f;return a?(h.setData.call(this,{opts:f.extend({},b.opts||A,a)}),this):b.opts},z:function(a){var b=this.data().f;b.fwrapper&&(b.opts["z-index"]=a,b.fwrapper.css({"z-index":a||parseInt(b.parent.css("z-index"),10)||0}));return this},_cAllowed:function(){var a=this.data().f,b=a.opts.turn.data(),a=a.opts.page,c=a%2;return"single"==b.display?1==a?"ltr"==b.direction?p.forward:p.backward:a==b.totalPages?"ltr"==b.direction?p.backward:p.forward:p.all:"ltr"==b.direction?p[c?"forward":"backward"]:
|
||||||
|
p[c?"backward":"forward"]},_cornerActivated:function(a){var b=this.data().f,c=b.parent.offset(),d=this.width(),e=this.height(),a={x:Math.max(0,a.pageX-c.left),y:Math.max(0,a.pageY-c.top)},b=b.opts.cornerSize;if(0>=a.x||0>=a.y||a.x>=d||a.y>=e)return!1;e=h._cAllowed.call(this);if(a.x>d-b)a.corner="r";else if(a.x<b)a.corner="l";else return!1;return-1==f.inArray(a.corner,e)?!1:a},_c:function(a,b){b=b||0;switch(a){case "l":return m(b,0);case "r":return m(this.width()-b,0)}},_c2:function(a){switch(a){case "l":return m(2*
|
||||||
|
this.width(),0);case "r":return m(-this.width(),0)}},_foldingPage:function(){var a=this.data().f,b=a.opts;if(a.folding)return a.folding;if(b.turn)return a=b.turn.data(),"single"==a.display?a.pageObjs[b.next]?a.pageObjs[0]:null:a.pageObjs[b.next]},_backGradient:function(){var a=this.data().f,b=a.opts.turn;return a.opts.gradients&&(!b||"single"==b.data().display||2!=a.opts.page&&a.opts.page!=b.data().totalPages-1)},resize:function(a){var b=this.data().f,c=this.width(),d=this.height();a&&(b.wrapper.css({width:c,
|
||||||
|
height:d}),b.fpage.css({width:c,height:d}))},_addPageWrapper:function(){var a=this.data().f,b=this.parent();a.parent=b;if(!a.wrapper){var c={};a.wrapper=f("<div/>",q(0,0,2)).css(c).appendTo(b).prepend(this);a.fpage=f("<div/>",q(0,0,1)).css(c).appendTo(b)}h.resize.call(this,!0)},_fold:function(a){var b=this.data().f,c=h._c.call(this,a.corner),c=c.x?c.x-a.x:a.x,d=this.width();this.height();c=Math.min(2*d,Math.max(0,c));switch(a.corner){case "r":b.wrapper.css({width:Math.max(0,d-c)});this.css({position:"relative",
|
||||||
|
left:-c});b.fpage.css({left:-c+d,width:Math.max(0,c-d)});break;case "l":b.wrapper.css({width:d}),this.css({position:"relative",left:c}),b.fpage.css({left:d,width:Math.max(0,c-d)}),b.folding&&b.folding.css({position:"relative",left:2*-d+c})}b.parent.css({overflow:"visible"});b.point=a},_moveFoldingPage:function(a){var b=this.data().f;if(a){var a=h._foldingPage.call(this),c=b.opts.turn;if(a){if(b.folding){if(b.folding===a)return;h._moveFoldingPage.call(this,!1)}h.setData.call(this,{backParent:a.parent(),
|
||||||
|
folding:a});b.fpage.prepend(a)}c.turn("update")}else b.backParent&&(b.backParent.prepend(b.folding),delete b.backParent,delete b.folding)},_showFoldedPage:function(a,b){var c=h._foldingPage.call(this),d=this.data(),e=d.f,g=e.visible;if(!g||!e.point||e.point.corner!=a.corner){e.opts.turn.data();var i=f.Event("start");this.trigger(i,[e.opts,a.corner]);g=!1;if(i.isDefaultPrevented())return!1}if(c){if(b){var l=this,c=e.point&&e.point.corner==a.corner?e.point:h._c.call(this,a.corner,1);this.animatef({from:[c.x,
|
||||||
|
c.y],to:[a.x,a.y],duration:500,frame:function(b){a.x=Math.round(b[0]);a.y=Math.round(b[1]);h._fold.call(l,a)}})}else h._fold.call(this,a),d.effect&&!d.effect.turning&&this.animatef(!1);g||(e.visible=!0,h._moveFoldingPage.call(this,!0),e.fpage.show());return!0}return!1},hide:function(){var a=this.data().f;h._foldingPage.call(this);this.css({position:"",left:"auto"});a.wrapper.css({width:this.width()});a.fpage.css({width:this.width()});a.folding&&a.folding.css({position:"",left:"auto"});a.fpage.hide();
|
||||||
|
a.visible=!1;return this},hideFoldedPage:function(a){var b=this.data().f;if(b.point){var c=this,d=b.point,e=function(){b.point=null;c.flip("hide");c.trigger("end",[b.opts,!1])};if(a){var g=h._c.call(this,d.corner),a="t"==d.corner.substr(0,1)?Math.min(0,d.y-g.y)/2:Math.max(0,d.y-g.y)/2,f=m(d.x,d.y+a),i=m(g.x,g.y-a);this.animatef({from:0,to:1,frame:function(a){a=t(d,f,i,g,a);d.x=a.x;d.y=a.y;h._fold.call(c,d)},complete:e,duration:800,hiding:!0})}else this.animatef(!1),e()}},turnPage:function(a){var b=
|
||||||
|
this,c=this.data().f,a={corner:c.corner?c.corner.corner:a||h._cAllowed.call(this)[0]},d=c.point||h._c.call(this,a.corner,c.opts.turn?c.opts.turn.data().opts.elevation:0),e=h._c2.call(this,a.corner);this.trigger("flip").animatef({from:0,to:1,frame:function(c){c=t(d,d,e,e,c);a.x=c.x;a.y=c.y;h._showFoldedPage.call(b,a)},complete:function(){b.trigger("end",[c.opts,!0])},duration:c.opts.duration,turning:!0});c.corner=null},moving:function(){return"effect"in this.data()},isTurning:function(){return this.flip("moving")&&
|
||||||
|
this.data().effect.turning},_eventStart:function(a){var b=this.data().f;if(!b.disabled&&!this.flip("isTurning")){b.corner=h._cornerActivated.call(this,a);if(b.corner&&h._foldingPage.call(this,b.corner))return h._showFoldedPage.call(this,b.corner)&&this.trigger("pressed",[b.point]),!1;b.corner=null}},_eventMove:function(a){var b=this.data().f;if(!b.disabled)if(a=[a],b.corner){var c=b.parent.offset();b.corner.x=a[0].pageX-c.left;b.corner.y=a[0].pageY-c.top;h._showFoldedPage.call(this,b.corner)}else!this.data().effect&&
|
||||||
|
this.is(":visible")&&((a=h._cornerActivated.call(this,a[0]))?(b=h._c.call(this,a.corner,b.opts.cornerSize/2),a.x=b.x,a.y=b.y,h._showFoldedPage.call(this,a,!0)):h.hideFoldedPage.call(this,!0))},_eventEnd:function(){var a=this.data().f;if(!a.disabled&&a.point){var b=f.Event("released");this.trigger(b,[a.point]);b.isDefaultPrevented()||h.hideFoldedPage.call(this,!0)}a.corner=null},disable:function(a){h.setData.call(this,{disabled:a});return this}};window.requestAnim=function(a){window.setTimeout(a,1E3/
|
||||||
|
60)};f.extend(f.fn,{flip:function(a,b){return s(this,h,arguments)},turn:function(a){return s(this,i,arguments)},transform:function(a,b){var c={};b&&(c[r+"transform-origin"]=b);c[r+"transform"]=a;return this.css(c)},animatef:function(a){var b=this.data();b.effect&&b.effect.stop();if(a){a.to.length||(a.to=[a.to]);a.from.length||(a.from=[a.from]);for(var c=[],d=a.to.length,e=!0,g=this,h=(new Date).getTime(),i=function(){if(b.effect&&e){for(var f=[],j=Math.min(a.duration,(new Date).getTime()-h),k=0;k<
|
||||||
|
d;k++)f.push(b.effect.easing(1,j,a.from[k],c[k],a.duration));a.frame(1==d?f[0]:f);j==a.duration?(delete b.effect,g.data(b),a.complete&&a.complete()):window.requestAnim(i)}},j=0;j<d;j++)c.push(a.to[j]-a.from[j]);b.effect=f.extend({stop:function(){e=!1},easing:function(a,b,c,d,e){return d*Math.sqrt(1-(b=b/e-1)*b)+c}},a);this.data(b);i()}else delete b.effect}});f.isTouch=!1;f.mouseEvents=n;f.cssPrefix=v;f.cssTransitionEnd=v;f.findPos=function(a){var b={top:0,left:0};do b.left+=a.offsetLeft,b.top+=a.offsetTop;
|
||||||
|
while(a=a.offsetParent);return b}})(jQuery);
|
||||||
3352
src/static/js/turn.js
Normal file
3352
src/static/js/turn.js
Normal file
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue