Skip to content

Commit

Permalink
accessibility features for links and brand logos
Browse files Browse the repository at this point in the history
  • Loading branch information
@davidtmiller
davidtmiller committed Mar 22, 2022
1 parent 5d6e817 commit 51bec33
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 20 deletions.
8 changes: 4 additions & 4 deletions dist/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -291,16 +291,16 @@ <h4>Larry Parker</h4>
<div class="container">
<div class="row align-items-center">
<div class="col-md-3 col-sm-6 my-3">
<a href="#!" aria-label="Microsoft"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/microsoft.svg" alt="..." /></a>
<a href="#!"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/microsoft.svg" alt="..." aria-label="Microsoft Logo" /></a>
</div>
<div class="col-md-3 col-sm-6 my-3">
<a href="#!" aria-label="Google"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/google.svg" alt="..." /></a>
<a href="#!"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/google.svg" alt="..." aria-label="Google Logo" /></a>
</div>
<div class="col-md-3 col-sm-6 my-3">
<a href="#!" aria-label="Facebook"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/facebook.svg" alt="..." /></a>
<a href="#!"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/facebook.svg" alt="..." aria-label="Facebook Logo" /></a>
</div>
<div class="col-md-3 col-sm-6 my-3">
<a href="#!" aria-label="IBM"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/ibm.svg" alt="..." /></a>
<a href="#!"><img class="img-fluid img-brand d-block mx-auto" src="assets/img/logos/ibm.svg" alt="..." aria-label="IBM Logo" /></a>
</div>
</div>
</div>
Expand Down
32 changes: 16 additions & 16 deletions src/pug/index.pug
View file
Original file line number Diff line number Diff line change
Expand Up @@ -223,33 +223,33 @@ html(lang='en')
img.mx-auto.rounded-circle(src='assets/img/team/1.jpg', alt='...')
h4 Parveen Anand
p.text-muted Lead Designer
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Parveen Anand Twitter Profile')
i.fab.fa-twitter
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Parveen Anand Facebook Profile')
i.fab.fa-facebook-f
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Parveen Anand LinkedIn Profile')
i.fab.fa-linkedin-in
.col-lg-4
.team-member
img.mx-auto.rounded-circle(src='assets/img/team/2.jpg', alt='...')
h4 Diana Petersen
p.text-muted Lead Marketer
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Diana Petersen Twitter Profile')
i.fab.fa-twitter
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Diana Petersen Facebook Profile')
i.fab.fa-facebook-f
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Diana Petersen LinkedIn Profile')
i.fab.fa-linkedin-in
.col-lg-4
.team-member
img.mx-auto.rounded-circle(src='assets/img/team/3.jpg', alt='...')
h4 Larry Parker
p.text-muted Lead Developer
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Larry Parker Twitter Profile')
i.fab.fa-twitter
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Larry Parker Facebook Profile')
i.fab.fa-facebook-f
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Larry Parker LinkedIn Profile')
i.fab.fa-linkedin-in
.row
.col-lg-8.mx-auto.text-center
Expand All @@ -262,16 +262,16 @@ html(lang='en')
.row.align-items-center
.col-md-3.col-sm-6.my-3
a(href='#!')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/microsoft.svg', alt='...')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/microsoft.svg', alt='...', aria-label='Microsoft Logo')
.col-md-3.col-sm-6.my-3
a(href='#!')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/google.svg', alt='...')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/google.svg', alt='...', aria-label='Google Logo')
.col-md-3.col-sm-6.my-3
a(href='#!')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/facebook.svg', alt='...')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/facebook.svg', alt='...', aria-label='Facebook Logo')
.col-md-3.col-sm-6.my-3
a(href='#!')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/ibm.svg', alt='...')
img.img-fluid.img-brand.d-block.mx-auto(src='assets/img/logos/ibm.svg', alt='...', aria-label='IBM Logo')

// Contact
section#contact.page-section
Expand Down Expand Up @@ -369,11 +369,11 @@ html(lang='en')
.col-lg-4.text-lg-start
| Copyright &copy; Your Website 2022
.col-lg-4.my-3.my-lg-0
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Twitter')
i.fab.fa-twitter
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='Facebook')
i.fab.fa-facebook-f
a.btn.btn-dark.btn-social.mx-2(href='#!')
a.btn.btn-dark.btn-social.mx-2(href='#!', aria-label='LinkedIn')
i.fab.fa-linkedin-in
.col-lg-4.text-lg-end
a.link-dark.text-decoration-none.me-3(href='#!') Privacy Policy
Expand Down

0 comments on commit 51bec33

Please sign in to comment.