Draft of the Reproducible Builds portfolio page

projects/reproducible-builds.html

@@ -0,0 +1,91 @@
+---
+layout: default
+section_id: portfolio
+title: Reproducible Builds | Styleguide
+---
+
+<div style="background-color: #1E5B96;" class="full new">
+  <div class="section-title new">
+    <div class="row">
+      <div class="medium-10 medium-centered columns">
+        <h1 class="wow slideInUp" style="color: white; font-size: 2rem;">Reproducible Builds Styleguide</h1>
+      </div>
+    </div>
+  </div>
+</div>
+<div class="full text">
+  <div class="row">
+    <div class="large-8 columns">
+      <img src="../images/@stock/enigmail.png" alt="">
+      <div class="spacing"></div>
+      <img src="../images/@stock/enigmail_icons.png" alt="">
+      <div class="spacing"></div>
+    </div>
+    <div class="large-4 columns">
+      <div class="project-intro">
+        <p>Reproducible builds are a set of software development practices that create an independently-verifiable path from source code to the binary code used by computers.</p>
+        <p>Enigmail approached us to redesign their logo and user interface iconography, in time for the newest Enigmail 2.0 release. As one of the defacto PGP tools we hope to make email encryption more accessible and usable by far more people.</p>
+        <hr>
+        <div class="spacing"></div>
+        <h4>Date</h4>
+        <p><span>April, 2018</span></p>
+        <h4>Clients</h4>
+        <p><span><a href="https://enigmail.net" target="_blank">Enigmail</a></span></p>
+        <h4>Category</h4>
+        <p><span>Visual Identity</span></p>
+         <hr>
+        <a class="button boxed black" href="https://github.com/uracreative/works/tree/master/Enigmail" target="_blank"><i class="fab fa-github"></i> Sources</a><br />
+         <a class="button boxed identihub" href="https://demo.identihub.co/project/enigmail" target="_blank"><img src="../images/@stock/identihub.svg" > Identihub</a><br />
+        <a class="button boxed enigmail" href="https://enigmail.net" target="_blank"><i class="fas fa-globe"></i> Website</a>
+      </div>
+    </div>
+  </div>
+</div>
+<hr>
+<div class="full">
+  <div class="section-title">
+    <div class="row">
+      <div class="medium-10 medium-centered columns">
+        <h2>Related projects</h2>
+      </div>
+    </div>
+  </div>
+  <div class="related-works">
+    <div class="row">
+      <div class="large-4 columns">
+        <div class="work-wrapper">
+          <a href="openlabs" class="work">
+            <img src="../images/@stock/openlabs.jpg" alt="">
+            <div class="info">
+              <h3>Open Labs</h3>
+              <p>Rebranding</p>
+            </div>
+          </a>
+        </div>
+      </div>
+      <div class="large-4 columns">
+        <div class="work-wrapper">
+          <a href="tor-style-guide" class="work">
+          <img src="../images/@stock/tor_thumb.png" alt="">
+          <div class="info">
+            <h3>Tor Style Guide</h3>
+            <p>Style Guide</p>
+          </div>
+        </a>
+        </div>
+      </div>
+      <div class="large-4 columns">
+        <div class="work-wrapper">
+          <a href="mozilla-l10n" class="work">
+            <img src="../images/@stock/mozilla-l10n.jpg" alt="">
+            <div class="info">
+              <h3>Mozilla L10N T-shirts</h3>
+              <p>Print</p>
+            </div>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+</div>