Skip to content

Commit cad935d

Browse files
committed
banner
1 parent a32f000 commit cad935d

File tree

4 files changed

+21
-1
lines changed

4 files changed

+21
-1
lines changed

dist/css/app.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3290,4 +3290,4 @@ footer.site-footer .col-md-11 {
32903290
margin: 0;
32913291
}
32923292
.sidebar-box ul li i:before {
3293-
content: "\e16f";font-family:budicon-font!important;speak:none}.sidebar-box ul li i{width:10px;display:inline-block;font-family:budicon-font!important;font-style:normal!important;font-weight:400!important;font-variant:normal!important;text-transform:none!important;speak:none;line-height:1;margin-right:8px;position:relative;top:2px;height:14px}.sidebar-box ul li.selected a{color:#000!important}.try-banner{text-align:center;background:#f9f9f9;margin:80px 0;padding:50px 20px 44px;border-radius:3px}.try-banner span{font-size:30px;font-weight:100;display:inline-block}.try-banner .btn{margin-left:20px;margin-top:-20px}.try-banner .copy{color:#666;margin-top:30px}@media screen and (max-width:660px){.try-banner{padding:20px;margin-top:40px;text-align:center;margin-bottom:20px}.try-banner span{display:block;margin-bottom:20px}.try-banner .btn{width:100%;display:block;white-space:normal;margin:0}}@-moz-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@-webkit-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@-o-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@-ms-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}body{overflow-x:hidden}.container{max-width:1016px}.banner-container{position:relative}.grid{background-image:linear-gradient(0deg,transparent 24%,rgba(255,255,255,.05)25%,rgba(255,255,255,.05)26%,transparent 27%,transparent 74%,rgba(255,255,255,.05)75%,rgba(255,255,255,.05)76%,transparent 77%,transparent),linear-gradient(90deg,transparent 24%,rgba(255,255,255,.05)25%,rgba(255,255,255,.05)26%,transparent 27%,transparent 74%,rgba(255,255,255,.05)75%,rgba(255,255,255,.05)76%,transparent 77%,transparent);background-size:50px 50px;width:100%;position:absolute;top:0;bottom:0;right:0;left:0}.banner-container{display:block;-webkit-animation-name:appear;-webkit-animation-duration:.5s;-webkit-animation-iteration-count:once;-webkit-animation-timing-function:ease-in}@-webkit-keyframes appear{0%{opacity:0}100%{opacity:1}}.bg-grey{border-top:1px solid #f1f1f1;border-bottom:1px solid #f1f1f1;background:0 0}.float-right{float:right}.float-left{float:left}.align-center{text-align:center}.container.spacing-content{padding-top:80px;padding-bottom:80px}.help-circle{max-height:14px;max-width:14px;opacity:.2;margin-left:4px;position:relative;top:-2px}.help-circle:hover{opacity:1}section.section{margin-bottom:80px}span.icon-badge{background:#d0d2d3;width:60px;height:60px;border-radius:3px;display:inline-block;color:#eb5424;font-size:30px;line-height:72px}.narrow-content{max-width:680px;margin:auto;text-align:center;font-size:120%}.narrow-content p{color:#666}.narrow-content ul{padding-left:0}.narrow-content ul.ul-inline{margin:20px 0}.narrow-content ul.ul-inline li{background:url(/homepage/img/icon-checkmark.png) left 4px no-repeat;display:inline-block;padding-left:30px;margin:0 20px}.narrow-content ul.ul-large{text-align:left}.narrow-content ul li{margin-bottom:20px;background:url(/homepage/img/icon-checkmark.png) left 4px no-repeat;padding-left:30px;list-style:none}pre.code-snippet.prettyprint{background:rgba(255,255,255,.96);border:0;border-left:30px solid #f1f1f1;color:#333;font-size:11px;font-family:monospace;line-height:20px;margin-bottom:0;padding:10px 10px 10px 2px;border-radius:3px;box-shadow:0 1px 6px rgba(0,0,0,.4);list-style:dotted}pre.code-snippet.prettyprint ol{margin:0;padding:0;color:#999;width:600px}pre.code-snippet.prettyprint li.L1,pre.code-snippet.prettyprint li.L3,pre.code-snippet.prettyprint li.L5,pre.code-snippet.prettyprint li.L7,pre.code-snippet.prettyprint li.L9{background:0 0}pre.code-snippet.prettyprint li.L0,pre.code-snippet.prettyprint li.L1,pre.code-snippet.prettyprint li.L2,pre.code-snippet.prettyprint li.L3,pre.code-snippet.prettyprint li.L5,pre.code-snippet.prettyprint li.L6,pre.code-snippet.prettyprint li.L7,pre.code-snippet.prettyprint li.L8{list-style:inherit}pre.code-snippet.prettyprint li{padding-left:10px;margin:0}.pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.clo,.opn,.pun{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:700}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:700}.lit{color:#044}.clo,.opn,.pun{color:#440}.tag{color:#006;font-weight:700}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:20px;border:0}pre.prettyprint.prettyprinted{border:0!important;padding:20px!important}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}@media screen and (max-width:768px){.quotes blockquote{min-height:10px;position:static}.zopim{display:none}}body{font-family:'Helvetica Neue',sans-serif,Helvetica;background:#fff;zoom:1;font-size:large}.CodeMirror{zoom:1;font-family:'Source Code Pro'}h1{margin-bottom:0}code,pre{padding:0;margin:0;font-family:'Source Code Pro',Consolas}.panel-footer{font-size:14px}.panel-title{font-weight:700}.container{min-width:1280px}.banner{background:linear-gradient(120deg,#14204d 0,#3cc8f4 100%)}.jwt-playground{width:100%}.jwt-playground .input{border:1px solid #ECECEC;padding:10px;margin-bottom:2px;background:#fff}.jwt-playground .input.error{background:pink}.jwt-playground .input:hover{-webkit-box-shadow:0 0 4px #54a1e9;-moz-box-shadow:0 0 4px #54a1e9;box-shadow:0 0 4px #54a1e9}.jwt-playground .input .CodeMirror{width:100%;background:0 0;font-size:20px;min-height:369px;height:auto}.jwt-playground .input .CodeMirror .cm-jwt-dot{color:#000}.jwt-playground .input .CodeMirror .cm-jwt-header{color:#859900}.jwt-playground .input .CodeMirror .cm-jwt-payload{color:#268bd2}.jwt-playground .input .CodeMirror .cm-jwt-signature{color:#dc322f}.jwt-playground .output{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.jwt-playground .output .jwt-explained{background:#fff;border:1px solid #ECECEC;padding:10px;margin-bottom:2px}.jwt-playground .output .jwt-explained.error{background:rgba(100,0,0,.1)}.jwt-playground .output .jwt-explained:hover{-webkit-box-shadow:0 0 4px #54a1e9;-moz-box-shadow:0 0 4px #54a1e9;box-shadow:0 0 4px #54a1e9}.jwt-playground .output .jwt-explained .CodeMirror{width:100%;height:auto;background:0 0;font-size:20px}.jwt-playground .output .jwt-header,.jwt-playground .output .jwt-header .CodeMirror,.jwt-playground .output .jwt-header .CodeMirror .cm-atom,.jwt-playground .output .jwt-header .CodeMirror .cm-number,.jwt-playground .output .jwt-header .CodeMirror .cm-property,.jwt-playground .output .jwt-header .CodeMirror .cm-string{color:#859900}.jwt-playground .output .jwt-payload,.jwt-playground .output .jwt-payload .CodeMirror,.jwt-playground .output .jwt-payload .CodeMirror .cm-atom,.jwt-playground .output .jwt-payload .CodeMirror .cm-number,.jwt-playground .output .jwt-payload .CodeMirror .cm-property,.jwt-playground .output .jwt-payload .CodeMirror .cm-string{color:#268bd2}.jwt-playground .output .jwt-signature{color:#dc322f;font-family:monospace}.jwt-playground .output .jwt-signature pre{background-color:transparent;border:0;color:#dc322f}.jwt-playground .output .jwt-signature span.is-base64-encoded-label{font-size:x-small}.jwt-playground .validation-status{background:#fff;padding:15px;margin-top:20px;clear:both;text-align:center;width:100%;color:#fff;text-transform:uppercase;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.jwt-playground .validation-status.valid-token{background:green}.jwt-playground .validation-status.invalid-token{background:red}.library div i{padding-right:10px}html{position:relative;min-height:100%}body{margin-bottom:60px}#footer{position:absolute;bottom:0;width:100%;height:60px;background-color:#f5f5f5}body>.container{padding:60px 15px 0}.container .text-muted{margin:20px 0}#footer>.container{padding-right:15px;padding-left:15px}code{font-size:80%}.navbar{height:50px}
3293+
content: "\e16f";font-family:budicon-font!important;speak:none}.sidebar-box ul li i{width:10px;display:inline-block;font-family:budicon-font!important;font-style:normal!important;font-weight:400!important;font-variant:normal!important;text-transform:none!important;speak:none;line-height:1;margin-right:8px;position:relative;top:2px;height:14px}.sidebar-box ul li.selected a{color:#000!important}.try-banner{text-align:center;background:#f9f9f9;margin:80px 0;padding:50px 20px 44px;border-radius:3px}.try-banner span{font-size:30px;font-weight:100;display:inline-block}.try-banner .btn{margin-left:20px;margin-top:-20px}.try-banner .copy{color:#666;margin-top:30px}@media screen and (max-width:660px){.try-banner{padding:20px;margin-top:40px;text-align:center;margin-bottom:20px}.try-banner span{display:block;margin-bottom:20px}.try-banner .btn{width:100%;display:block;white-space:normal;margin:0}}@-moz-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@-webkit-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@-o-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@-ms-keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}@keyframes icon_banner{0%{top:-100px;opacity:0}100%{opacity:1;top:0}}body{overflow-x:hidden}.container{max-width:1016px}.banner-container{position:relative}.grid{background-image:linear-gradient(0deg,transparent 24%,rgba(255,255,255,.05)25%,rgba(255,255,255,.05)26%,transparent 27%,transparent 74%,rgba(255,255,255,.05)75%,rgba(255,255,255,.05)76%,transparent 77%,transparent),linear-gradient(90deg,transparent 24%,rgba(255,255,255,.05)25%,rgba(255,255,255,.05)26%,transparent 27%,transparent 74%,rgba(255,255,255,.05)75%,rgba(255,255,255,.05)76%,transparent 77%,transparent);background-size:50px 50px;width:100%;position:absolute;top:0;bottom:0;right:0;left:0}.banner-container{display:block;-webkit-animation-name:appear;-webkit-animation-duration:.5s;-webkit-animation-iteration-count:once;-webkit-animation-timing-function:ease-in}@-webkit-keyframes appear{0%{opacity:0}100%{opacity:1}}.bg-grey{border-top:1px solid #f1f1f1;border-bottom:1px solid #f1f1f1;background:0 0}.float-right{float:right}.float-left{float:left}.align-center{text-align:center}.container.spacing-content{padding-top:80px;padding-bottom:80px}.help-circle{max-height:14px;max-width:14px;opacity:.2;margin-left:4px;position:relative;top:-2px}.help-circle:hover{opacity:1}section.section{margin-bottom:80px}span.icon-badge{background:#d0d2d3;width:60px;height:60px;border-radius:3px;display:inline-block;color:#eb5424;font-size:30px;line-height:72px}.narrow-content{max-width:680px;margin:auto;text-align:center;font-size:120%}.narrow-content p{color:#666}.narrow-content ul{padding-left:0}.narrow-content ul.ul-inline{margin:20px 0}.narrow-content ul.ul-inline li{background:url(/homepage/img/icon-checkmark.png) left 4px no-repeat;display:inline-block;padding-left:30px;margin:0 20px}.narrow-content ul.ul-large{text-align:left}.narrow-content ul li{margin-bottom:20px;background:url(/homepage/img/icon-checkmark.png) left 4px no-repeat;padding-left:30px;list-style:none}pre.code-snippet.prettyprint{background:rgba(255,255,255,.96);border:0;border-left:30px solid #f1f1f1;color:#333;font-size:11px;font-family:monospace;line-height:20px;margin-bottom:0;padding:10px 10px 10px 2px;border-radius:3px;box-shadow:0 1px 6px rgba(0,0,0,.4);list-style:dotted}pre.code-snippet.prettyprint ol{margin:0;padding:0;color:#999;width:600px}pre.code-snippet.prettyprint li.L1,pre.code-snippet.prettyprint li.L3,pre.code-snippet.prettyprint li.L5,pre.code-snippet.prettyprint li.L7,pre.code-snippet.prettyprint li.L9{background:0 0}pre.code-snippet.prettyprint li.L0,pre.code-snippet.prettyprint li.L1,pre.code-snippet.prettyprint li.L2,pre.code-snippet.prettyprint li.L3,pre.code-snippet.prettyprint li.L5,pre.code-snippet.prettyprint li.L6,pre.code-snippet.prettyprint li.L7,pre.code-snippet.prettyprint li.L8{list-style:inherit}pre.code-snippet.prettyprint li{padding-left:10px;margin:0}.pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.clo,.opn,.pun{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:700}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:700}.lit{color:#044}.clo,.opn,.pun{color:#440}.tag{color:#006;font-weight:700}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:20px;border:0}pre.prettyprint.prettyprinted{border:0!important;padding:20px!important}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}@media screen and (max-width:768px){.quotes blockquote{min-height:10px;position:static}.zopim{display:none}}body{font-family:'Helvetica Neue',sans-serif,Helvetica;background:#fff;zoom:1;font-size:large}.CodeMirror{zoom:1;font-family:'Source Code Pro'}h1{margin-bottom:0}code,pre{padding:0;margin:0;font-family:'Source Code Pro',Consolas}.panel-footer{font-size:14px}.panel-title{font-weight:700}.container{min-width:1280px}.banner{background:linear-gradient(120deg,#14204d 0,#3cc8f4 100%)}.banner img{width:140px}.banner a{color:#fff}.jwt-playground{width:100%}.jwt-playground .input{border:1px solid #ECECEC;padding:10px;margin-bottom:2px;background:#fff}.jwt-playground .input.error{background:pink}.jwt-playground .input:hover{-webkit-box-shadow:0 0 4px #54a1e9;-moz-box-shadow:0 0 4px #54a1e9;box-shadow:0 0 4px #54a1e9}.jwt-playground .input .CodeMirror{width:100%;background:0 0;font-size:20px;min-height:369px;height:auto}.jwt-playground .input .CodeMirror .cm-jwt-dot{color:#000}.jwt-playground .input .CodeMirror .cm-jwt-header{color:#859900}.jwt-playground .input .CodeMirror .cm-jwt-payload{color:#268bd2}.jwt-playground .input .CodeMirror .cm-jwt-signature{color:#dc322f}.jwt-playground .output{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.jwt-playground .output .jwt-explained{background:#fff;border:1px solid #ECECEC;padding:10px;margin-bottom:2px}.jwt-playground .output .jwt-explained.error{background:rgba(100,0,0,.1)}.jwt-playground .output .jwt-explained:hover{-webkit-box-shadow:0 0 4px #54a1e9;-moz-box-shadow:0 0 4px #54a1e9;box-shadow:0 0 4px #54a1e9}.jwt-playground .output .jwt-explained .CodeMirror{width:100%;height:auto;background:0 0;font-size:20px}.jwt-playground .output .jwt-header,.jwt-playground .output .jwt-header .CodeMirror,.jwt-playground .output .jwt-header .CodeMirror .cm-atom,.jwt-playground .output .jwt-header .CodeMirror .cm-number,.jwt-playground .output .jwt-header .CodeMirror .cm-property,.jwt-playground .output .jwt-header .CodeMirror .cm-string{color:#859900}.jwt-playground .output .jwt-payload,.jwt-playground .output .jwt-payload .CodeMirror,.jwt-playground .output .jwt-payload .CodeMirror .cm-atom,.jwt-playground .output .jwt-payload .CodeMirror .cm-number,.jwt-playground .output .jwt-payload .CodeMirror .cm-property,.jwt-playground .output .jwt-payload .CodeMirror .cm-string{color:#268bd2}.jwt-playground .output .jwt-signature{color:#dc322f;font-family:monospace}.jwt-playground .output .jwt-signature pre{background-color:transparent;border:0;color:#dc322f}.jwt-playground .output .jwt-signature span.is-base64-encoded-label{font-size:x-small}.jwt-playground .validation-status{background:#fff;padding:15px;margin-top:20px;clear:both;text-align:center;width:100%;color:#fff;text-transform:uppercase;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.jwt-playground .validation-status.valid-token{background:green}.jwt-playground .validation-status.invalid-token{background:red}.library div i{padding-right:10px}html{position:relative;min-height:100%}body{margin-bottom:60px}#footer{position:absolute;bottom:0;width:100%;height:60px;background-color:#f5f5f5}body>.container{padding:60px 15px 0}.container .text-muted{margin:20px 0}#footer>.container{padding-right:15px;padding-left:15px}code{font-size:80%}.navbar{height:50px}

html/index.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -434,6 +434,13 @@ <h3 class="panel-title">JavaScript</h3>
434434
</div>
435435
</div>
436436

437+
<div class="banner">
438+
<img src="/vendor/auth0-styleguide/img/logo-grey.png" />
439+
440+
<p>JWT.io is brought to you by <a href="https://auth0.com">Auth0</a></p>
441+
<p>A cloud service, APIs and tools that eliminate the friction of identity for your applications and APIs.</p>
442+
<p><a href="https://auth0.com" target="_blank" class="btn btn-success btn-lg">Get started now</a></p>
443+
</div>
437444

438445

439446
<div id="footer">

index.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -429,6 +429,13 @@ <h3 class="panel-title">JavaScript</h3>
429429
</div>
430430
</div>
431431

432+
<div class="banner">
433+
<img src="/vendor/auth0-styleguide/img/logo-grey.png">
434+
435+
<p>JWT.io is brought to you by <a href="https://auth0.com">Auth0</a></p>
436+
<p>A cloud service, APIs and tools that eliminate the friction of identity for your applications and APIs.</p>
437+
<p><a href="https://auth0.com" target="_blank" class="btn btn-success btn-lg">Get started now</a></p>
438+
</div>
432439

433440

434441
<div id="footer">

less/app.less

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,12 @@ pre, code { padding: 0; margin: 0; font-family: 'Source Code Pro', Consolas; }
5656
.banner{
5757
background: linear-gradient(120deg, #14204d 0%, #3cc8f4 100%);
5858
// padding: 20px;
59+
img{
60+
width: 140px;
61+
}
62+
a{
63+
color: white;
64+
}
5965
}
6066

6167
.navbar{

0 commit comments

Comments
 (0)