Skip to content

Commit

Permalink
Merge pull request #1 from OpenMaine/master
Browse files Browse the repository at this point in the history 
Sync
  • Loading branch information
@dzwarg
dzwarg committed Apr 26, 2020
2 parents 557e6be + 114a525 commit feeb161
Show file tree
Hide file tree
Showing 16 changed files with 396 additions and 298 deletions.
21 changes: 8 additions & 13 deletions css/home.css
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
#home {
background: linear-gradient(0deg, rgba(9,9,121,.9) 0%, rgba(0, 123, 255, 1) 100%);
background: linear-gradient(0deg, rgba(9,9,121,.9) 0%, #0063cc 100%);
}

#home-footer {
background-color: #040437!important;
}

#hero-tagline {
color: rgba(255, 255, 255, .65);
color: rgba(255, 255, 255, .85);
}
#hero-tagline > a {
color: rgba(255, 255, 255, .65);
color: rgba(255, 255, 255, .85);
}
#hero-tagline > a:hover {
color: rgba(255, 255, 255, .95);
color: rgb(255, 255, 255);
}

#filter-container {
Expand Down Expand Up @@ -41,7 +41,7 @@
.toggle-label {
display: block;
margin-top: -8px;
color: #f0f0f0;
color: #ffffff;
font-size: 12px;
font-weight: bold;
}
Expand All @@ -58,17 +58,12 @@
font-weight: 500;
font-size: 20px;
}
.resource-description {
margin-bottom: 6px;
}
.resource-link>a{
font-size: 18px;
.resource-header>a{
display: flex;
align-items: center;
}
.resource-link>a:hover {
text-decoration: none;

.resource-description {
margin-bottom: 6px;
}

@media (max-width: 768px) {
Expand Down
14 changes: 10 additions & 4 deletions css/map.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@

.filter-card {
padding-bottom: 0;
overflow-x: hidden;
}

.header-dark {
Expand Down Expand Up @@ -94,12 +95,12 @@
}
.toggle-icon {
font-size: 32px !important;
color: orange;
color: #ffab0f;
}
.toggle-label {
display: block;
margin-top: -8px;
color: burlywood;
color: #f4e7d7;
font-size: 12px;
font-weight: bold;
}
Expand Down Expand Up @@ -141,7 +142,7 @@
}

.header-dark {
font-size: 1.25em;
font-size: 1.15em;
margin-bottom: 0;
}
.main-content {
Expand Down Expand Up @@ -318,4 +319,9 @@

.leaflet-bottom {
z-index: 998 !important;
}
}

a[href^="tel:"]:before {
content: "\260e";
margin-right: 0.5em;
}
38 changes: 36 additions & 2 deletions css/shared.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ body {
}

.navbar-custom {
background-color: #323272!important;
background-color: #323272;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
-webkit-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.75);
Expand All @@ -41,6 +41,40 @@ body {
margin-left: 1rem;
}

/* Begin accessibility tweaks to theme */
.navbar-dark.navbar-custom .navbar-nav .nav-link {
color: rgba(255, 255, 255, 0.75);
}

a {
color: #0063cc;
}

/* Bootstrap overrides */
.btn-primary {
background-color: #0063cc;
border-color: #0063cc;
}

.text-muted {
color: #5f666d !important;
}

label {
width: 100%;
}

.badge.badge-info {
background-color: #117888;
}

/* select2 overrides */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
.select2-container--default .select2-selection--single .select2-selection__placeholder {
color: #666666;
}
/* End accessibility tweaks to theme */

.select2-container {
width: 100%!important;
max-width: 100%!important;
}
124 changes: 62 additions & 62 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Find food pantries, meal sites, SNAP retailers, and other food resources in Maine">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1.0, user-scalable=no">
<meta name="description" content="Find food pantries, meal sites, and other food resources in Maine">
<meta name="author" content="OpenMaine Code for America Brigade">

<title>Maine Food Finder</title>
Expand Down Expand Up @@ -39,7 +39,7 @@
</div>
</nav>

<div id="page-content">
<main id="page-content">
<!-- Header -->
<header class="py-5 mb-5" id="home">
<div class="container h-100">
Expand All @@ -66,34 +66,38 @@ <h2 id="hero-search-title" style="color: #404040;">
<form id="search-form" class="mt-3">
<div class="row mb-5 d-flex align-items-center">
<div class="col-sm-6 col-7 mb-3 ">
<label for="zip-code"><strong>Zip code</strong></label>
<input required pattern="^([0-9]{5})\s*[-]?\s*([0-9]{4})?\s*$"
minlength="5" maxlength="10"
type="text" class="form-control"
id="zip-code" name="zip-code"
aria-describedby="hero-zip-help"
placeholder="Use format 12345">
<label for="zip-code"><strong>Zip code</strong>
<input required pattern="^([0-9]{5})\s*[-]?\s*([0-9]{4})?\s*$"
minlength="5" maxlength="10"
type="text" class="form-control"
id="zip-code" name="zip-code"
aria-describedby="hero-zip-help"
placeholder="Use format 12345">
</label>
<small id="hero-zip-help" class="form-text text-muted">Enter a Maine zip code</small>
</div>

<div class="col-sm-6 col-5 mb-3">
<label for="radius-select"><strong>Search radius</strong></label>
<select size="1" required class="custom-select form-control select-default" id="radius-select" aria-describedby="hero-radius-help">
<option value=10>10</option>
<option value=20>20</option>
<option value=30>30</option>
<option value=50>50</option>
</select>
<label for="radius-select"><strong>Search radius</strong>
<select size="1" required class="custom-select form-control select-default" id="radius-select" aria-describedby="hero-radius-help">
<option value=10>10</option>
<option value=20>20</option>
<option value=30>30</option>
<option value=50>50</option>
<option value=75>75</option>
</select>
</label>
<small id="hero-radius-help" class="form-text text-muted">Miles from zip code</small>
</div>
<div class="col-12">
<label for="category-select"><strong>Categories</strong></label>
<select required class="custom-select select-default"
aria-describedby="hero-category-help"
id="category-select"
name="category-select[]"
multiple="multiple">
</select>
<label for="category-select"><strong>Categories</strong>
<select required class="custom-select select-default"
aria-describedby="hero-category-help"
id="category-select"
name="category-select[]"
multiple="multiple">
</select>
</label>
<small id="hero-category-help" class="form-text text-muted">Select one or more categories</small>
</div>
</div>
Expand All @@ -106,7 +110,7 @@ <h2 id="hero-search-title" style="color: #404040;">
</header>

<!-- Mission statement -->
<div class="container" id="mission">
<section class="container" id="mission">
<div class="row mb-5 mt-5">
<div class="col-12">
<h2 id="mission-title" class="text-dark">
Expand Down Expand Up @@ -141,12 +145,12 @@ <h2 id="mission-title" class="text-dark">
</div>
</div>
<div class="col-sm-5">
<img class="img-thumbnail" alt="apples" src="images/apple_red.jfif"/>
<img class="img-thumbnail" src="images/apple_red.jfif" alt="Dripping wet red apples"/>
</div>
</div>
</div>
</section>
<!-- About the data -->
<div class="container" id="about">
<section class="container" id="about">
<div class="row mb-5 mt-5">
<div class="col-12">
<h2 id="data-title" class="text-dark">
Expand All @@ -164,12 +168,12 @@ <h2 id="data-title" class="text-dark">
</div>
</div>
<div class="col-sm-5">
<img class="img-thumbnail" alt="vegetables" src="images/produce.jpg"/>
<img class="img-thumbnail" src="images/produce.jpg" alt="Stacks of vegetables"/>
</div>
</div>
</div>
</section>
<!-- Other resources -->
<div class="container" id="other-resources">
<section class="container" id="other-resources">
<div class="row mb-5 mt-5">
<div class="col-12">
<h2 id="other-resources-title" class="text-dark">Other Resources</h2>
Expand All @@ -178,55 +182,51 @@ <h2 id="other-resources-title" class="text-dark">Other Resources</h2>
<div class="col-12">
<div class="row" id="other-resources-text">
<div class="col-12 resource-container" style="padding-top: 0;">
<div class="resource-header">Good Shepherd Food Bank</div>
<div class="resource-description">Good Shepherd Food Bank and its network of 450+ agency partners — including food pantries and meal sites — is the largest hunger-relief organization in Maine</div>
<div class="resource-link">
<a href="https://www.gsfb.org/" title="Good Shepherd Food Bank Website" target="_blank" rel="noopener">
View Website
<i class="material-icons ml-1" title="open website">launch</i>
<div class="resource-header">
<a href="https://www.gsfb.org/" alt="Good Shepherd Food Bank Website" target="_blank" rel="noopener">
Good Shepherd Food Bank
<i class="material-icons ml-1" title="open website">launch</i>
</a>
</div>
<div class="resource-description">Good Shepherd Food Bank and its network of 450+ agency partners — including food pantries and meal sites — is the largest hunger-relief organization in Maine</div>
</div>
<div class="col-12 resource-container">
<div class="resource-header">2-1-1 Maine</div>
<div class="resource-description">Information about Maine food pantries, meal sites, senior dining sites, and more.</div>
<div class="resource-link">
<a href="https://211maine.org/" title="2-1-1 Maine Website" target="_blank" rel="noopener">
View Website
<div class="resource-header">
<a href="https://211maine.org/" alt="2-1-1 Maine Website" target="_blank" rel="noopener">
2-1-1 Maine
<i class="material-icons ml-1" title="open website">launch</i>
</a>
</div>
<div class="resource-description">Information about Maine food pantries, meal sites, senior dining sites, and more.</div>
</div>
<div class="col-12 resource-container">
<div class="resource-header">Wayside Food Programs</div>
<div class="resource-description">A list of community resources available, including food pantries and meals (breakfast & lunch) for youth up to age 18.</div>
<div class="resource-link">
<a href="https://waysidemaine.org/community-resources" title="Wayside Maine Website" target="_blank" rel="noopener">
View Website
<i class="material-icons ml-1" title="open website">launch</i>
<div class="resource-header">
<a href="https://waysidemaine.org/community-resources" alt="Wayside Maine Website" target="_blank" rel="noopener">
Wayside Food Programs
<i class="material-icons ml-1" title="open website">launch</i>
</a>
<div class="resource-description">A list of community resources available, including food pantries and meals (breakfast &amp; lunch) for youth up to age 18.</div>
</div>
</div>

<div class="col-12 resource-container">
<div class="resource-header">The Emergency Food Assistance Program</div>
<div class="resource-header">
<a href="https://www.maine.gov/dacf/ard/tefap/bytown.shtml" alt="Visit The Emergency Food Assistance Program website" target="_blank" rel="noopener">
The Emergency Food Assistance Program
<i class="material-icons ml-1" title="open website">launch</i>
</a>
</div>
<div class="resource-description">
The Emergency Food Assistance Program (TEFAP) is a federal program that helps supplement the diets of low-income Americans by providing them with emergency food assistance at no cost.
</div>
<div class="resource-link">
<a href="https://www.maine.gov/dacf/ard/tefap/bytown.shtml" title="Visit The Emergency Food Assistance Program website" target="_blank" rel="noopener">
View Website
<i class="material-icons ml-1" title="open website">launch</i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>

<!-- Contact and social media -->
<div class="container mt-2" id="contact">
<section class="container mt-2" id="contact">
<div class="row mb-5">
<div class="col-12">
<h2 id="contact-title" class="text-dark">
Expand All @@ -244,19 +244,19 @@ <h2 id="contact-title" class="text-dark">
<div class="row mt-4 text-center">
<div class="col-md-6">
<div class="mt-3">
<h4 class="h4">Email</h4>
<h3 class="h4">Email</h3>
<div>
<span>
<span id="contact-email" class="mr-1">[email protected]</span>
<a href="mailto:[email protected]" target="_blank" title="Email [email protected]">
<span id="contact-email" class="mr-1">[email protected]</span>
<i class="fa fa-envelope"></i>
</a>
</span>
</div>
</div>
</div>
<div class="col-md-6 mt-3">
<h4 class="h4">Social Media</h4>
<h3 class="h4">Social Media</h3>
<ul class="list-inline mb-0" id="social-media-icons">
<li class="list-inline-item">
<a href="https://www.facebook.com/openmaine" target="_blank" rel="noopener" title="OpenMaine Facebook">
Expand Down Expand Up @@ -303,9 +303,9 @@ <h4 id="feedback-title" class="text-dark">
</div>
</div>
</div>
</div>
</section>
<!-- /.about container -->
</div>
</main>

<!-- Footer -->
<footer class="py-5 bg-dark" id="home-footer">
Expand Down
Loading

0 comments on commit feeb161

Please sign in to comment.