1 files changed, 131 insertions, 0 deletions
diff --git a/src/skin/firstRun.html b/src/skin/firstRun.html
new file mode 100644
index 0000000..307a90a
--- /dev/null
+++ b/src/skin/firstRun.html
@@ -0,0 +1,131 @@
+<!doctype html>
+<html>
+<head>
+  <title class="i18n_firstRun_title"></title>
+  <meta charset="utf-8">
+  <meta http-equiv="x-ua-compatible" content="ie=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link type="text/css" href="css/firstRun.css" rel="stylesheet" />
+  <script type="text/javascript" src="/lib/vendor/jquery-3.5.1.js"></script>
+  <script type="text/javascript" src="/lib/vendor/jquery.smooth-scroll.js"></script>
+  <script type="text/javascript" src="/lib/i18n.js"></script>
+  <script type="text/javascript" src="js/firstRun.js"></script>
+</head>
+<body>
+  <div class="grid-container full">
+
+    <div class="top-bar small-12 align-center cell">
+      <img src ="images/eff-logo.png" alt="">
+      <span class="i18n_intro_by_eff"></span>
+    </div>
+
+    <header class="grid-padding-y align-center">
+      <div class="small-12 text-center cell">
+        <img src="../icons/badger-bw-noborder.svg" alt="">
+      </div>
+      <div class="title-bar small-12 text-center cell">
+        <h1 class="i18n_name"></h1>
+      </div>
+    </header>
+
+    <!-- intro -->
+    <div id="intro" class="grid-x grid-padding-x align-center">
+      <div class="small-12 medium-10 text-center cell">
+        <h3 class="i18n_firstRun_title"></h3>
+      </div>
+      <div class="small-12 medium-10 large-4 text cell">
+        <p class="i18n_intro_welcome"></p>
+      </div>
+      <div class="small-12 text-center cell">
+        <a href="#pb-features-1" class="i18n_intro_next_button button large scroll-it"></a>
+      </div>
+    </div>
+
+    <!-- privacy badger features -->
+    <div id="pb-features-1" class="align-center">
+      <div>
+        <img src="images/learns-trackers.png" alt="">
+      </div>
+      <div>
+        <h3 class="i18n_intro_learns"></h3>
+        <p class="i18n_intro_learns_paragraph"></p>
+      </div>
+    </div>
+    <div id="pb-features-2" class="align-center">
+      <div class="cell hide-for-small-only">
+        <h3 class="i18n_intro_beyond_ads"></h3>
+        <p class="i18n_intro_beyond_ads_paragraph"></p>
+      </div>
+      <div class="small-12 large-3 cell">
+        <img src="images/catches-trackers.png" alt="">
+      </div>
+      <div class="cell hide-for-large hide-for-medium">
+        <h3 class="i18n_intro_beyond_ads"></h3>
+        <p class="i18n_intro_beyond_ads_paragraph"></p>
+      </div>
+    </div>
+    <div id="pb-features-3" class="align-center">
+      <div class="cell">
+        <img src="images/not-ad-blocker.png" alt="">
+      </div>
+      <div class="cell">
+        <h3 class="i18n_intro_not_an_adblocker"></h3>
+        <p class="i18n_intro_not_an_adblocker_paragraph"></p>
+      </div>
+    </div>
+    <div class="caret-down align-center">
+      <a href="#pb-settings" class="scroll-it"><img src="images/carrot-down.svg" alt="i18n_next_section"></a>
+    </div>
+
+    <!-- privacy badger settings -->
+    <div id="pb-settings" class="align-center">
+      <div class="text">
+        <img src="images/disable-badger.png" alt="">
+        <p class="i18n_intro_disable_button text"></p>
+        <p class="i18n_intro_report_button"></p>
+        <p class="i18n_intro_privacy_note"></p>
+      </div>
+    </div>
+    <div class="caret-down align-center">
+      <a href="#pb-donate" class="scroll-it"><img src="images/carrot-down.svg" alt="i18n_next_section"></a>
+    </div>
+
+    <!-- donate ask -->
+    <div id="pb-donate" class="align-center">
+      <div class="text-center">
+        <img src="images/pb-logo-outline.svg" alt="">
+        <h3 class="i18n_intro_donate_heading"></h3>
+        <p class="i18n_intro_donate1 text"></p>
+      </div>
+    </div>
+    <div id="pb-donate-button" class="align-center">
+      <div class="text-center">
+        <a class="i18n_donate_to_eff button large" target="_blank" href="https://supporters.eff.org/donate/support-privacy-badger"></a>
+      </div>
+    </div>
+    <div id="pb-donate-help" class="align-center">
+      <span class="i18n_intro_donate_subheading"></span>
+    </div>
+  </div>
+
+  <!-- social media icons -->
+  <div class="share-links">
+    <a class="share-facebook" target="_blank" rel="noopener noreferrer" href="https://www.facebook.com/share.php?u=https%3A%2F%2Feff.org%2Fprivacybadger">
+      <i></i>
+      <span class="i18n_share_button_title_facebook"></span>
+    </a>
+    <a class="share-twitter" target="_blank" rel="noopener noreferrer" href="https://twitter.com/home?status=I%20just%20installed%20Privacy%20Badger%2C%20a%20new%20tool%20from%20@EFF%20to%20stop%20companies%20from%20spying%20on%20your%20browsing%20habits%20https%3A%2F%2Feff.org%2Fprivacybadger&related=eff">
+      <i></i>
+      <span class="i18n_share_button_title_twitter"></span>
+    </a>
+  </div>
+
+  <!-- privacy policy link -->
+  <div class="grid-container full">
+    <div id="pb-privacy-policy">
+      <a class="i18n_intro_link_policy" target="_blank" href="https://www.eff.org/code/privacy/policy"></a>
+    </div>
+  </div>
+
+</body>
+</html>