new content and styles

rachelrosenfelt · Jul 7, 2015 · 4e45b95 · 4e45b95
1 parent 2226490
commit 4e45b95
Show file tree

Hide file tree

Showing 15 changed files with 380 additions and 277 deletions.
diff --git a/source-old/stylesheets/toc.css.scss b/source-old/stylesheets/toc.css.scss
@@ -1,5 +1,5 @@
 @media #{$D7} {
-  
+
   #toc {
     padding-left:120px;
     h3 {
@@ -10,14 +10,14 @@
     .toc-item {
       position: relative;
       border-bottom: 1px dotted whitesmoke;
-      margin-bottom:26px;
+
     }
 
     .toc-item-title {
       padding:0;
       margin:0;
       font: italic 21px/26px Garamond, Baskerville, Baskerville Old Face, Hoefler Text, Times New Roman, serif;
-      
+
       a {
         color:$black;
       }

diff --git a/source/about.html.haml b/source/about.html.haml
diff --git a/source/interviews/bill-wasik.html.haml b/source/interviews/bill-wasik.html.haml
diff --git a/source/interviews/callie-beusman.html.haml b/source/interviews/callie-beusman.html.haml
diff --git a/source/interviews/john-herrman.html.haml b/source/interviews/john-herrman.html.haml
diff --git a/source/javascripts/all.js b/source/javascripts/all.js
@@ -4,7 +4,7 @@
 $(window).load(function(){
   if ( $('body').is('.d7')){
       // do
-    $( '.menu ul').addClass('collapsed').toggle();  
+    $( '.menu ul').addClass('collapsed').toggle();
   }
 });
 
diff --git a/source/javascripts/footnotehandler.js b/source/javascripts/footnotehandler.js
@@ -13,11 +13,11 @@ function footnoteHandler() {
 
     if ($(footnote_id).hasClass('active')) {
       $(footnote_id).fadeOut();
-      $(footnote_id).removeClass('active');     
+      $(footnote_id).removeClass('active');
     }
     else {
       if (!$(footnote_id).hasClass('active')) {
-        $(footnote_id).fadeToggle();        
+        $(footnote_id).fadeToggle();
         $(footnote_id).addClass('active');
       }
     }

diff --git a/source/javascripts/tochandler.js b/source/javascripts/tochandler.js
@@ -0,0 +1,5 @@
+function tocHandler() {
+  $('#close-modal').click(function(){
+    $('#toc').toggle();
+  });
+}
diff --git a/source/layouts/layout.haml b/source/layouts/layout.haml
@@ -42,6 +42,7 @@
     mapHandler();
     footnoteHandler();
     teamHandler();
+    tocHandler()
 
     $("#editor-note-trigger").click(function(){
       $("#editorial_note").slideToggle();

diff --git a/source/partials/interviews/_index.haml b/source/partials/interviews/_index.haml
@@ -1,47 +1,49 @@
+#toc.modal.body
+  #close-modal
+    ×
 
 
-#toc.modal.body
-  %h1
-    Media Landscape Two Thousand Fifteen 
+  %h1 Media Landscape
+  %h2 Two Thousand Fifteen
 
-  A critical overview of contemporary media from The New School 
+  %p.toc-dek A critical overview of contemporary media from The New School
 
   %hr
 
   %h3 Process
-  
+
   .toc-item
     .toc-item-art
     %h4.toc-item-title
       %a{:href => "http://cpcj.tumblr.com/"}
         Behind the Scenes
     %p.toc-byline
-      The making of Media Landscape by the CPCJ’s first Multimedia Publishing, Production and Writing Lab 
+      The making of Media Landscape by the CPCJ’s first Multimedia Publishing, Production and Writing Lab
 
 
   %h2 Table of Contents
 
-  
+
   %h3 Editorial Note
-  
+
   .toc-item
     .toc-item-art
       -# = image_tag '#'
     %h4.toc-item-title
-      %a{:href => "#"}
-        What Are the Stakes? 
+      %a{:href => "/about.html"}
+        What Are the Stakes?
     %p.toc-byline
-  
+
 
   %h3 The IRL Feature
-  
+
   .toc-item
     %h4.toc-item-title
       %a{:href => "https://vimeo.com/130199067"}
         The (New) New Republic
     %p.toc-byline
       All CPCJ Media interview subjects
-  
+
 
   %h3 Interviews
 
@@ -62,7 +64,7 @@
         The New Collective Intelligence: Genius
     %p.toc-byline
       Emily Segal and Cecilia Mezulic
-  
+
   .toc-item
     .toc-item-art
       = image_tag 'logos/repeater-books.png'
@@ -134,7 +136,7 @@
         The Age of Engagement: Medium/Matter
     %p.toc-byline
       Mark Lotto and Silje Kristine Andersen
-  
+
   .toc-item
     .toc-item-art
       = image_tag 'logos/snapchat.png'
@@ -143,7 +145,7 @@
         When Viral Goes Viral: Snapchat Discover
     %p.toc-byline
       Nathan Jurgenson and Troy O’Neill
-  
+
   .toc-item
     .toc-item-art
       = image_tag 'logos/ref-29.png'
@@ -197,5 +199,11 @@
     .toc-item-art
     %h4.toc-item-title
       %a{:href => "http://cpcjpanorama.tumblr.com/"}
-      Experimental Works
+        Experimental Works
+
+  %hr
 
+  %p.final-toc-note
+    To learn more about The New School and the MA Creative Publishing & Critical Journalism program, visit <a href="http://creative-publishing.org">creative-publishing.org</a>.
+  %p
+    %em The New School for Social Research. 2015. New York City, NY.
diff --git a/source/stylesheets/body.css.scss b/source/stylesheets/body.css.scss
@@ -4,11 +4,11 @@
 
 
 @media #{$D7} {
-  
+
   .body {
     color:$black;
     font: 18px/24px Garamond, Baskerville, Baskerville Old Face, Hoefler Text, Times New Roman, serif;
-    
+
     p {
       margin:0;
       width:100%;
@@ -37,9 +37,7 @@
 
     h5 {
       font:bold 16px/21px Helvetica;
-      margin-bottom: 20px;
-      color:$orange;
-      border-top:1px dotted lightgray;
+      color:$black;
       padding-top:25px;
 
     }
@@ -153,7 +151,7 @@
         padding-bottom:0;
       }
     }
-  }  
+  }
 }
 
 
@@ -180,7 +178,7 @@
 @media #{$D5} {
 	.body {
 		p {
-			padding-right:400px;	
+			padding-right:400px;
 		}
 	}
 
@@ -228,5 +226,11 @@
     p {
       padding-right:400px;
     }
+    h6 {
+      padding-right:140px;
+    }
+    .pullquote {
+      padding-right:100px;
+    }
   }
 }
