diff options
Diffstat (limited to 'website')
| -rw-r--r-- | website/resources/css/custom.css | 7 | ||||
| -rw-r--r-- | website/resources/img/video.png | bin | 0 -> 153086 bytes | |||
| -rw-r--r-- | website/resources/js/main.js | 16 | ||||
| -rw-r--r-- | website/templates/_scaffold.html | 16 | ||||
| -rw-r--r-- | website/templates/index.html | 2 |
5 files changed, 20 insertions, 21 deletions
diff --git a/website/resources/css/custom.css b/website/resources/css/custom.css index 5e28b7cf..0ff84b78 100644 --- a/website/resources/css/custom.css +++ b/website/resources/css/custom.css @@ -50,12 +50,9 @@ } #clickForVideo { - padding: 20px 30px; - background-color: #DDD; cursor: pointer; margin-left: auto; margin-right: auto; - margin-bottom: 40px; } pre { @@ -503,3 +500,7 @@ body { text-align: start; font-size: 17px; } + +a:not([role=button]):focus { + outline-offset: 2px; +}
\ No newline at end of file diff --git a/website/resources/img/video.png b/website/resources/img/video.png Binary files differnew file mode 100644 index 00000000..7e70d021 --- /dev/null +++ b/website/resources/img/video.png diff --git a/website/resources/js/main.js b/website/resources/js/main.js index cbda59b9..eaf5e188 100644 --- a/website/resources/js/main.js +++ b/website/resources/js/main.js @@ -1,14 +1,6 @@ "use strict"; (function($) { - function clickToTap() { - if (matchMedia && matchMedia('(hover: none)').matches) $(".clickToTap").each(function() { - var x = $(this); - if (x.text() === "Click") x.text("Tap"); - else x.text("tap"); - }); - } - function clickForVideo() { var cfv = $("#clickForVideo"); var f = function() { @@ -41,7 +33,13 @@ video.currentTime = (((h * 60) + m) * 60) + s; } - $(clickToTap); + function aButtonsRespondToSpacebar() { + $('a[role="button"]').keyup(function(e) { + if (e.which == 32) e.target.click(); + }); + } + $(clickForVideo); $(seekVideo); + $(aButtonsRespondToSpacebar); })($); diff --git a/website/templates/_scaffold.html b/website/templates/_scaffold.html index a4da42ee..e9924c4e 100644 --- a/website/templates/_scaffold.html +++ b/website/templates/_scaffold.html @@ -74,7 +74,7 @@ ga('send', 'pageview'); <div class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> - <a href="/" class="navbar-brand">Project Lombok</a> + <a href="/" class="navbar-brand" role="button">Project Lombok</a> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main" aria-label="Open Menu"> <span class="icon-bar"></span> <span class="icon-bar"></span> @@ -84,14 +84,14 @@ ga('send', 'pageview'); <div class="navbar-collapse collapse" id="navbar-main"> <ul class="nav navbar-nav"> <li class="dropdown"> - <a class="dropdown-toggle pointer" data-toggle="dropdown" href="#">Features<span class="caret"></span></a> + <a class="dropdown-toggle pointer" data-toggle="dropdown" href="#" role="button">Features<span class="caret"></span></a> <ul class="dropdown-menu" aria-labelledby="themes"> <li><a href="/features/all">Stable</a></li> <li><a href="/features/experimental/all">Experimental</a></li> </ul> </li> <li class="dropdown"> - <a class="dropdown-toggle pointer" data-toggle="dropdown" href="#">Community<span class="caret"></span></a> + <a class="dropdown-toggle pointer" data-toggle="dropdown" href="#" role="button">Community<span class="caret"></span></a> <ul class="dropdown-menu" aria-labelledby="themes"> <li><a href="https://groups.google.com/group/project-lombok">Discuss / Help</a></li> <li><a href="https://github.com/projectlombok/lombok/issues">Issues</a></li> @@ -100,24 +100,24 @@ ga('send', 'pageview'); </ul> </li> <li> - <a href="/order-license-info"> + <a href="/order-license-info" role="button"> <span>Order / Donate</span> </a> </li> <li class="dropdown"> - <a href="/setup/overview" class="smallOnly"><span>How to use</span></a> - <a class="dropdown-toggle pointer wideOnly" data-toggle="dropdown" href="#">Install<span class="caret"></span></a> + <a href="/setup/overview" class="smallOnly" role="button"><span>How to use</span></a> + <a class="dropdown-toggle pointer wideOnly" data-toggle="dropdown" href="#" role="button">Install<span class="caret"></span></a> <ul class="dropdown-menu" aria-labelledby="themes"> <#list setupTargets as cat, tgtList> <li class="header">${cat}</li> <#list tgtList as name, url> - <li class="target"><a href="/setup/${url}">${name}</a></li> + <li class="target"><a href="/setup/${url}" role="button">${name}</a></li> </#list> <#sep><li class="divider"></li></#sep> </#list> </ul> </li> - <li><a href="/download">Download</a></li> + <li><a href="/download" role="button">Download</a></li> </ul> </div> </div> diff --git a/website/templates/index.html b/website/templates/index.html index bb868517..85531701 100644 --- a/website/templates/index.html +++ b/website/templates/index.html @@ -10,7 +10,7 @@ </p> </div> <div class="video text-center"> - <div id="clickForVideo"><span class="clickToTap">Click</span> to watch a 4 minute demo to learn more.</div> + <a id="clickForVideo" href="#" role="button" aria-label="Watch Video"><img width="800" height="200" src="/img/video.png" alt="Watch video"></a> <video id="demoVideo" hidden="hidden" width="800" height="480" poster="/img/poster.png" controls="controls" preload="none"> <source src="https://projectlombok.org/videos/lombok.mp4" type="video/mp4" /> <@main.h1 title="Can't watch the video?" /> |
