Skip to content

Commit 0f3920d

Browse files
authored
Merge pull request docker#11552 from thaJeztah/accessibility_fixes
Accessibility fixes
2 parents 2e892aa + 52a4c1f commit 0f3920d

File tree

6 files changed

+33
-38
lines changed

6 files changed

+33
-38
lines changed

_includes/body-landing.html

Lines changed: 15 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -366,11 +366,11 @@ <h2 class="title">Best practices</h2>
366366
<div class="col-xs-12 col-md-6">
367367
<h2 class="title">Develop with Docker</h2>
368368
<p>Learn how to develop language-specific apps using Docker.</p>
369-
<p><a href="https://github.com/docker/labs/tree/master/developer-tools/java/" target="_blank">Docker for Java developers</a></p>
370-
<p><a href="https://github.com/docker/labs/tree/master/developer-tools/nodejs/porting/" target="_blank">Port a node.js app to Docker</a></p>
371-
<p><a href="https://github.com/docker/labs/tree/master/developer-tools/ruby" target="_blank">Ruby on Rails app on Docker</a></p>
369+
<p><a href="https://github.com/docker/labs/tree/master/developer-tools/java/" target="_blank" rel="noopener">Docker for Java developers</a></p>
370+
<p><a href="https://github.com/docker/labs/tree/master/developer-tools/nodejs/porting/" target="_blank" rel="noopener">Port a node.js app to Docker</a></p>
371+
<p><a href="https://github.com/docker/labs/tree/master/developer-tools/ruby" target="_blank" rel="noopener">Ruby on Rails app on Docker</a></p>
372372
<p><a href="/engine/examples/dotnetcore/">Dockerize a .Net Core application</a></p>
373-
<p><a href="/compose/aspnet-mssql-compose/" target="_blank">Dockerize an ASP.NET Core application with SQL Server on Linux</a></p>
373+
<p><a href="/compose/aspnet-mssql-compose/" target="_blank" rel="noopener">Dockerize an ASP.NET Core application with SQL Server on Linux</a></p>
374374
</div>
375375
</div>
376376
</div>
@@ -385,13 +385,13 @@ <h2 class="title">Play with Docker</h2>
385385
</div>
386386
<div class="row">
387387
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
388-
<a href="https://www.docker.com/101-tutorial" class="card" target="_blank">
388+
<a href="https://www.docker.com/101-tutorial" class="card" target="_blank" rel="noopener">
389389
<h5 class="title">Tutorial</h5>
390390
<p>Self-paced tutorials to increase your Docker knowledge.</p>
391391
</a>
392392
</div>
393393
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
394-
<a href="https://labs.play-with-docker.com/" class="card" target="_blank">
394+
<a href="https://labs.play-with-docker.com/" class="card" target="_blank" rel="noopener">
395395
<h5 class="title">Lab Environment</h5>
396396
<p>
397397
Complete a workshop without installing anything using this Docker
@@ -416,13 +416,13 @@ <h2 class="title">Community resources</h2>
416416
</div>
417417
<div class="row">
418418
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
419-
<a href="https://events.docker.com/chapters/" target="_blank" class="card">
419+
<a href="https://events.docker.com/chapters/" class="card" target="_blank" rel="noopener">
420420
<h5 class="title">Find a local meetup</h5>
421421
<p>Attend one of the 200+ Docker Meetups around the globe.</p>
422422
</a>
423423
</div>
424424
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
425-
<a href="https://www.docker.com/events" target="_blank" class="card">
425+
<a href="https://www.docker.com/events" class="card" target="_blank" rel="noopener">
426426
<h5 class="title">Upcoming Events</h5>
427427
<p>
428428
Complete a workshop without installing anything using this Docker
@@ -431,15 +431,15 @@ <h5 class="title">Upcoming Events</h5>
431431
</a>
432432
</div>
433433
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
434-
<a href="https://events.docker.com/docker-virtual-meetups/" class="card" target="_blank">
434+
<a href="https://events.docker.com/docker-virtual-meetups/" class="card" target="_blank" rel="noopener">
435435
<h5 class="title">Tune in Monthly</h5>
436436
<p>
437437
Join the Virtual Docker Meetup Group and online meetups every month.
438438
</p>
439439
</a>
440440
</div>
441441
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
442-
<a href="https://www.docker.com/newsletter-subscription" class="card" target="_blank">
442+
<a href="https://www.docker.com/newsletter-subscription" class="card" target="_blank" rel="noopener">
443443
<h5 class="title">Community news</h5>
444444
<p>
445445
The Docker Weekly is a email newsletter with the latest content on
@@ -448,7 +448,7 @@ <h5 class="title">Community news</h5>
448448
</a>
449449
</div>
450450
<div class="col-xs-12 col-sm-6 col-md-4 card-holder">
451-
<a href="https://www.docker.com/docker-captains" class="card" target="_blank">
451+
<a href="https://www.docker.com/docker-captains" class="card" target="_blank" rel="noopener">
452452
<h5 class="title">Meet the Captains</h5>
453453
<p>
454454
Select members of the community that are both experts in their field
@@ -477,21 +477,13 @@ <h5 class="title">Educational resources</h5>
477477

