talksik/ucharify_landing
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

adding in the basic testimonials and all

Browse Source
This commit is contained in:
Arjun Patel
2019-02-25 00:18:46 -08:00
parent 4ebde0907f
commit 62e86b115e
12 changed files with 154 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/css/style.css
Vendored
+2 -110
View File
File diff suppressed because one or more lines are too long
dist/images/amal_headshot.jpg
Vendored
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

dist/images/digo_pic.jpeg
Vendored
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.8 KiB

dist/images/grant_detail.png
Vendored
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 74 KiB

dist/images/grants_list.png
Vendored
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

dist/images/payment_history.png
Vendored
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

dist/images/testimonial-01.JPG
Vendored
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.4 KiB

dist/js/added.js
Vendored
+19 -11
View File
@@ -12,24 +12,32 @@ $(document).ready(function() {
$('#email-form').submit(function(e) {
e.preventDefault();
$('#popup')
.text('Added to list! Thank you for joining!')
.slideDown()
.delay(4000)
.slideUp();
$.ajax({
url: 'https://ucharify-api.herokuapp.com/api/users/landing',
type: 'post',
data: $('#email-form').serialize(),
success: function(data) {
//whatever you wanna do after the form is successfully submitted
$('#popup')
.text('Added to list! Thank you for joining!')
.slideDown()
.delay(4000)
.slideUp();
// whatever you wanna do after the form is successfully submitted
// $('#popup')
// .text('Added to list! Thank you for joining!')
// .slideDown()
// .delay(4000)
// .slideUp();
console.log('successfully added email');
},
error: function(error) {
$('#popup')
.text('Email invalid or exists')
.slideDown()
.delay(4000)
.slideUp();
// $('#popup')
// .text('Email invalid or exists')
// .slideDown()
// .delay(4000)
// .slideUp();
console.log('invalid or exists email');
}
});
});
dist/js/main.min.js
Vendored
+1 -34
View File
@@ -1,34 +1 @@
!(function() {
const e = document.documentElement;
if (
(e.classList.remove('no-js'),
e.classList.add('js'),
document.body.classList.contains('has-animations'))
) {
const e = (window.sr = ScrollReveal());
e.reveal(
'.hero-title, .hero-paragraph, .join-paragraph, .hero-cta, #countdown, .testimonial',
{
duration: 1e3,
distance: '40px',
easing: 'cubic-bezier(0.5, -0.01, 0, 1.005)',
origin: 'bottom',
interval: 150
}
),
e.reveal('.feature, .pricing-table', {
duration: 600,
distance: '40px',
easing: 'cubic-bezier(0.5, -0.01, 0, 1.005)',
interval: 100,
origin: 'bottom',
viewFactor: 0.5
}),
e.reveal('.feature-extended-image', {
duration: 600,
scale: 0.9,
easing: 'cubic-bezier(0.5, -0.01, 0, 1.005)',
viewFactor: 0.5
});
}
})();
!function(){const e=document.documentElement;if(e.classList.remove("no-js"),e.classList.add("js"),document.body.classList.contains("has-animations")){const e=window.sr=ScrollReveal();e.reveal(".hero-title, .hero-paragraph, .hero-cta",{duration:1e3,distance:"40px",easing:"cubic-bezier(0.5, -0.01, 0, 1.005)",origin:"bottom",interval:150}),e.reveal(".feature, .pricing-table",{duration:600,distance:"40px",easing:"cubic-bezier(0.5, -0.01, 0, 1.005)",interval:100,origin:"bottom",viewFactor:.5}),e.reveal(".feature-extended-image, .testimonial",{duration:600,scale:.9,easing:"cubic-bezier(0.5, -0.01, 0, 1.005)",viewFactor:.5})}}();
index.html
+11 -64
View File
@@ -10,10 +10,12 @@
rel="stylesheet"
/>
<link rel="stylesheet" href="dist/css/style.css" />
<link rel="stylesheet" href="src/scss/added.css" />
<link rel="icon" href="./dist/images/logo_greens.png" />
<script src="https://unpkg.com/scrollreveal@4.0.0/dist/scrollreveal.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="./dist/js/jquery.countdown.js"></script>
</head>
<body class="is-boxed has-animations">
<div class="body-wrap boxed-container">
@@ -85,6 +87,7 @@
Join List
</button>
</form>
<!-- <div id="countdown"></div> -->
@@ -357,26 +360,7 @@
</div>
<div class="feature-extended">
<div class="feature-extended-image is-revealing">
<svg width="480" height="360" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter x="-500%" y="-500%" width="1000%" height="1000%" filterUnits="objectBoundingBox" id="dropshadow-1">
<feOffset dy="16" in="SourceAlpha" result="shadowOffsetOuter"/>
<feGaussianBlur stdDeviation="24" in="shadowOffsetOuter" result="shadowBlurOuter"/>
<feColorMatrix values="0 0 0 0 0.12 0 0 0 0 0.17 0 0 0 0 0.21 0 0 0 0.2 0" in="shadowBlurOuter"/>
</filter>
</defs>
<path fill="#F6F8FA" d="M0 220V0h200zM480 140v220H280z"/>
<path fill="#FFF" d="M40 50h400v260H40z" style="mix-blend-mode:multiply;filter:url(#dropshadow-1)"/>
<path fill="#FFF" d="M40 50h400v260H40z"/>
<path fill="#FFF" d="M103 176h80v160h-80zM320 24h88v88h-88z" style="mix-blend-mode:multiply;filter:url(#dropshadow-1)"/>
<path fill="#FFF" d="M103 176h80v160h-80zM320 24h88v88h-88z"/>
<path fill="#FFF" d="M230.97 198l16.971 16.971-16.97 16.97L214 214.972z" style="mix-blend-mode:multiply;filter:url(#dropshadow-1)"/>
<path fill="#02C6A4" d="M230.97 198l16.971 16.971-16.97 16.97L214 214.972z"/>
<path fill="#FFF" d="M203 121H103v100z" style="mix-blend-mode:multiply;filter:url(#dropshadow-1)"/>
<path fill="#84E482" d="M203 121H103v100z"/>
<circle fill="#FFF" cx="288" cy="166" r="32" style="mix-blend-mode:multiply;filter:url(#dropshadow-1)"/>
<circle fill="#0EB3CE" cx="288" cy="166" r="32" style="mix-blend-mode:multiply"/>
</svg>
<img src="dist/images/grants_list.png" alt="Feature extended 01">
</div>
<div class="feature-extended-body">
<h3 class="mt-0">Create a Grant</h3>
@@ -391,26 +375,7 @@
</div>
<div class="feature-extended">
<div class="feature-extended-image is-revealing">
<svg width="480" height="360" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter x="-500%" y="-500%" width="1000%" height="1000%" filterUnits="objectBoundingBox" id="dropshadow-2">
<feOffset dy="16" in="SourceAlpha" result="shadowOffsetOuter"/>
<feGaussianBlur stdDeviation="24" in="shadowOffsetOuter" result="shadowBlurOuter"/>
<feColorMatrix values="0 0 0 0 0.12 0 0 0 0 0.17 0 0 0 0 0.21 0 0 0 0.2 0" in="shadowBlurOuter"/>
</filter>
</defs>
<path fill="#F6F8FA" d="M480 140v220H280zM0 220V0h200z"/>
<path fill="#FFF" d="M40 50h400v260H40z" style="mix-blend-mode:multiply;filter:url(#dropshadow-2)"/>
<path fill="#FFF" d="M40 50h400v260H40z"/>
<path fill="#FFF" d="M86.225 161l62.226 62.225-62.226 62.225L24 223.225zM296 176h80v160h-80z" style="mix-blend-mode:multiply;filter:url(#dropshadow-2)"/>
<path fill="#FFF" d="M86.225 161l62.226 62.225-62.226 62.225L24 223.225zM296 176h80v160h-80z"/>
<path fill="#FFF" d="M245.092 218l9.378 22.092-22.093 9.378L223 227.378z" style="mix-blend-mode:multiply;filter:url(#dropshadow-2)"/>
<path fill="#02C6A4" d="M245.092 218l9.378 22.092-22.093 9.378L223 227.378z"/>
<path fill="#FFF" d="M270 96H170v100z" style="mix-blend-mode:multiply;filter:url(#dropshadow-2)"/>
<path fill="#84E482" d="M270 96H170v100z"/>
<circle fill="#FFF" cx="296" cy="177" r="32" style="mix-blend-mode:multiply;filter:url(#dropshadow-2)"/>
<circle fill="#0EB3CE" cx="296" cy="177" r="32" style="mix-blend-mode:multiply"/>
</svg>
<img src="dist/images/grant_detail.png" alt="Feature extended 02">
</div>
<div class="feature-extended-body">
<h3 class="mt-0">Stay engaged with the people you support</h3>
@@ -420,26 +385,7 @@
</div>
<div class="feature-extended">
<div class="feature-extended-image is-revealing">
<svg width="480" height="360" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter x="-500%" y="-500%" width="1000%" height="1000%" filterUnits="objectBoundingBox" id="dropshadow-3">
<feOffset dy="16" in="SourceAlpha" result="shadowOffsetOuter"/>
<feGaussianBlur stdDeviation="24" in="shadowOffsetOuter" result="shadowBlurOuter"/>
<feColorMatrix values="0 0 0 0 0.12 0 0 0 0 0.17 0 0 0 0 0.21 0 0 0 0.2 0" in="shadowBlurOuter"/>
</filter>
</defs>
<path fill="#F6F8FA" d="M480 140v220H280zM0 220V0h200z"/>
<path fill="#FFF" d="M40 50h400v260H40z" style="mix-blend-mode:multiply;filter:url(#dropshadow-3)"/>
<path fill="#FFF" d="M40 50h400v260H40z"/>
<path fill="#FFF" d="M72 248h88v88H72zM180 24h80v160h-80z" style="mix-blend-mode:multiply;filter:url(#dropshadow-3)"/>
<path fill="#FFF" d="M72 248h88v88H72zM180 24h80v160h-80z"/>
<path fill="#FFF" d="M277.664 261.919l-18.113 15.745-15.746-18.113 18.113-15.745z" style="mix-blend-mode:multiply;filter:url(#dropshadow-3)"/>
<path fill="#02C6A4" d="M277.664 261.919l-18.113 15.745-15.746-18.113 18.113-15.745z"/>
<path fill="#FFF" d="M315 129H215v100z" style="mix-blend-mode:multiply;filter:url(#dropshadow-3)"/>
<path fill="#84E482" d="M315 129H215v100z"/>
<circle fill="#FFF" cx="318" cy="219" r="32" style="mix-blend-mode:multiply;filter:url(#dropshadow-3)"/>
<circle fill="#0EB3CE" cx="318" cy="219" r="32" style="mix-blend-mode:multiply"/>
</svg>
<img src="dist/images/payment_history.png" alt="Feature extended 03">
</div>
<div class="feature-extended-body">
<h3 class="mt-0">We keep payments simple</h3>
@@ -454,7 +400,7 @@
</section>
<!-- Pricing Section -->
<section class="pricing section">
<!-- <section class="pricing section">
<div class="container">
<div class="pricing-inner section-inner has-top-divider">
<h2 class="section-title mt-0 text-center">Pricing</h2>
@@ -548,7 +494,7 @@
</div>
</div>
</div>
</section>
</section> -->
</main>
<section class="testimonials section">
@@ -709,7 +655,8 @@
<li><a href="#">About us</a></li>
<li><a href="#">FAQ's</a></li>
<li><a href="#">Support</a></li> -->
<li><p class="email-me">ceo@ucharify.com</p></li>
<li><p class="email-me">arjun@ucharify.com</p></li>
<li><p class="small-white-font">(949)923-0445</p></li>
</ul>
<ul class="footer-social-links list-reset">
<li>
@@ -764,7 +711,7 @@
</a>
</li>
</ul>
<div class="footer-copyright">
<div class="footer-copyright small-white-font">
&copy; 2019 Ucharify, all rights reserved
</div>
</div>
package-sample.json → package.json
View File
src/scss/added.css
+121
View File
@@ -0,0 +1,121 @@
/* All that I added for styles */
.logo {
height: 80px;
width: 80px;
}
#countdown {
margin: 120px 0 100px 0;
display: flex;
justify-content: center;
flex-wrap: wrap;
color: #BDBDBD;
}
.time-factor {
margin: 0;
padding: 1em;
flex: 0 0 120px;
border-right: 1px solid #B2EBF2;
display: flex;
flex-direction: column;
min-width: 120px;
}
.right-most {
border: none;
}
.number-text {
font-size: 2em;
color: #1E4D92;
}
.join-paragraph {
font-size: 0.8em;
}
.hero-cta {
display: flex;
justify-content: center;
align-items: stretch;
}
.email-input {
margin-right: 5px;
padding: 5px 10px;
border: none;
min-width: 250px;
box-shadow: 0 8px 24px rgba(32,43,54,0.12);
}
#popup {
position: fixed;
top: 30px;
margin-top: 1em;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
z-index: 2;
background-color: rgb(49, 49, 49);
color: white;
font-size: 0.8em;
padding: 0.2em 0.7em;
border-radius: 3px;
display: none;
}
.hero-media video {
max-width: 100%;
}
.slideshow-container {
box-shadow: 0 8px 24px rgba(32,43,54,0.12);
}
.mySlides {
display:none;
width: 100%;
height: 100%;
}
.sponsor {
min-height: 40px;
max-width: 200px;
max-height: 100px;
/* max-width: 200px;
height: 80px; */
}
.testimonial-position {
margin-left: 10px;
font-size: 13px;
}
.site-footer {
background: #0f8a9d;
background: linear-gradient(57deg, #00C6A7 0%, #1E4D92 100%);
/* -webkit-transform-origin: 0; */
transform-origin: 0;
/* -webkit-transform: skewY(-12deg); */
/* transform: skewY(-12deg); */
}
.email-me {
font-size: 1.5em;
color: white;
}
.footer-links {
display: flex;
flex-direction: column;
align-items: flex-end;
}
.small-white-font {
font-size: 1em;
color: #f3e5f5;
}