add linkurious screenshot to home page

app/assets/stylesheets/application.css

@@ -134,6 +134,26 @@ a:hover {
 	background-color: #2f576e;
 }
 
+.viz-bar {
+	background-color: #eeeeee;
+	opacity: 80%;
+}
+
+.rounded-left {
+	border-bottom-left-radius: 10px;
+	border-top-left-radius: 10px;
+}
+
+.rounded-right {
+	border-bottom-right-radius: 10px;
+	border-top-right-radius: 10px;
+}
+
+li {
+	padding-left: 5px;
+	margin-left: 40px;
+}
+
 .features-bar a{
 	color: #ffffff;
 }

app/controllers/default_controller.rb

@@ -28,4 +28,8 @@ def timeline
   def data
     @page_name = 'Data On Systemic Racism'
   end
+
+  def connections
+    @connections = 'Explore Connections'
+  end
 end

app/views/default/connections.html.erb

@@ -0,0 +1,54 @@
+<div class="container">
+    <div class="row pb-4">
+        <h1>Explore Connections</h1>
+        <p>These visualizations contextualize fatal encounters between Black people and police from 2009 to 2018 in San Francisco, Alameda, Contra Costa, Solano, and Sacramento counties. The first visualization shows connections between the people, organizations, and locations involved in fatal encounters with police. The second visualization shows connections between a collection of documents relevant to these fatal encounters, such as training manuals used by the law enforcement agencies involved, state legislation affecting police policy, and investigations into deaths at the hand of law enforcement.</p>
+    </div>
+    <div class="row pb-4">
+        <iframe src="https://ksr-linkurious.stanford.edu/widget/04520199"
+                           width="100%"
+                           height="330"
+                           frameborder="0"
+                           webkitallowfullscreen
+                           mozallowfullscreen
+                           allowfullscreen></iframe>
+        <p>
+        <a href="https://ksr-linkurious.stanford.edu/widget/04520199" target="_blank">Full screen view</a>
+        </p>
+     </div>
+    <div class="row pb-4">
+        <iframe src="https://ksr-linkurious.stanford.edu/widget/1719ec66"
+                           width="100%"
+                           height="330"
+                           frameborder="0"
+                           webkitallowfullscreen
+                           mozallowfullscreen
+                           allowfullscreen></iframe>
+        <p>
+        <a href="https://ksr-linkurious.stanford.edu/widget/1719ec66" target="_blank">Full screen view</a>
+        </p>
+    </div>
+    <div class="row pb-4">
+        <h2>How did we choose these data?</h2>
+        <p>Our goal with this project is to expose the systemic racism underlying fatal encounters between Black people and the police. Libraries and archives collect, organize, preserve, and provide access to records. The information systems that govern these activities aid discovery in some ways, but they also perpetuate systems of power and control by abstracting events and dehumanizing the actions. With these graph visualizations, we are attempting to break the mold of discovery based on records alone by linking those documents to the people, events, and places involved. By connecting these records to specific people, places and dates, we are attempting to humanize the harm and show the injury of racism that is lost in our formal systems of records and documentation.</p>
+        <p>The records (still in process):</p>
+        <ul>
+            <li>California Law Enforcement Agency Policy and Training Manuals</li>
+            <li>California State Legislation which affects Law Enforcement Agencies</li>
+            <li>Studies</li>
+            <li>Public Reports of Investigations into Police Killings</li>
+        </ul>
+        <p>We then connect those records to people, events, and places based on the following:</p>
+         <ul>
+            <li>A focus on Black people killed at the hands of police and their lives and legacies</li>
+            <li>Inclusion of law enforcement agencies and personnel directly involved in brutality against Black people (such as those who pulled the trigger in someone's death)</li>
+            <li>Inclusion of law enforcement agencies and personnel indirectly involved in brutality against Black people, but in a quantifiable way (such as those who were present when someone was murdered by their peers, those who were involved in investigations into police brutality, and police chiefs who oversaw departments committing police brutality)</li>
+            <li>Inclusion of individuals who performed investigations into police violence</li>
+            <li>Inclusion of individuals who were investigated as part of investigations into police violence</li>
+            <li>Inclusion of protests covered by mainstream local news sources organized in response to individual incidents of police violence</li>
+            <li>Inclusion of lawsuits filed in response to police violence</li>
+            <li>Inclusion of murder, manslaughter, and misconduct charges brought against police officers</li>
+            <li>Exclusion of identifying information such as involved family members and contact information in order to respect individual privacy rights</li>
+        </ul>
+        </p>
+    </div>
+</div>

app/views/default/index.html.erb

@@ -17,21 +17,24 @@
     <%= render "shared/navbar" %>
 
     <div class="container">
-        <div class="row">
-            <div class="col-3 bubbles rounded text-center">
-                <h2><%= link_to "Learn about systemic racism", :timeline%></h2>
-                <%= link_to image_tag('button_timeline.png', class: "img-fluid pt-5 d-none d-md-block", alt: "timeline"), :timeline %>
+        <div class="row pb-3">
+            <div class="pt-2 col-3 viz-bar rounded-left">
+                <h4>The latest in the fight against systemic racism</h4>
+                <p>Learn about systemic racism by <%= link_to "exploring connections", :connections%> between archival records and fatal encounters with police in the Greater Bay Area.</p>
             </div>
-            <div class="col-1"></div>
-            <div class="col-3 bubbles rounded text-center">
-                <h2><%= link_to "Search for data on systemic racism", :data%></h2>
-                <%= link_to image_tag('button_resources.png', class: "img-fluid pt-5 d-none d-md-block", alt: "search resources"), :data %>
+            <div class="col-6 text-center viz-bar rounded-right">
+                <%= link_to image_tag('linkurious1.png', class: "img-fluid pt-2", alt: "connections"), :connections %>
             </div>
-            <div class="col-1"></div>
-            <div class="col-3 bubbles rounded text-center">
-                <h2><%= link_to "Get involved", :involved%></h2>
-                <p>Help us put an end to systemic racism</p>
-                <%= link_to image_tag('button_connect.png', class: "img-fluid pt-5 d-none d-md-block", alt: "get involved"), :involved %>
+            <div class="col-3 text-center">
+                <div class="text-center">
+                    <%= link_to image_tag('button_timeline.png', class: "img-fluid pt-4", alt: "timeline"), :timeline %>
+                </div>
+                <div class="text-center">
+                    <%= link_to image_tag('button_resources.png', class: "img-fluid pt-4", alt: "search resources"), :data %>
+                </div>
+                <div class="text-center">
+                    <%= link_to image_tag('button_connect.png', class: "img-fluid pt-4", alt: "get involved"), :involved %>
+                </div>
             </div>
         </div>
     </div>

config/routes.rb

@@ -8,4 +8,5 @@
   get 'policing', to: "default#policing"
   get 'contact', to: "default#contact"
   get 'about', to: "default#about"
+  get 'connections', to: "default#connections"
 end