updated changes as per Richard investory
This commit is contained in:
+28
-99
@@ -12,6 +12,10 @@
|
|||||||
<link rel="stylesheet" href="dist/css/style.css" />
|
<link rel="stylesheet" href="dist/css/style.css" />
|
||||||
<link rel="stylesheet" href="src/scss/added.css" />
|
<link rel="stylesheet" href="src/scss/added.css" />
|
||||||
<link rel="icon" href="./dist/images/logo_greens.png" />
|
<link rel="icon" href="./dist/images/logo_greens.png" />
|
||||||
|
<!-- Material icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
|
||||||
|
rel="stylesheet">
|
||||||
|
|
||||||
<script src="https://unpkg.com/scrollreveal@4.0.0/dist/scrollreveal.min.js"></script>
|
<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="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||||
<script src="./dist/js/jquery.countdown.js"></script>
|
<script src="./dist/js/jquery.countdown.js"></script>
|
||||||
@@ -216,28 +220,12 @@
|
|||||||
<div class="feature is-revealing">
|
<div class="feature is-revealing">
|
||||||
<div class="feature-inner">
|
<div class="feature-inner">
|
||||||
<div class="feature-icon">
|
<div class="feature-icon">
|
||||||
<svg
|
<i class="material-icons">
|
||||||
width="48"
|
compare_arrows
|
||||||
height="48"
|
</i>
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<g
|
|
||||||
fill="none"
|
|
||||||
fill-rule="evenodd"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
fill="#84E482"
|
|
||||||
d="M48 16v32H16z"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
fill="#0EB3CE"
|
|
||||||
d="M0 0h32v32H0z"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<h4 class="feature-title h3-mobile">
|
<h4 class="feature-title h3-mobile">
|
||||||
Value Matching
|
Charity Discovery
|
||||||
</h4>
|
</h4>
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
Focus on the people you care about
|
Focus on the people you care about
|
||||||
@@ -249,31 +237,9 @@
|
|||||||
<div class="feature is-revealing">
|
<div class="feature is-revealing">
|
||||||
<div class="feature-inner">
|
<div class="feature-inner">
|
||||||
<div class="feature-icon">
|
<div class="feature-icon">
|
||||||
<svg
|
<i class="material-icons">
|
||||||
width="48"
|
touch_app
|
||||||
height="48"
|
</i>
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<g
|
|
||||||
fill="none"
|
|
||||||
fill-rule="evenodd"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
fill="#84E482"
|
|
||||||
d="M48 16v32H16z"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
fill="#0EB3CE"
|
|
||||||
d="M0 0v32h32z"
|
|
||||||
/>
|
|
||||||
<circle
|
|
||||||
fill="#02C6A4"
|
|
||||||
cx="29"
|
|
||||||
cy="9"
|
|
||||||
r="4"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<h4 class="feature-title h3-mobile">
|
<h4 class="feature-title h3-mobile">
|
||||||
Trust and Engagement
|
Trust and Engagement
|
||||||
@@ -291,25 +257,9 @@
|
|||||||
<div class="feature is-revealing">
|
<div class="feature is-revealing">
|
||||||
<div class="feature-inner">
|
<div class="feature-inner">
|
||||||
<div class="feature-icon">
|
<div class="feature-icon">
|
||||||
<svg
|
<i class="material-icons">
|
||||||
width="48"
|
filter_b_and_w
|
||||||
height="48"
|
</i>
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<g
|
|
||||||
fill="none"
|
|
||||||
fill-rule="evenodd"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
fill="#0EB3CE"
|
|
||||||
d="M0 0h32v32H0z"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
fill="#84E482"
|
|
||||||
d="M16 16h32L16 48z"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<h4 class="feature-title h3-mobile">
|
<h4 class="feature-title h3-mobile">
|
||||||
Global Impact
|
Global Impact
|
||||||
@@ -324,33 +274,12 @@
|
|||||||
<div class="feature is-revealing">
|
<div class="feature is-revealing">
|
||||||
<div class="feature-inner">
|
<div class="feature-inner">
|
||||||
<div class="feature-icon">
|
<div class="feature-icon">
|
||||||
<svg
|
<i class="material-icons">
|
||||||
width="48"
|
remove_red_eye
|
||||||
height="48"
|
</i>
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<g
|
|
||||||
fill="none"
|
|
||||||
fill-rule="evenodd"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M32 40H0c0-8.837 7.163-16 16-16s16 7.163 16 16z"
|
|
||||||
fill="#84E482"
|
|
||||||
style="mix-blend-mode:multiply"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
fill="#03C5A4"
|
|
||||||
d="M12 8h8v8h-8z"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
fill="#0EB3CE"
|
|
||||||
d="M32 0h16v48H32z"
|
|
||||||
/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<h4 class="feature-title h3-mobile">
|
<h4 class="feature-title h3-mobile">
|
||||||
Payment
|
Secure Donations
|
||||||
</h4>
|
</h4>
|
||||||
<p class="text-sm">
|
<p class="text-sm">
|
||||||
We're ensuring that it safely reaches the right hands,
|
We're ensuring that it safely reaches the right hands,
|
||||||
@@ -373,13 +302,13 @@
|
|||||||
<h2 class="section-title mt-0">How it works</h2>
|
<h2 class="section-title mt-0">How it works</h2>
|
||||||
<p class="section-paragraph">Your one place to track and manage all of your grants, and maximize your impact globally. We care about what happens after the transaction.</p>
|
<p class="section-paragraph">Your one place to track and manage all of your grants, and maximize your impact globally. We care about what happens after the transaction.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="feature-extended">
|
<div class="feature-extended">
|
||||||
<div class="feature-extended-image is-revealing">
|
<!-- <div class="feature-extended-image is-revealing">
|
||||||
<img src="dist/images/grants_list.png" alt="Feature extended 01">
|
<img src="dist/images/grants_list.png" alt="Feature extended 01">
|
||||||
</div>
|
</div> -->
|
||||||
<div class="feature-extended-body">
|
<div class="feature-extended-body">
|
||||||
<h3 class="mt-0">Create a Grant</h3>
|
<h3 class="mt-0">Choose who to give</h3>
|
||||||
<p>Choose <b>causes and regions</b> you want to support.
|
<p>Choose <b>causes and regions</b> you want to support.
|
||||||
Look at
|
Look at
|
||||||
the
|
the
|
||||||
@@ -390,22 +319,22 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="feature-extended">
|
<div class="feature-extended">
|
||||||
<div class="feature-extended-image is-revealing">
|
<!-- <div class="feature-extended-image is-revealing">
|
||||||
<img src="dist/images/grant_detail.png" alt="Feature extended 02">
|
<img src="dist/images/grant_detail.png" alt="Feature extended 02">
|
||||||
</div>
|
</div> -->
|
||||||
<div class="feature-extended-body">
|
<div class="feature-extended-body">
|
||||||
<h3 class="mt-0">Stay engaged with the people you support</h3>
|
<h3 class="mt-0">Stay engaged with your charities</h3>
|
||||||
<p>Keep track of where your money is being used, by seeing the progress of the projects
|
<p>Keep track of where your money is being used, by seeing the progress of the projects
|
||||||
that your involved in.</p>
|
that your involved in.</p>
|
||||||
<p>View <b>live media updates</b> along with other <b>transparent metrics</b> from charities.</p>
|
<p>View <b>live media updates</b> along with other <b>transparent metrics</b> from charities.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="feature-extended">
|
<div class="feature-extended">
|
||||||
<div class="feature-extended-image is-revealing">
|
<!-- <div class="feature-extended-image is-revealing">
|
||||||
<img src="dist/images/payment_history.png" alt="Feature extended 03">
|
<img src="dist/images/payment_history.png" alt="Feature extended 03">
|
||||||
</div>
|
</div> -->
|
||||||
<div class="feature-extended-body">
|
<div class="feature-extended-body">
|
||||||
<h3 class="mt-0">We keep payments simple</h3>
|
<h3 class="mt-0">We keep donations simple</h3>
|
||||||
<p>Whether you create one grant for a few charities or twenty grants
|
<p>Whether you create one grant for a few charities or twenty grants
|
||||||
for <b>a hundred charities</b>, transactions are easy to manage. Come tax
|
for <b>a hundred charities</b>, transactions are easy to manage. Come tax
|
||||||
season,
|
season,
|
||||||
|
|||||||
+112
-115
@@ -1,121 +1,118 @@
|
|||||||
|
|
||||||
/* All that I added for styles */
|
/* All that I added for styles */
|
||||||
|
.material-icons {
|
||||||
|
font-size: 40px !important;
|
||||||
|
color: teal;
|
||||||
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
height: 80px;
|
height: 80px;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#countdown {
|
#countdown {
|
||||||
margin: 120px 0 100px 0;
|
margin: 120px 0 100px 0;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
color: #BDBDBD;
|
color: #bdbdbd;
|
||||||
}
|
}
|
||||||
.time-factor {
|
.time-factor {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
|
|
||||||
flex: 0 0 120px;
|
flex: 0 0 120px;
|
||||||
border-right: 1px solid #B2EBF2;
|
border-right: 1px solid #b2ebf2;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
min-width: 120px;
|
min-width: 120px;
|
||||||
|
}
|
||||||
}
|
.right-most {
|
||||||
.right-most {
|
border: none;
|
||||||
border: none;
|
}
|
||||||
}
|
.number-text {
|
||||||
.number-text {
|
font-size: 2em;
|
||||||
font-size: 2em;
|
color: #1e4d92;
|
||||||
color: #1E4D92;
|
}
|
||||||
}
|
|
||||||
|
.join-paragraph {
|
||||||
|
font-size: 0.8em;
|
||||||
|
}
|
||||||
.join-paragraph {
|
.hero-cta {
|
||||||
font-size: 0.8em;
|
display: flex;
|
||||||
}
|
justify-content: center;
|
||||||
.hero-cta {
|
align-items: stretch;
|
||||||
display: flex;
|
}
|
||||||
justify-content: center;
|
.email-input {
|
||||||
align-items: stretch;
|
margin-right: 5px;
|
||||||
}
|
padding: 5px 10px;
|
||||||
.email-input {
|
border: none;
|
||||||
margin-right: 5px;
|
min-width: 250px;
|
||||||
padding: 5px 10px;
|
box-shadow: 0 8px 24px rgba(32, 43, 54, 0.12);
|
||||||
border: none;
|
}
|
||||||
min-width: 250px;
|
#popup {
|
||||||
box-shadow: 0 8px 24px rgba(32,43,54,0.12);
|
position: fixed;
|
||||||
}
|
top: 30px;
|
||||||
#popup {
|
margin-top: 1em;
|
||||||
position: fixed;
|
left: 50%;
|
||||||
top: 30px;
|
margin-right: -50%;
|
||||||
margin-top: 1em;
|
transform: translate(-50%, -50%);
|
||||||
left: 50%;
|
z-index: 2;
|
||||||
margin-right: -50%;
|
background-color: rgb(49, 49, 49);
|
||||||
transform: translate(-50%, -50%);
|
color: white;
|
||||||
z-index: 2;
|
font-size: 0.8em;
|
||||||
background-color: rgb(49, 49, 49);
|
padding: 0.2em 0.7em;
|
||||||
color: white;
|
border-radius: 3px;
|
||||||
font-size: 0.8em;
|
display: none;
|
||||||
padding: 0.2em 0.7em;
|
}
|
||||||
border-radius: 3px;
|
|
||||||
display: none;
|
.hero-media video {
|
||||||
}
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.hero-media video {
|
.slideshow-container {
|
||||||
max-width: 100%;
|
box-shadow: 0 8px 24px rgba(32, 43, 54, 0.12);
|
||||||
}
|
}
|
||||||
|
.mySlides {
|
||||||
.slideshow-container {
|
display: none;
|
||||||
box-shadow: 0 8px 24px rgba(32,43,54,0.12);
|
width: 100%;
|
||||||
}
|
height: 100%;
|
||||||
.mySlides {
|
}
|
||||||
display:none;
|
|
||||||
width: 100%;
|
.sponsor {
|
||||||
height: 100%;
|
min-height: 40px;
|
||||||
}
|
max-width: 200px;
|
||||||
|
max-height: 100px;
|
||||||
|
/* max-width: 200px;
|
||||||
.sponsor {
|
|
||||||
min-height: 40px;
|
|
||||||
max-width: 200px;
|
|
||||||
max-height: 100px;
|
|
||||||
/* max-width: 200px;
|
|
||||||
height: 80px; */
|
height: 80px; */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.testimonial-position {
|
|
||||||
margin-left: 10px;
|
|
||||||
font-size: 13px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
.testimonial-position {
|
||||||
.site-footer {
|
margin-left: 10px;
|
||||||
background: #0f8a9d;
|
font-size: 13px;
|
||||||
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 {
|
.site-footer {
|
||||||
display: flex;
|
background: #0f8a9d;
|
||||||
flex-direction: column;
|
background: linear-gradient(57deg, #00c6a7 0%, #1e4d92 100%);
|
||||||
align-items: flex-end;
|
/* -webkit-transform-origin: 0; */
|
||||||
}
|
transform-origin: 0;
|
||||||
|
/* -webkit-transform: skewY(-12deg); */
|
||||||
|
/* transform: skewY(-12deg); */
|
||||||
|
}
|
||||||
|
.email-me {
|
||||||
|
font-size: 1.5em;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
.small-white-font {
|
.footer-links {
|
||||||
font-size: 1em;
|
display: flex;
|
||||||
color: #f3e5f5;
|
flex-direction: column;
|
||||||
}
|
align-items: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.small-white-font {
|
||||||
|
font-size: 1em;
|
||||||
|
color: #f3e5f5;
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user