Skip to content

Commit e3e67fb

Browse files
committed
Merge branch 'arielger-add-extension-button'
2 parents 49b827c + b32a3bf commit e3e67fb

File tree

4 files changed

+54
-42
lines changed

4 files changed

+54
-42
lines changed

css/app.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
33
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
44
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
5-
})(window,document,'script','dataLayer','GTM-PT2SNS');</script><!-- End Google Tag Manager —>--><nav class="navbar closed"><div class="container"><div class="top-mobile"><div class="menu-trigger"><span></span></div><a href="/" class="brand"><img src="/img/pic_logo.svg" class="icon"><img src="/img/logo.svg" class="logo"></a></div><nav class="menu"><a href="#debugger-io" class="scrollto">Debugger</a><a href="#libraries-io" class="scrollto">Libraries</a><a href="/introduction">Introduction</a><a href="https://ask.auth0.com/category/jwt" target="_blank">Ask</a><a href="http://swag.auth0.com/" target="_blank">Get a T-shirt!</a></nav><div class="social"><a href="https://auth0.com/" target="_blank" class="a0"><img src="/img/ico_a0_white.svg"></a><a href="https://twitter.com/auth0" target="_blank" class="twitter"><img src="/img/ico_twitter.svg"></a></div><a href="https://auth0.com/" target="_blank" class="supported">Supported by<img src="/img/ico_logo.svg"></a></div></nav><section class="banner-jwt"><div class="container"><a href="/" class="logo"><img src="/img/pic_logo.svg"></a><p>JSON Web Tokens are an open, industry standard&nbsp;<a href="https://tools.ietf.org/html/rfc7519" target="_blank">RFC 7519</a> method for representing claims securely between two parties.</p><p>JWT.IO allows you to decode, verify and generate JWT.</p><a href="/introduction" class="btn btn-lg">Learn more about jwt</a></div></section><section class="update-site"><svg width="32px" height="32px" viewbox="0 0 32 32" version="1.1" class="paper"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="32px" sketch:type="MSLayerGroup" transform="translate(-805.000000, -2193.000000)" fill="#373A39"><path id="Fill-529" d="M835,2221 C835,2222.1 834.104,2223 833,2223 L809,2223 C807.896,2223 807,2222.1 807,2221 L807,2197 C807,2195.89 807.896,2195 809,2195 L833,2195 C834.104,2195 835,2195.89 835,2197 L835,2221 L835,2221 Z M833,2193 L809,2193 C806.79,2193 805,2194.79 805,2197 L805,2221 C805,2223.21 806.79,2225 809,2225 L833,2225 C835.209,2225 837,2223.21 837,2221 L837,2197 C837,2194.79 835.209,2193 833,2193 L833,2193 Z M828,2203 L814,2203 C813.447,2203 813,2203.45 813,2204 C813,2204.55 813.447,2205 814,2205 L828,2205 C828.552,2205 829,2204.55 829,2204 C829,2203.45 828.552,2203 828,2203 L828,2203 Z M828,2209 L814,2209 C813.447,2209 813,2209.45 813,2210 C813,2210.55 813.447,2211 814,2211 L828,2211 C828.552,2211 829,2210.55 829,2210 C829,2209.45 828.552,2209 828,2209 L828,2209 Z M828,2215 L814,2215 C813.447,2215 813,2215.45 813,2216 C813,2216.55 813.447,2217 814,2217 L828,2217 C828.552,2217 829,2216.55 829,2216 C829,2215.45 828.552,2215 828,2215 L828,2215 Z" sketch:type="MSShapeGroup"></path></g></g></svg><strong>NEW!&nbsp;</strong><span>JWT.IO gets a refresh! New logo, new website and more.</span><a href="https://auth0.com/blog/2015/07/21/jwt-json-webtoken-logo/" target="_blank">Learn More<svg height="48" viewbox="0 0 48 48" width="48" xmlns="http://www.w3.org/2000/svg"><path d="M-838-2232H562v3600H-838z" fill="none"></path><path d="M16 10v28l22-14z"></path><path d="M0 0h48v48H0z" fill="none"></path></svg></a></section><section id="debugger-io" class="debugger-jwt"><div class="container"><h1>Debugger</h1><div class="jwt-playground"><div class="algorithm"><span>Algorithm</span><div class="hide"><label><input type="radio" name="algorithm" value="HS256" checked=""></label><label><input type="radio" name="algorithm" value="RS256"></label></div><div class="jwt-select"><select><option name="algorithm" value="HS256" selected="">HS256</option><option name="algorithm" value="RS256">RS256</option></select></div></div><div class="algorithm-code"><div class="tab-nav"><div class="tab-link current"><a href="#encoded-jwt">Encoded<small>paste a token here</small></a></div><div class="tab-link"><a href="#decoded-jwt">Decoded<small>edit the payload and secret (only HS256 supported)</small></a></div></div><div class="tab-content"><div id="encoded-jwt" class="box-content current"><div class="input js-input"></div></div><div id="decoded-jwt" class="box-content"><div class="output"><div class="jwt-explained jwt-header"><p class="text-line">HEADER:<span>ALGORITHM & TOKEN TYPE</span></p><div class="js-header"></div></div><div class="jwt-explained jwt-payload"><p class="text-line">PAYLOAD:<span>DATA</span></p><div class="js-payload"></div></div><div class="jwt-explained jwt-signature"><p class="text-line">VERIFY SIGNATURE</p><pre class="pre-encode HS256">HMACSHA256(
5+
})(window,document,'script','dataLayer','GTM-PT2SNS');</script><!-- End Google Tag Manager —>--><nav class="navbar closed"><div class="container"><div class="top-mobile"><div class="menu-trigger"><span></span></div><a href="/" class="brand"><img src="/img/pic_logo.svg" class="icon"><img src="/img/logo.svg" class="logo"></a></div><nav class="menu"><a href="#debugger-io" class="scrollto">Debugger</a><a href="#libraries-io" class="scrollto">Libraries</a><a href="/introduction">Introduction</a><a href="https://ask.auth0.com/category/jwt" target="_blank">Ask</a><a href="http://swag.auth0.com/" target="_blank">Get a T-shirt!</a></nav><div class="social"><a href="https://auth0.com/" target="_blank" class="a0"><img src="/img/ico_a0_white.svg"></a><a href="https://twitter.com/auth0" target="_blank" class="twitter"><img src="/img/ico_twitter.svg"></a></div><a href="https://auth0.com/" target="_blank" class="supported">Supported by<img src="/img/ico_logo.svg"></a></div></nav><section class="banner-jwt"><div class="container"><a href="/" class="logo"><img src="/img/pic_logo.svg"></a><p>JSON Web Tokens are an open, industry standard&nbsp;<a href="https://tools.ietf.org/html/rfc7519" target="_blank">RFC 7519</a> method for representing claims securely between two parties.</p><p>JWT.IO allows you to decode, verify and generate JWT.</p><a href="/introduction" class="btn btn-lg">Learn more about jwt</a></div></section><section class="update-site"><span><strong>Love JWT.IO? </strong>Bring the debugger to your favorite browser with our new chrome extension.</span><a href="https://chrome.google.com/webstore/detail/jwt-debugger/ppmmlchacdbknfphdeafcbmklcghghmd" target="_blank" class="extension-button"><svg width="14px" height="13px" viewbox="24 11 14 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path id="path-1" d="M30.0287226,15.7142857 L30.0287226,11 L31.600907,11 L31.600907,15.7142857 L36.3174603,15.7142857 L36.3174603,17.2857143 L31.600907,17.2857143 L31.600907,22 L30.0287226,22 L30.0287226,17.2857143 L25.3121693,17.2857143 L25.3121693,15.7142857 L30.0287226,15.7142857 Z"></path><filter id="filter-2" x="-50%" y="-50%" width="200%" height="200%" filterunits="objectBoundingBox"><feoffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feoffset><fegaussianblur stddeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></fegaussianblur><fecolormatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0" type="matrix" in="shadowBlurOuter1"></fecolormatrix></filter></defs><g id="Rectangle-213" stroke="none" fill="none"><use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use><use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use></g></svg>Add to chrome</a></section><section id="debugger-io" class="debugger-jwt"><div class="container"><h1>Debugger</h1><div class="jwt-playground"><div class="algorithm"><span>Algorithm</span><div class="hide"><label><input type="radio" name="algorithm" value="HS256" checked=""></label><label><input type="radio" name="algorithm" value="RS256"></label></div><div class="jwt-select"><select><option name="algorithm" value="HS256" selected="">HS256</option><option name="algorithm" value="RS256">RS256</option></select></div></div><div class="algorithm-code"><div class="tab-nav"><div class="tab-link current"><a href="#encoded-jwt">Encoded<small>paste a token here</small></a></div><div class="tab-link"><a href="#decoded-jwt">Decoded<small>edit the payload and secret (only HS256 supported)</small></a></div></div><div class="tab-content"><div id="encoded-jwt" class="box-content current"><div class="input js-input"></div></div><div id="decoded-jwt" class="box-content"><div class="output"><div class="jwt-explained jwt-header"><p class="text-line">HEADER:<span>ALGORITHM & TOKEN TYPE</span></p><div class="js-header"></div></div><div class="jwt-explained jwt-payload"><p class="text-line">PAYLOAD:<span>DATA</span></p><div class="js-payload"></div></div><div class="jwt-explained jwt-signature"><p class="text-line">VERIFY SIGNATURE</p><pre class="pre-encode HS256">HMACSHA256(
66
base64UrlEncode(header) + "." +
77
base64UrlEncode(payload),
88
<input type="text" name="secret" value="secret">

stylus/app.styl

Lines changed: 36 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -328,42 +328,51 @@ body
328328

329329
.update-site
330330
background: #e3e5e7
331-
padding: 14px 20px;
332-
font-size: 13px;
331+
padding: 30px 20px;
332+
font-size: 18px;
333333
text-align: center;
334334
color: darken(#e3e5e7, 70%)
335-
.paper
336-
margin-right: 4px;
337-
display: inline-block
338-
position: relative;
339-
bottom: -2px;
340-
font-size: 15px;
341-
opacity: .5
342-
height: 14px;
343-
width: 16px;
335+
336+
+breakpoint("desktop")
337+
padding: 30px 0;
338+
344339
span
345-
display: none
346-
+breakpoint("tablet")
347-
display: inline-block
340+
margin-right 5px
341+
display inline-block
342+
line-height 33px
343+
display block
344+
margin-bottom 15px
348345

346+
+breakpoint("desktop")
347+
display inline-block
348+
margin-bottom 0
349+
350+
strong
351+
margin-right 5px
352+
353+
a.extension-button
354+
font-size: 12px;
355+
text-transform: uppercase;
356+
color: white;
357+
padding: 0 21px;
358+
display: inline-block;
359+
border-radius: 2px;
360+
margin-left: 11px;
361+
text-shadow: 0 1px 1px rgba(black, 0.1);
362+
border: 1px solid #2D53AF;
363+
background-color: #5689DB;
364+
background: linear-gradient(to bottom, #5689DB , #4D7BD6);
365+
height: 34px;
366+
line-height: 34px;
349367

350-
a
351-
text-decoration: none;
352-
font-weight: bold
353-
display: block;
354-
margin-top: 10px;
355-
+breakpoint("tablet")
356-
display: inline-block
357-
margin-top: 0;
358-
margin-left: 4px;
359368
svg
360-
fill: darken(#00b9f1, 20%)
369+
fill: #0094c1;
361370
height: 14px;
362371
width: 12px;
363372
margin-bottom: -3px;
364-
365-
&:hover svg
366-
fill: darken(#00b9f1, 50%)
373+
margin-right: 10px;
374+
line-height: 33px;
375+
display: inline-block;
367376

368377

369378
// debugger-jwt

views/index.jade

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -42,19 +42,22 @@ block content
4242
a.btn.btn-lg(href="/introduction") Learn more about jwt
4343

4444
section.update-site
45-
svg(width='32px', height='32px', viewbox='0 0 32 32', version='1.1', class="paper")
46-
g#Page-1(stroke='none', stroke-width='1', fill='none', fill-rule='evenodd', sketch:type='MSPage')
47-
g#32px(sketch:type='MSLayerGroup', transform='translate(-805.000000, -2193.000000)', fill='#373A39')
48-
path#Fill-529(d='M835,2221 C835,2222.1 834.104,2223 833,2223 L809,2223 C807.896,2223 807,2222.1 807,2221 L807,2197 C807,2195.89 807.896,2195 809,2195 L833,2195 C834.104,2195 835,2195.89 835,2197 L835,2221 L835,2221 Z M833,2193 L809,2193 C806.79,2193 805,2194.79 805,2197 L805,2221 C805,2223.21 806.79,2225 809,2225 L833,2225 C835.209,2225 837,2223.21 837,2221 L837,2197 C837,2194.79 835.209,2193 833,2193 L833,2193 Z M828,2203 L814,2203 C813.447,2203 813,2203.45 813,2204 C813,2204.55 813.447,2205 814,2205 L828,2205 C828.552,2205 829,2204.55 829,2204 C829,2203.45 828.552,2203 828,2203 L828,2203 Z M828,2209 L814,2209 C813.447,2209 813,2209.45 813,2210 C813,2210.55 813.447,2211 814,2211 L828,2211 C828.552,2211 829,2210.55 829,2210 C829,2209.45 828.552,2209 828,2209 L828,2209 Z M828,2215 L814,2215 C813.447,2215 813,2215.45 813,2216 C813,2216.55 813.447,2217 814,2217 L828,2217 C828.552,2217 829,2216.55 829,2216 C829,2215.45 828.552,2215 828,2215 L828,2215 Z', sketch:type='MSShapeGroup')
49-
50-
strong NEW!&nbsp;
51-
span JWT.IO gets a refresh! New logo, new website and more.
52-
a(href="https://auth0.com/blog/2015/07/21/jwt-json-webtoken-logo/", target="_blank")
53-
| Learn More
54-
svg(height='48', viewbox='0 0 48 48', width='48', xmlns='http://www.w3.org/2000/svg')
55-
path(d='M-838-2232H562v3600H-838z', fill='none')
56-
path(d='M16 10v28l22-14z')
57-
path(d='M0 0h48v48H0z', fill='none')
45+
span
46+
strong Love JWT.IO?
47+
| Bring the debugger to your favorite browser with our new chrome extension.
48+
a(href="https://chrome.google.com/webstore/detail/jwt-debugger/ppmmlchacdbknfphdeafcbmklcghghmd", class="extension-button", target="_blank")
49+
svg(width='14px', height='13px', viewbox='24 11 14 13', version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink')
50+
defs
51+
path#path-1(d='M30.0287226,15.7142857 L30.0287226,11 L31.600907,11 L31.600907,15.7142857 L36.3174603,15.7142857 L36.3174603,17.2857143 L31.600907,17.2857143 L31.600907,22 L30.0287226,22 L30.0287226,17.2857143 L25.3121693,17.2857143 L25.3121693,15.7142857 L30.0287226,15.7142857 Z')
52+
filter#filter-2(x='-50%', y='-50%', width='200%', height='200%', filterunits='objectBoundingBox')
53+
feoffset(dx='0', dy='1', in='SourceAlpha', result='shadowOffsetOuter1')
54+
fegaussianblur(stddeviation='0.5', in='shadowOffsetOuter1', result='shadowBlurOuter1')
55+
fecolormatrix(values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0', type='matrix', in='shadowBlurOuter1')
56+
g#Rectangle-213(stroke='none', fill='none')
57+
use(fill='black', fill-opacity='1', filter='url(#filter-2)', xlink:href='#path-1')
58+
use(fill='#FFFFFF', fill-rule='evenodd', xlink:href='#path-1')
59+
60+
| Add to chrome
5861

5962
section#debugger-io.debugger-jwt
6063
.container

0 commit comments

Comments
 (0)