Merge pull request jsonwebtoken#422 from jsonwebtoken/feature/ab-jwt-ebook-banner

Add ebook banner variation

Author: Sambego

.gitignore

@@ -3,4 +3,6 @@ dist
 .tmp
 .DS_Store
 npm-debug.log
-
+.dockerignore
+Dockerfile
+yarn.lock

Gruntfile.js

@@ -72,25 +72,25 @@ module.exports = grunt => {
           dest: 'dist/extension/css/'
         }]
       }
-    }, 
+    },
 
     crx: {
       pack: {
         src: "dist/extension/**/*",
-        dest: 'dist/chrome-jwt-debugger-extension-v' + 
+        dest: 'dist/chrome-jwt-debugger-extension-v' +
               `${extensionManifest.version}.zip`
       }
     },
 
     exec: {
       firefoxExtensionPack: {
-        command: 'node_modules/web-ext/bin/web-ext build ' + 
-                 '--source-dir=dist/extension --artifacts-dir=dist ' + 
+        command: 'node_modules/web-ext/bin/web-ext build ' +
+                 '--source-dir=dist/extension --artifacts-dir=dist ' +
                  '--overwrite-dest'
       },
       renameFirefoxExtension: {
-        command: `mv dist/jwt_debugger-${extensionManifest.version}.zip ` + 
-                 'dist/firefox-jwt-debugger-extension-' + 
+        command: `mv dist/jwt_debugger-${extensionManifest.version}.zip ` +
+                 'dist/firefox-jwt-debugger-extension-' +
                  `v${extensionManifest.version}.zip`
       }
     },
@@ -118,13 +118,14 @@ module.exports = grunt => {
         },
         files: {
           'dist/website/index.html': 'views/website/index.pug',
-          'dist/website/introduction/index.html': 
+          'dist/website/home/index.html': 'views/website/home.pug',
+          'dist/website/introduction/index.html':
             'views/website/introduction.pug'
         }
       },
       extension: {
         files: {
-          'dist/extension/index.html': 'views/extension/index.pug'          
+          'dist/extension/index.html': 'views/extension/index.pug'
         }
       }
     },
@@ -201,7 +202,7 @@ module.exports = grunt => {
           // Higher default timeout to account for some animations
           timeout: 10000
         },
-        src: ['test/functional/**.js']        
+        src: ['test/functional/**.js']
       }
     },
 
@@ -248,30 +249,30 @@ module.exports = grunt => {
     'exec:firefoxExtensionPack',
     'exec:renameFirefoxExtension'
   ]);
-  
+
   grunt.registerTask('build-extension-dev', [
     'clean:extension',
-    'copy:extension', 
+    'copy:extension',
     'build-extension-views',
     'webpack:extensionDev'
   ]);
-  
+
   grunt.registerTask('build', ['build-website', 'build-extension']);
-  
+
   grunt.registerTask('build-dev', [
     'build-website-dev',
     'build-extension-dev'
   ]);
 
   grunt.registerTask('unit-tests', ['webpack:unitTests', 'mochaTest:unit']);
-  
+
   grunt.registerTask('functional-tests', [
     'build-website-dev',
-    'connect:website',        
+    'connect:website',
     'mochaTest:functional'
   ]);
 
   grunt.registerTask('test', ['unit-tests', 'functional-tests']);
-  
+
   grunt.registerTask('default', ['build-dev', 'connect:website', 'watch']);
 };

img/website/ebook.png

@@ -423,6 +423,39 @@ body
     text-align: center;
     text-decoration: none;
 
+.jwt-ebook-banner-image
+  position: relative;
+  padding: 45px 0 235px;
+  background: #E3E5E7 url('/img/ebook.png') 100% 100% no-repeat;
+
+  p
+    margin-top: 0;
+
+  .btn-download-ebook
+    display: block;
+
+  &::after
+    content: '';
+    position: absolute
+    bottom: 202px;
+    left: 0;
+    right: 0;
+    width: 100%;
+    height: 35px;
+    background: linear-gradient(rgba(227, 229, 231,1), rgba(227, 229, 231,0));
+
+
+  @media (min-width: 768px)
+    height: 235px;
+    padding: 65px 0;
+    text-align: left;
+
+    .btn-download-ebook
+      display: inline-block;
+
+    &::after
+      display: none;
+
 // debugger-jwt
 
 .jwt-select

stylus/website/index.styl

@@ -0,0 +1,6 @@
+section.jtw-ebook-banner.jwt-ebook-banner-image
+  .container
+    p
+      strong Get the JWT Handbook for free!
+      |  Download it now and get up-to-speed faster.
+    a.btn.btn-download-ebook(href='https://auth0.com/resources/ebooks/jwt-handbook?utm_source=jwtio&utm_medium=variation&utm_campaign=gc_jwt_test_10_2019', target='_blank') Download Ebook

views/website/ebook-image.pug

@@ -2,4 +2,4 @@ section.jtw-ebook-banner
   span
     strong Get the JWT Handbook for free!
     |  Spread the word and download it now.
-  a.btn.btn-download-ebook(href='https://auth0.com/resources/ebooks/jwt-handbook?utm_source=jwtio&utm_medium=%3Cspan%20class="x x-first x-last">sc&utm_campaign=rotating_banner', target='_blank') Download Ebook
+  a.btn.btn-download-ebook(href='https://auth0.com/resources/ebooks/jwt-handbook?utm_source=jwtio&utm_medium=%3Cspan%20class="x x-first x-last">control&utm_campaign=gc_jwt_test_10_2019', target='_blank') Download Ebook

views/website/ebook.pug

@@ -0,0 +1,55 @@
+extends layout
+
+block content
+  nav.navbar.closed
+    .container
+      .top-mobile
+        .menu-trigger
+          span
+
+        a.brand(href='/')
+          img(src='/img/pic_logo.svg').icon
+          img(src='/img/logo.svg').logo
+
+      nav.menu
+        a(href='#debugger-io').scrollto Debugger
+        a(href='#libraries-io').scrollto Libraries
+        a(href='/introduction') Introduction
+        a(href='https://community.auth0.com/c/identity/jwt', target='_blank') Ask
+        a(href='http://swag.auth0.com/', target='_blank') Get a T-shirt!
+
+      .social
+        a.a0(href='https://auth0.com/?utm_source=jwtio&utm_campaign=craftedby', target='_blank')
+          span.by-text Crafted by
+          img(src='/img/pic_logo_ft.svg', alt='Token Based Authentication')
+
+      a.supported(href='https://auth0.com/?utm_source=jwtio&utm_campaign=craftedby', target="_blank")
+          | Supported by
+          img(src='/img/ico_logo.svg', alt='Token Based Authentication')
+
+  section.banner-jwt
+    .container
+      a.logo(href='/')
+        img(src='/img/pic_logo.svg', alt='Token Based Authentication')
+
+      p
+        | JSON Web Tokens are an open, industry standard 
+        a(href='https://tools.ietf.org/html/rfc7519', target='_blank') RFC 7519
+        |  method for representing claims securely between two parties.
+      p JWT.IO allows you to decode, verify and generate JWT.
+
+      a.btn.btn-lg(href="/introduction") Learn more about jwt
+
+  include extension.pug
+  
+  include ebook-image.pug
+
+  include token-editor.pug
+
+  include libraries.pug
+
+  include assets.pug
+
+  include counter.pug
+
+  script(src='/js/index.js')