develop
Nathan Steel 3 years ago
parent 84b28d60b2
commit 5bec516086

@ -87,6 +87,17 @@
<summary><h2>I want to volunteer, how do I get in touch?</h2></summary> <summary><h2>I want to volunteer, how do I get in touch?</h2></summary>
<div class="detail__body"> <div class="detail__body">
<p>Please use one of the methods at the bottom of this page. We would be greatful for any help you may be able to offer. </p> <p>Please use one of the methods at the bottom of this page. We would be greatful for any help you may be able to offer. </p>
<section class="contact-container">
<a href="tel:07727260285">
<p>Phone:<br/>07727260285</p>
</a>
<a href="mailto:feedthecommunity@outlook.com">
<p>Email:<br/>feedthecommunity<wbr>@outlook<wbr>.com</p>
</a>
<a href="https://www.facebook.com/feedthecommunitygy" rel="noopener" target="_blank">
<p>Facebook:<br/>/feedthecommunitygy</p>
</a>
</section>
</div> </div>
</details> </details>
@ -108,11 +119,17 @@
<summary><h2>What if I have a specific question</h2></summary> <summary><h2>What if I have a specific question</h2></summary>
<div class="detail__body"> <div class="detail__body">
<p>If you have any questions that are not currently in the FAQ, please contact use via:</p> <p>If you have any questions that are not currently in the FAQ, please contact use via:</p>
<ul> <section class="contact-container">
<li>Phone: <a href="tel:07727260285">07727260285</a></li> <a href="tel:07727260285">
<li>Email: <a href="mailto:feedthecommunity@outlook.com">feedthecommunity@outlook.com</a></li> <p>Phone:<br/>07727260285</p>
<li>Facebook: <a href="https://www.facebook.com/feedthecommunitygy" rel="noopener" target="_blank">https://www.facebook.com/feedthecommunitygy</a></li> </a>
</ul> <a href="mailto:feedthecommunity@outlook.com">
<p>Email:<br/>feedthecommunity<wbr>@outlook<wbr>.com</p>
</a>
<a href="https://www.facebook.com/feedthecommunitygy" rel="noopener" target="_blank">
<p>Facebook:<br/>/feedthecommunitygy</p>
</a>
</section>
</div> </div>
</details> </details>

@ -60,19 +60,19 @@
<section class="container section"> <section class="container section">
<h2>Fundraising</h2> <h2>Fundraising</h2>
<div class="fundraiser-container"> <div class="fundraiser-container">
<a href="#" class="fundraiser fundraiser--1"> <a href="https://www.facebook.com/groups/feedthecommunityauctionsgrimsbycleethopes" rel="noopner" target="blank" class="fundraiser">
<img src="/images/fb-auctions.webp" alt="" width="240" height="240"> <img src="/images/fb-auctions.webp" alt="" width="240" height="240">
<p>Facebook Auctions</p> <p>Facebook Auctions</p>
</a> </a>
<a href="#" class="fundraiser fundraiser--2"> <a href="https://www.gofundme.com/f/m58xy-we-need-your-help" rel="noopner" target="blank" class="fundraiser">
<img src="/images/gofundme.png" alt="" width="240" height="240"> <img src="/images/gofundme.png" alt="" width="240" height="240">
<p>gofundme</p> <p>gofundme</p>
</a> </a>
<a href="#" class="fundraiser fundraiser--3"> <a href="https://www.ebay.co.uk/sch/i.html?item=394277535779&rt=nc&_trksid=p2047675.m3561.l2562&_ssn=feedthecommunity" rel="noopner" target="blank" class="fundraiser">
<img src="/images/ebay.png" alt="" width="240" height="240"> <img src="/images/ebay.png" alt="" width="240" height="240">
<p>ebay</p> <p>ebay</p>
</a> </a>
<a href="#" class="fundraiser fundraiser--4"> <a href="#" rel="noopner" target="blank" class="fundraiser">
<img src="/images/fb-marketplace.webp" alt="" width="240" height="240"> <img src="/images/fb-marketplace.webp" alt="" width="240" height="240">
<p>Facebook Marketplace</p> <p>Facebook Marketplace</p>
</a> </a>

