slide 4

PRX · Jun 6, 2012 · bfac5b2 · bfac5b2
1 parent 4c71c93
commit bfac5b2
Show file tree

Hide file tree

Showing 3 changed files with 114 additions and 8 deletions.
diff --git a/public/landing.html b/public/landing.html
@@ -20,7 +20,7 @@
 
     <link rel="stylesheet" href="/stylesheets/landing.css">
   </head>
-  <body class="landing">
+  <body class="show">
     <div id="fb-root"></div>
 
     <div id="landing">
@@ -83,10 +83,28 @@ <h3>What happened?</h3>
             </div>
           </section>
 
-          <section>
-            <h1>Venenatis Inceptos Pellentesque Dapibus </h1>
-            <h2>Sollicitudin Dapibus Ornare</h2>
-            <p>Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+          <section class="slide3">
+            <h1>America’s death investigation system is dysfunctional,</h1>
+            <h1>with few standards, little oversight and mistakes that </h1>
+            <h1>are literally buried. Rules and regulations differ </h1>
+            <h1>dramatically from state to state.</h1>
+
+            <ul class="friend-facts">
+              <li>
+                <h2>State</h2>
+                <h3>j</h3>
+                <img src="" alt="">
+                <p>In Georgia, where Abby Fee is from, a coroner need only have a high-school education, be at least 25 years old, have no felony convictions and complete a week's training course in death investigation.</p>
+                <a href="" title="">Tell Friend</a>
+              </li>
+              <li>
+                <h2>State</h2>
+                <h3>b</h3>
+                <img src="" alt="">
+                <p>In Georgia, where Abby Fee is from, a coroner need only have a high-school education, be at least 25 years old, have no felony convictions and complete a week's training course in death investigation.</p>
+                <a href="" title="">Tell Friend</a>
+              </li>
+            </ul>
           </section>
 
           <section>

diff --git a/public/scripts/application.js b/public/scripts/application.js
@@ -30,6 +30,8 @@ $(function() {
   var birthdayStr = "";
 
   function populate() {
+    $('body').removeClass('form').removeClass('landing').addClass('show');
+
     $('.birthyear').html(birthdayStr.split('/')[2]);
     $('.fbProfileImage').attr('src', 'https://graph.facebook.com/'+fbUser.id+'/picture?type=normal');
     $('#cert .header').html('State of '+states[stateCodes.indexOf(locationStr.split(',')[1].toLowerCase().replace(' ', ''))]+' - Department of Health');
@@ -50,7 +52,11 @@ $(function() {
           birthdayStr = response.birthday;
 
           if (response.location) {
-            locationStr = response.location;
+            var loc = response.location.name;;
+            var _city = loc.split(',')[0];
+            var _stateAbr = stateCodes[states.indexOf(loc.split(',')[1].replace(' ',''))].toUpperCase();
+
+            locationStr = _city + ',' + _stateAbr;
 
             populate();
           } else {
@@ -68,8 +74,6 @@ $(function() {
     e.preventDefault();
 
     locationStr = $('#city').val() + ', ' + $('#state').val();
-    $('body').removeClass('form').removeClass('landing').addClass('show');
-
     populate();
   })
 

diff --git a/public/stylesheets/landing.css b/public/stylesheets/landing.css
@@ -1,3 +1,14 @@
+@font-face {
+   font-family: 'StateFaceRegular';
+   src: url('/fonts/webfont/stateface-regular-webfont.eot');
+   src: url('/fonts/webfont/stateface-regular-webfont.eot?#iefix') format('embedded-opentype'),
+        url('/fonts/webfont/stateface-regular-webfont.woff') format('woff'),
+        url('/fonts/webfont/stateface-regular-webfont.ttf') format('truetype'),
+        url('/fonts/webfont/stateface-regular-webfont.svg#StateFaceRegular') format('svg');
+   font-weight: normal;
+   font-style: normal;
+}
+
 @font-face {
   font-family: 'CarbonType';
   src: url('/fonts/carbontype.ttf');
@@ -411,3 +422,76 @@ body.show #show {
 }
 
 
+.slide3 h1 {
+  background: #000;
+  font-family: 'Chivo';
+  font-size: 16px;
+  text-transform: uppercase;
+  color: white;
+  margin: 0;
+  display: inline-block;
+  float: left;
+  padding: 3px 5px;
+  clear: both;
+}
+
+.slide3 .friend-facts {
+  clear: both;
+  list-style: none;
+  padding-top: 50px;
+}
+
+.slide3 .friend-facts li {
+  background: rgba(18, 33, 0, 0.8);
+  border: 1px solid black;
+  width: 280px;
+  padding: 16px;
+  float: left;
+  margin: 4px;
+  position: relative;
+}
+
+.slide3 .friend-facts li h2 {
+  font-family: 'CarbonType';
+  color: white;
+  font-size: 13px;
+  position: absolute;
+  top: 2px;
+  right: 8px;
+
+}
+
+.slide3 .friend-facts li h3 {
+  color: rgba(18, 33, 0, 1);
+  font-family: 'StateFaceRegular';
+  text-shadow: 0px 0px 4px #4f5747;
+  font-size: 110px;
+  line-height: 75px;
+  position: absolute;
+  top: -70px;
+  right: 0;
+}
+
+.slide3 .friend-facts li img {
+  border: 5px solid black;
+  border-right-width: 10px;
+  border-bottom-width: 10px;
+  min-height: 80px;
+}
+
+.slide3 .friend-facts li p {
+  color: #cdc196;
+  font-family: 'Chivo';
+  font-size: 14px;
+  line-height: 18px;
+}
+
+.slide3 .friend-facts li a {
+  display: inline-block;
+  color: black;
+  background: #cdc196;
+  text-transform: uppercase;
+  padding: 7px;
+  text-decoration: none;
+  font-family: 'CarbonType';
+}