diff --git a/source/stylesheets/footnote.css.scss b/source/stylesheets/footnote.css.scss
@@ -5,12 +5,12 @@
 
   .footnote {
     display:none;
-  }  
+  }
 
 }
 
 @media #{$D6} {
-  
+
 }
 
 @media #{$D5} {
@@ -46,7 +46,7 @@
     -webkit-user-select: none;  /* Chrome all / Safari all */
     -moz-user-select: none;     /* Firefox all */
     -ms-user-select: none;      /* IE 10+ */
-    user-select: none;          /* Likely future */    
+    user-select: none;          /* Likely future */
 
     div.fn-block {
       padding-top:150px;
@@ -62,7 +62,7 @@
 
       .fn-caption {
         padding-right:0;
-      }        
+      }
 
       .fn-close-button {
         display:inline-block;
@@ -85,5 +85,14 @@
 }
 
 @media #{$D4} {
-
+  .marginal-fn.footnote {
+    width:160px;
+  }
+  .fullscreen-fn {
+    div.fn-block {
+      width:600px;
+      margin: 0 auto;
+    }
+  }
+
 }
diff --git a/source/stylesheets/menu.css.scss b/source/stylesheets/menu.css.scss
@@ -33,7 +33,7 @@
     bottom:0;
     left:0;
     padding:0;
-    
+
     box-sizing: border-box;
 
     background-color:$white;
@@ -45,9 +45,9 @@
     font-size:20px;
     letter-spacing: 0.11em;
     text-align:right;
-    
+
     a {
-        text-decoration: none;  
+        text-decoration: none;
         color:$white;
     }
     h2 {
@@ -83,7 +83,7 @@
       padding-top:2px;
       padding-bottom:2px;
       letter-spacing:0;
-    } 
+    }
     li:hover a {
       color:$orange;
     }

diff --git a/source/stylesheets/shame.css.scss b/source/stylesheets/shame.css.scss
@@ -4,7 +4,55 @@
 
 
 @media #{$D7} {
-
+
+  .thank-you {
+    float:left;
+    margin-top:20px;
+    padding-top:20px;
+    padding-bottom:200px;
+    h3 {
+      font-family: $sans;
+      text-transform: none;
+      letter-spacing: 0;
+      font-size:18px;
+      margin:0;
+      padding:0;
+    }
+    ul {
+      padding:0;
+      margin:0;
+    }
+    li {
+      list-style: none;
+      display:inline-block;
+      font-style: italic;
+      color:gray;
+      &:after {
+        content: ", ";
+        font-size: 15px;
+        position: relative;
+        top:1px;
+        color:lightgray;
+      }
+      &:last-of-type:after {
+        content:"";
+      }
+      &:last-of-type:before {
+        content:" and ";
+        color:gray;
+        font-style: normal;
+      }
+      a {
+        color:gray;
+        text-decoration: underline;
+      }
+    }
+  }
+
+	#close-modal {
+		display:none;
+	}
+
 	// SETTINGS
   body {
     max-width:100vw;
@@ -52,24 +100,32 @@
       font:14px/20px 'Times New Roman';
     }
     h4 {
-     font:14px/20px 'Times New Roman'; 
+     font:14px/20px 'Times New Roman';
     }
   }
-  
+
 
 
 }
 
 @media #{$D6} {
-  
+
 }
 
 @media #{$D5} {
-  
+
 }
 
 @media #{$D4} {
-
+  #close-modal {
+  	display:block;
+  	position: absolute;
+  	top:20px;
+  	right:40px;
+  	font-weight: 700;
+  	color:$orange;
+  	cursor:pointer;
+  }
 }