@ -232,7 +232,7 @@ label > .label-body {
/* For devices larger than 550px */ /* For devices larger than 550px */
@media (min-width: 550px) { @media (min-width: 550px) {
.container { .container {
width: 80%; width: 90%;
} }
.one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve { .one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve {
margin-left: 4%; margin-left: 4%;
@ -551,8 +551,8 @@ input[type=button].button--fill:hover,
input[type=submit].button--fill:focus, input[type=submit].button--fill:focus,
input[type=reset].button--fill:focus, input[type=reset].button--fill:focus,
input[type=button].button--fill:focus { input[type=button].button--fill:focus {
color: #000; color: #FFF;
background: #FFF; background: #368179;
outline: 0; outline: 0;
} }
@ -749,7 +749,8 @@ pre code {
} }
.hero--image { .hero--image {
background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.45)), url("./images/hero.jpg"); background-color: #444;
background-image: linear-gradient(rgba(68, 68, 68, 0.2), rgba(68, 68, 68, 0.45)), url("./images/hero.jpg");
} }
.hero-content { .hero-content {
@ -1376,19 +1377,16 @@ a.footer__icon {
} }
.contact-container a, .contact-container a:visited { .contact-container a, .contact-container a:visited {
display: block; display: block;
background: #368179;
padding: 1rem; padding: 1rem;
text-align: center; text-align: center;
color: #FFF; color: #FFF;
color: #000;
border: 1px solid #EEE;
border-bottom: 1px solid #DDD;
} }
.contact-container a:hover, .contact-container a:visited:hover { .contact-container a:hover, .contact-container a:visited:hover {
background: #3e9389; background: #FDFDFD;
} border-color: #DDD;
.contact-container a:nth-child(odd), .contact-container a:visited:nth-child(odd) {
background: #275D57;
}
.contact-container a:nth-child(odd):hover, .contact-container a:visited:nth-child(odd):hover {
background: #3e9389;
} }
/*# sourceMappingURL=main.css.map */ /*# sourceMappingURL=main.css.map */

File diff suppressed because one or more lines are too long

@ -46,8 +46,8 @@ input[type="button"].button--fill:hover,
input[type="submit"].button--fill:focus, input[type="submit"].button--fill:focus,
input[type="reset"].button--fill:focus, input[type="reset"].button--fill:focus,
input[type="button"].button--fill:focus { input[type="button"].button--fill:focus {
color: $black; color: $white;
background: $white; background: lighten($primary, 10);
outline: 0; outline: 0;
} }
.button--alt, .button--alt,

@ -32,7 +32,8 @@
position: relative; position: relative;
} }
.hero--image{ .hero--image{
background-image:linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.45)), url("./images/hero.jpg"); background-color:$heroBg;
background-image:linear-gradient(rgba($heroBg, 0.2), rgba($heroBg, 0.45)), url("./images/hero.jpg");
} }
.hero-content{ .hero-content{
text-align:center; text-align:center;

@ -21,4 +21,5 @@ $tag: #DDD;
$success: #D1E7DD; $success: #D1E7DD;
$fail: #F8D7DA; $fail: #F8D7DA;
$background: #FAECE1; $background: #FAECE1;
$heroBg: $content;

@ -30,7 +30,7 @@
/* For devices larger than 550px */ /* For devices larger than 550px */
@media (min-width: 550px) { @media (min-width: 550px) {
.container { width: 80%; } .container { width: 90%; }
.one,.two,.three,.four,.five,.six,.seven,.eight,.nine,.ten,.eleven,.twelve{margin-left: 4%; } .one,.two,.three,.four,.five,.six,.seven,.eight,.nine,.ten,.eleven,.twelve{margin-left: 4%; }
.one:first-child, .one:first-child,
.two:first-child,.three:first-child,.four:first-child, .two:first-child,.three:first-child,.four:first-child,

@ -349,18 +349,23 @@ a.footer__icon{
} }
a, a:visited{ a, a:visited{
display:block; display:block;
background:lighten($primary,10);
padding:1rem; padding:1rem;
text-align:center; text-align:center;
color:$white; color:$white;
color:$black;
border:1px solid #EEE;
border-bottom:1px solid #DDD;
//background:lighten($primary,10);
&:hover{ &:hover{
background:lighten($primary,15); //background:lighten($primary,15);
background:#FDFDFD;
border-color:#DDD;
} }
&:nth-child(odd){ &:nth-child(odd){
background:$primary; //background:$primary;
&:hover{ &:hover{
background:lighten($primary,15); //background:lighten($primary,15);
} }
} }
} }

@ -47,7 +47,7 @@
<p>Phone:<br/>07727260285</p> <p>Phone:<br/>07727260285</p>
</a> </a>
<a href="mailto:feedthecommunity@outlook.com"> <a href="mailto:feedthecommunity@outlook.com">
<p>Email:<br/>feedthecommunity@outlook.com</p> <p>Email:<br/>feedthecommunity<wbr>@outlook<wbr>.com</p>
</a> </a>
<a href="https://www.facebook.com/feedthecommunitygy" rel="noopener" target="_blank"> <a href="https://www.facebook.com/feedthecommunitygy" rel="noopener" target="_blank">
<p>Facebook:<br/>/feedthecommunitygy</p> <p>Facebook:<br/>/feedthecommunitygy</p>
@ -74,19 +74,19 @@
<section class="container section"> <section class="container section">
<h2>Fundraising</h2> <h2>Fundraising</h2>
<div class="fundraiser-container"> <div class="fundraiser-container">
<a href="#" class="fundraiser fundraiser--1"> <a href="https://www.facebook.com/groups/feedthecommunityauctionsgrimsbycleethopes" rel="noopner" target="blank" class="fundraiser">
<img src="/images/fb-auctions.webp" alt="" width="240" height="240"> <img src="/images/fb-auctions.webp" alt="" width="240" height="240">
<p>Facebook Auctions</p> <p>Facebook Auctions</p>
</a> </a>
<a href="#" class="fundraiser fundraiser--2"> <a href="https://www.gofundme.com/f/m58xy-we-need-your-help" rel="noopner" target="blank" class="fundraiser">
<img src="/images/gofundme.png" alt="" width="240" height="240"> <img src="/images/gofundme.png" alt="" width="240" height="240">
<p>gofundme</p> <p>gofundme</p>
</a> </a>
<a href="#" class="fundraiser fundraiser--3"> <a href="https://www.ebay.co.uk/sch/i.html?item=394277535779&rt=nc&_trksid=p2047675.m3561.l2562&_ssn=feedthecommunity" rel="noopner" target="blank" class="fundraiser">
<img src="/images/ebay.png" alt="" width="240" height="240"> <img src="/images/ebay.png" alt="" width="240" height="240">
<p>ebay</p> <p>ebay</p>
</a> </a>
<a href="#" class="fundraiser fundraiser--4"> <a href="#" rel="noopner" target="blank" class="fundraiser">
<img src="/images/fb-marketplace.webp" alt="" width="240" height="240"> <img src="/images/fb-marketplace.webp" alt="" width="240" height="240">
<p>Facebook Marketplace</p> <p>Facebook Marketplace</p>
</a> </a>

Loading…
Cancel
Save