478478
<script>
479479
window.onChangeHelpTab = function (name) {
480-
const currentActiveTab = document.querySelector(
481-
".help-by-product ul.nav li.active"
482-
);
480+
const currentActiveTab = document.querySelector(".help-by-product ul.nav li.active");
483481
if (currentActiveTab) currentActiveTab.classList.remove("active");
484-
const currentActiveBody = document.querySelector(
485-
".help-by-product div.row.active[data-tab]"
486-
);
482+
const currentActiveBody = document.querySelector(".help-by-product div.row.active[data-tab]");
487483
if (currentActiveBody) currentActiveBody.classList.remove("active");
488-
const nextActiveTab = document.querySelector(
489-
'.help-by-product ul.nav li[data-tab="' + name + '"]'
490-
);
484+
const nextActiveTab = document.querySelector('.help-by-product ul.nav li[data-tab="' + name + '"]');
491485
if (nextActiveTab) nextActiveTab.classList.add("active");
492-
const nextActiveBody = document.querySelector(
493-
'.help-by-product div.row[data-tab="' + name + '"]'
494-
);
486+
const nextActiveBody = document.querySelector('.help-by-product div.row[data-tab="' + name + '"]');
495487
if (nextActiveBody) nextActiveBody.classList.add("active");
496488
};
497489
window.onChangeHelpOs = function (os) {

_includes/landing-page/docker-pricing.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ <h5>
1010
</h5>
1111
</div>
1212
<div class="col-xs-12 col-md-6 col-lg-4 text-center">
13-
<a class="btn" href="https://www.docker.com/pricing" target="_blank" class="card">
13+
<a class="btn" href="https://www.docker.com/pricing" target="_blank" rel="noopener">
1414
Check out the details
1515
</a>
1616
</div>

_includes/landing-page/popular-videos.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,20 +8,20 @@ <h5 class="title">Popular videos</h5>
88
</div>
99
<div class="row">
1010
<div class="col-xs-12 col-md-6 col-lg-12">
11-
<a class="video-item" href="https://youtu.be/iqqDU2crIEQ?t=30" target="_blank">
12-
<img class="video-image" src="/images/video.svg" width="65" height="44" />
11+
<a class="video-item" href="https://youtu.be/iqqDU2crIEQ?t=30" target="_blank" rel="noopener">
12+
<img class="video-image" src="/images/video.svg" alt="video: How to get started with Docker" width="65" height="44" />
1313
<div class="video-title">How to get started with Docker</div>
1414
</a>
1515
</div>
1616
<div class="col-xs-12 col-md-6 col-lg-12">
17-
<a class="video-item" href="https://youtu.be/xmLVNpyJ530?t=30" target="_blank">
18-
<img class="video-image" src="/images/video.svg" width="65" height="44" />
17+
<a class="video-item" href="https://youtu.be/xmLVNpyJ530?t=30" target="_blank" rel="noopener">
18+
<img class="video-image" src="/images/video.svg" alt="video: How to build and test your Docker images in the Cloud" width="65" height="44" />
1919
<div class="video-title">How to build and test your Docker images in the Cloud</div>
2020
</a>
2121
</div>
2222
<div class="col-xs-12 col-md-6 col-lg-12">
23-
<a class="video-item" href="https://youtu.be/QeQ2MH5f_BE?t=31" target="_blank">
24-
<img class="video-image" src="/images/video.svg" width="65" height="44" />
23+
<a class="video-item" href="https://youtu.be/QeQ2MH5f_BE?t=31" target="_blank" rel="noopener">
24+
<img class="video-image" src="/images/video.svg" alt="video: Simplify all the things with Docker Compose" width="65" height="44" />
2525
<div class="video-title">Simplify all the things with Docker Compose</div>
2626
</a>
2727
</div>

_scss/_content.scss

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,10 @@ code {
7272
margin: 0 auto;
7373
width: 70px;
7474
}
75-
h3, p {
75+
h2 {
76+
font-size: 22px;
77+
}
78+
h2, h3, p {
7679
margin: 0;
7780
}
7881
}

_scss/_night-mode.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ body.night {
124124
background: $bg-component-night;
125125
img {
126126
opacity: 1;
127-
filter: grayscale(100%);
127+
filter: grayscale(100%) brightness(2);
128128
}
129129
}
130130
.transparent-btn {

get-docker.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -25,27 +25,27 @@ section and choose the best installation path for you.
2525
<div class="col-sm-12 col-md-12 col-lg-4 block">
2626
<div class="component">
2727
<div class="component-icon">
28-
<a href="/docker-for-mac/install/"><img src="/images/apple_48.svg" alt="Docker Desktop for Mac"></a>
28+
<a href="/docker-for-mac/install/"><img src="/images/apple_48.svg" alt="Docker Desktop for Mac" width="70" height="70"></a>
2929
</div>
30-
<h3 id="docker-for-mac"><a href="/docker-for-mac/install/">Docker Desktop for Mac</a></h3>
30+
<h2 id="docker-for-mac"><a href="/docker-for-mac/install/">Docker Desktop for Mac</a></h2>
3131
<p>A native application using the macOS sandbox security model which delivers all Docker tools to your Mac.</p>
3232
</div>
3333
</div>
3434
<div class="col-sm-12 col-md-12 col-lg-4 block">
3535
<div class="component">
3636
<div class="component-icon">
37-
<a href="/docker-for-windows/install/"><img src="/images/windows_48.svg" alt="Docker Desktop for Windows"></a>
37+
<a href="/docker-for-windows/install/"><img src="/images/windows_48.svg" alt="Docker Desktop for Windows" width="70" height="70"></a>
3838
</div>
39-
<h3 id="docker-for-windows/install/"><a href="/docker-for-windows/install/">Docker Desktop for Windows</a></h3>
39+
<h2 id="docker-for-windows/install/"><a href="/docker-for-windows/install/">Docker Desktop for Windows</a></h2>
4040
<p>A native Windows application which delivers all Docker tools to your Windows computer.</p>
4141
</div>
4242
</div>
4343
<div class="col-sm-12 col-md-12 col-lg-4 block">
4444
<div class="component">
4545
<div class="component-icon">
46-
<a href="/engine/install/"><img src="/images/linux_48.svg" alt="Docker for Linux"></a>
46+
<a href="/engine/install/"><img src="/images/linux_48.svg" alt="Docker for Linux" width="70" height="70"></a>
4747
</div>
48-
<h3 id="docker-for-linux"><a href="/engine/install/">Docker for Linux</a></h3>
48+
<h2 id="docker-for-linux"><a href="/engine/install/">Docker for Linux</a></h2>
4949
<p>Install Docker on a computer which already has a Linux distribution installed.</p>
5050
</div>
5151
</div>

0 commit comments

Comments
 (0)