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="src/scss/added.css" />
|
||||
<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://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||
<script src="./dist/js/jquery.countdown.js"></script>
|
||||
@@ -216,28 +220,12 @@
|
||||
<div class="feature is-revealing">
|
||||
<div class="feature-inner">
|
||||
<div class="feature-icon">
|
||||
<svg
|
||||
width="48"
|
||||
height="48"
|
||||
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>
|
||||
<i class="material-icons">
|
||||
compare_arrows
|
||||
</i>
|
||||
</div>
|
||||
<h4 class="feature-title h3-mobile">
|
||||
Value Matching
|
||||
Charity Discovery
|
||||
</h4>
|
||||
<p class="text-sm">
|
||||
Focus on the people you care about
|
||||
@@ -249,31 +237,9 @@
|
||||
<div class="feature is-revealing">
|
||||
<div class="feature-inner">
|
||||
<div class="feature-icon">
|
||||
<svg
|
||||
width="48"
|
||||
height="48"
|
||||
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>
|
||||
<i class="material-icons">
|
||||
touch_app
|
||||
</i>
|
||||
</div>
|
||||
<h4 class="feature-title h3-mobile">
|
||||
Trust and Engagement
|
||||
@@ -291,25 +257,9 @@
|
||||
<div class="feature is-revealing">
|
||||
<div class="feature-inner">
|
||||
<div class="feature-icon">
|
||||
<svg
|
||||
width="48"
|
||||
height="48"
|
||||
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>
|
||||
<i class="material-icons">
|
||||
filter_b_and_w
|
||||
</i>
|
||||
</div>
|
||||
<h4 class="feature-title h3-mobile">
|
||||
Global Impact
|
||||
@@ -324,33 +274,12 @@
|
||||
<div class="feature is-revealing">
|
||||
<div class="feature-inner">
|
||||
<div class="feature-icon">
|
||||
<svg
|
||||
width="48"
|
||||
height="48"
|
||||
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>
|
||||
<i class="material-icons">
|
||||
remove_red_eye
|
||||
</i>
|
||||
</div>
|
||||
<h4 class="feature-title h3-mobile">
|
||||
Payment
|
||||
Secure Donations
|
||||
</h4>
|
||||
<p class="text-sm">
|
||||
We're ensuring that it safely reaches the right hands,
|
||||
@@ -373,13 +302,13 @@
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
</div>
|
||||
</div> -->
|
||||
<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.
|
||||
Look at
|
||||
the
|
||||
@@ -390,22 +319,22 @@
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
</div>
|
||||
</div> -->
|
||||
<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
|
||||
that your involved in.</p>
|
||||
<p>View <b>live media updates</b> along with other <b>transparent metrics</b> from charities.</p>
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
</div>
|
||||
</div> -->
|
||||
<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
|
||||
for <b>a hundred charities</b>, transactions are easy to manage. Come tax
|
||||
season,
|
||||
|
||||
+103
-106
@@ -1,121 +1,118 @@
|
||||
|
||||
/* All that I added for styles */
|
||||
.material-icons {
|
||||
font-size: 40px !important;
|
||||
color: teal;
|
||||
}
|
||||
|
||||
.logo {
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
#countdown {
|
||||
margin: 120px 0 100px 0;
|
||||
#countdown {
|
||||
margin: 120px 0 100px 0;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
color: #BDBDBD;
|
||||
}
|
||||
.time-factor {
|
||||
margin: 0;
|
||||
padding: 1em;
|
||||
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;
|
||||
flex: 0 0 120px;
|
||||
border-right: 1px solid #b2ebf2;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 120px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 120px;
|
||||
}
|
||||
.right-most {
|
||||
border: none;
|
||||
}
|
||||
.number-text {
|
||||
font-size: 2em;
|
||||
color: #1e4d92;
|
||||
}
|
||||
|
||||
}
|
||||
.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%;
|
||||
}
|
||||
|
||||
.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;
|
||||
.sponsor {
|
||||
min-height: 40px;
|
||||
max-width: 200px;
|
||||
max-height: 100px;
|
||||
/* max-width: 200px;
|
||||
height: 80px; */
|
||||
}
|
||||
}
|
||||
|
||||
.testimonial-position {
|
||||
margin-left: 10px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
.small-white-font {
|
||||
font-size: 1em;
|
||||
color: #f3e5f5;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user