From 9e1d2da44952ad0aa0c718ae46c736b4d9aec7b7 Mon Sep 17 00:00:00 2001
From: Matt <mtt.lov@gmail.com>
Date: Thu, 19 Aug 2021 14:13:54 -0700
Subject: [PATCH] Fixes #7001: Focus the main content container when the page
 loads

---
 netbox/project-static/dist/netbox-dark.css  | Bin 808043 -> 808185 bytes
 netbox/project-static/dist/netbox-light.css | Bin 502664 -> 502738 bytes
 netbox/project-static/dist/netbox-print.css | Bin 1658782 -> 1659146 bytes
 netbox/project-static/dist/netbox.js        | Bin 316022 -> 316142 bytes
 netbox/project-static/dist/netbox.js.map    | Bin 1131222 -> 1131630 bytes
 netbox/project-static/src/netbox.ts         |  20 +++++++++++++++-----
 netbox/project-static/styles/netbox.scss    |  10 ++++++++--
 netbox/templates/base/layout.html           |   2 +-
 8 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/netbox/project-static/dist/netbox-dark.css b/netbox/project-static/dist/netbox-dark.css
index 0d06bf3e7f4786ab47c60d5950f28a09a46b3ae7..6be4204fc96b1ed6065e6209dd87a5afad579c9f 100644
GIT binary patch
delta 132
zcmaF8!tm!x!-f{d7N!>F7M2#)7Pc1l7LFFq7OocVEj+WBr_cMqrZinZjE80VU1lD^
z$qRpIB6xgOY5B>e#kysg#hFPtsgwJabP<x%jaYc3r?Y)#vw(}qO=p_OsSoGMY@f=)
HbIl(BZqF&3

delta 93
zcmeyl((v^P!-f{d7N!>F7M2#)7Pc1l7LFFq7OocVEj+WBr~m)NW<ULbBoE8<1I#>v
h(~q<8@J==sRzebrXW@~a&N-1&10l9uf|ci?KL7$49)17-

diff --git a/netbox/project-static/dist/netbox-light.css b/netbox/project-static/dist/netbox-light.css
index a5ffc8a336249adc1069af52eaaa4c210843e141..e321f1d509393ce26be5bae536c48c49da27ecfd 100644
GIT binary patch
delta 91
zcmeCUE_dm=Ttf?E3sVbo3rh=Y3)>d<qb1YzOV~x(t<v(7ON({D90>?Vw=A<bGbtyv
oI={3eCo?bA%3!))3A@;I$x?Rd$(%7_(;t<vD{a>;Wsf!k0MPIsLjV8(

delta 48
zcmca~U9RK0Ttf?E3sVbo3rh=Y3)>d<qa~A>Vq~X>ma;2Ne^|mUI$fodU3z<6DSL<+
E0Kdc$6951J

diff --git a/netbox/project-static/dist/netbox-print.css b/netbox/project-static/dist/netbox-print.css
index 9ed8db851a59c4f00dfdfc3a925fab6af0618a7a..4bfbe2c3138cd41e91cce084ad5c224c896c8efd 100644
GIT binary patch
delta 227
zcmbO?KecO7YC{WS3sVbo3rh=Y3tJ0&3r7oQ3s(zw3r`Dg3ttO=i$IHDi%^Sji%5%T
zi&%^J775jLll2wYrmtTwA<Ax*mY-Z&tTWwVorDyWqdPq@SWs)aLXiZ^bl<fSg3}%6
zGioBZ$f{H(Z{T5{uCPHubh@A*6HpJ3#RoA`w=A<bGbtx^@_BPPuvOFluaj6c`F=M0
s^acw?uIY2?CHSYiu9Mg`{lIKt*~tNdY;Y^Qr=M9T!L{9CgGAhX05Wq;&Hw-a

delta 118
zcmV-+0Ez#KqGg_+Wq^bMgaU*Egam{Iga(8Mgb0KQgbIWUgbaiYgbsucgb;)ggc5`k
zgcO7ogcgJsv=}9>m+)8%2bX|20ScF#e;5y!m#-KVmoTvye3v?~3lx_tt{4@U@UIvt
Ymmu313YXun7<ZR2{R0NK8?hMgpIA03j{pDw

diff --git a/netbox/project-static/dist/netbox.js b/netbox/project-static/dist/netbox.js
index 316cf614c967a5a8b306d4e65cbea70a77ff3870..ced24d759d213ced371745a772409e27605c079c 100644
GIT binary patch
delta 1017
zcmXBTX-u3&7zgnD-+kZZSQaT)IcizAl%u{-sEW08YjG*p-n(?6D5bbZ_hJ{=qa0!^
zrKJ+twmv3ATT>HC@PpPi^I=Ka;?XpI&={ks#v?{!{3KDUv6yJoS@<;hKQoz`=a-rL
zR|<YvD!5i6;W#Um%8;E1%87Wb?!aV%-p?r}hq3|BvKi$Qz#&@Ah+%*p$?S)NE@a-q
z39@7b(M>n9Y#1YTwi^~Unymv`=$gs|J^ianz)10&^JryC^(@fIlDTI9GZp2%2rFIA
z3&KvSEiMEovgJ*5P)U9iBlJ?f7M1i){&#qak_B^Uqte0vCTONmiypRI*s6e&t!=Fr
zaD>Xs>T#I5%07gF^2;M=r|I$#dg<5lN!VC$n-=Jz<bz+MkNLN^0%5vZaS47hXqGX`
z{?L>I5%z#~5vr(JHhI&no4jPrETRK{=F;~&tQcgCl@1_8r+4<lML+H|AWplh{)3lx
zSKox2)~b)f#|$+RFwAVVN??ff?s`U$j+^B^FP)q#qEF;WDPfj9?v3QCdj;d{ueu_E
zd*(KbanIR?&$wh?V?UQ%X<UJYM)nxd!dCYbE4bv{$5yyxvPp|py596EOw923c1WFO
zS--I*JGJ*D5F}~e70Jx|*gWU<zR$VxLi0J;S@r(?kOF48XLJ3OP8OvOvuxOmw_Cn|
zG-8%*n~~{#0=M7R7DO96+ZKX2VV3=L!C6eX9mn9LNXJDSVXDqdaQwoqFVW7{y6k|B
zo;12R_@Xh+!Anj3g5a^znB`@}NM%iO{nxC+@H3U|u7FYc!EuJ``?{k*l)gQDom(fJ
zcSJE{m7VF+*wE8ClIXI^y&H*+sYH0$W%ptR+)N+(M#<ePqHn3u%|3o%0^F{B+9c`i
z^2Bf&nq8f~1uhnvNy0>b&n!!wcG)wuF?I9wqY|v_-rPljzrp$WFaqqKc_%Q!9OoiA
zVkjW{=-^Td%eXX<A-V$c5Ko2d`NdTr&U8yZXNcZ_oZv-0i@g2DR(_$pJH;B&7m&v{
zibFq@sgPi2e``wrop<leV}O}{zoCGGW!+Z*Cr+u?XVvRSsn><^M)ag+YZQA0w5Q(N
zr8rtCcmlH;iz215h*Qt0yz#Ir=8uFmKI6itA1EpwuF=-JBH@@P9IH!@gZ{8*R9o8|
sdq}4X$3vm2s#v`@;)+LWYNr;?mx!g=p~#?HEBlPK&8gQv62DUZ4+uG1X8-^I

delta 945
zcmXBTU2Kz87zgnD-@b3Vt?L|HH`qE^Q-=fc0vqB)Wa#J^V{PAlK{uyk%y!+@k99Cw
z_8~^bpt!gqJS0RRK{J+lp$K^{x(G}SA>I%#G-#s6XpC1bDjJ!IMm_5;|Iax&&v|}1
z=a<>ihgVCluTc=^3Z)VSeNi=)+|amdJVl=rmXlv!hZIlhp9V&0!Eh9N=!v{8bkn)K
z+whY+KZ;{?GvAB-WGV<@gpU+70&co)bfJm<HKt&vWZ@fdvfh*iT%0L74MeG|_%&#B
zr8o)?8CM12qr|Fr5ur6D!)T?~OKdnyAC!ED8p@PTVK-HnBWR&XvkhZBXKvP^oflVc
zmJlFI<z_rjZIz$m0F_u0aL|M$hQ0KwWgHzGt+D}L$~^it+IV1XGjNoyRbR#+IjnOS
z;6JPu;0Qlrn}IQ*sjl$y=&mq%^2%t}pGEZjV;&51eT^UJp;PO+5ThU0IS`~RkN<}x
zZK=J5FfG;|M2H>h6`-HJ8}z^scWiu7QsSE08Kx6cW%QXkuJmbYZzz|7n=arb{%cd2
zBs`1iMuca&?sFm8S>Gij=j-P&LWj3H;pT;{<vJmG|H*kFnQ5@WNjDnaL^C^{S_{Rc
zsrKBFd~*8<U>_+vt}0P6$4Z|&JH8Og7oRx`57+M83B{+W?JN6_H>$D{(NxDuywmh0
zlvYjku0*!?OTxaYC5qjArX>csMN<dpT%eqaS`VR}60MgIVB@|#2z+zfS8(uRn-A!q
zXPrR-KI2RZ@CsL#Bz0;u;y#aFGI}yX|1HlD2HEJnFJXXw@Shg?{riW31butphOo{A
z?#gnHM-41@<M<1OiX8K(9l1n@j53mZB{X9|nC-D|^uoP*_&pPj@x52aAnf)|xRfTJ
zIySTn&DSPwLx{yDGiav2C+8HGPwkE8mTsNera<EdQ<o(12B)V7;p2a%13)YL&n61x
zo`~8{&&@Wm;c~Y@jz!eCNM?RzW&sFt<Lu7{IT=w?qG;#D`){un7b?D6Zk0n3bu?Fu
z|5Ry2AD{WHVfpWT^k5o$*!BBO9lAOHp$_n$G%ck~OURm*q|theWz*|*+a)-%A8*th
dtdTl>X{%e8wYufwFJG*BM^~NQc2E9L|3CKKLN5RS

diff --git a/netbox/project-static/dist/netbox.js.map b/netbox/project-static/dist/netbox.js.map
index 73d4983534b10d151b81f31a34f4528ca7e341ed..f3770e46262d595bc873f9e76f01cbc6d9b156c5 100644
GIT binary patch
delta 437
zcmccC>iVw3wV{Qvg{g(Pg{6hHg{_6Xg`<VDg{y^o3s2Q;4wwAo(%jU%lIewWxP-S)
zxXokBIDOqNE?$-J%)FHRat%#|>X<wQh2;Fa;t~*90#xe^q!KgpQj4Yse&Uj}vGEA;
z^>NKf1sP+fp{@s2r3<3L%G5QjL1tv8DQIArU?0OJn&<{}M6p6iMk>q(Fb&qLkd|Mh
zkeHmDT3no&l#{BEmspmWo>-EZpQi^h6YMe+H|eE;4AX#ESsRlFL@{~OADZ$g2xR7E
zmO#7(k_C$9v9L=_e|m>U0v-(0?(#UpIqhzDd4QM~i1~n+f4kdVfww8_<xV=zj?N|1
zt(*j7T@xK0i^2Q?CmnZ3M_&+;>!cIx=oqY%?C5CZq*LtV=xpwy<LKz<spIMBSm>nV
j>*!kMq~q%7nCYYw=;&GGG(Av4P=whv!+H8NCqV}Q;!l`4

delta 107
zcmaFY;d-srwV{Qvg{g(Pg{6hHg{_6Xg`<VDg{y^o3s2SU=|wp_V%w+Q=CNg*{_if2
z0kdOH&UCYTJkB6Sd*eMGAm#;PJ|O1b-gr;oZ3=s?la8~abJq0#>Vn$S7dQ(VP1ko3
Gv<CpVqA4!`

diff --git a/netbox/project-static/src/netbox.ts b/netbox/project-static/src/netbox.ts
index 6b887a1bc..0b61fc8e3 100644
--- a/netbox/project-static/src/netbox.ts
+++ b/netbox/project-static/src/netbox.ts
@@ -13,7 +13,7 @@ import { initSideNav } from './sidenav';
 import { initRackElevation } from './racks';
 import { initLinks } from './links';
 
-function initAll() {
+function initDocument() {
   for (const init of [
     initBootstrap,
     initColorMode,
@@ -34,8 +34,18 @@ function initAll() {
   }
 }
 
-if (document.readyState !== 'loading') {
-  initAll();
-} else {
-  document.addEventListener('DOMContentLoaded', initAll);
+function initWindow() {
+  const contentContainer = document.querySelector<HTMLElement>('.content-container');
+  if (contentContainer !== null) {
+    // Focus the content container for accessible navigation.
+    contentContainer.focus();
+  }
+}
+
+window.addEventListener('load', initWindow);
+
+if (document.readyState !== 'loading') {
+  initDocument();
+} else {
+  document.addEventListener('DOMContentLoaded', initDocument);
 }
diff --git a/netbox/project-static/styles/netbox.scss b/netbox/project-static/styles/netbox.scss
index 95d45b02b..8f0f174c1 100644
--- a/netbox/project-static/styles/netbox.scss
+++ b/netbox/project-static/styles/netbox.scss
@@ -529,14 +529,20 @@ div.content-container {
   overflow-x: hidden;
   overflow-y: auto;
 
-  @include media-breakpoint-down(lg) {
-    width: 100%;
+  // Don't show an outline when the content container is focused.
+  &:focus,
+  &:focus-visible {
+    outline: 0;
   }
 
   div.content {
     flex: 1;
   }
 
+  @include media-breakpoint-down(lg) {
+    width: 100%;
+  }
+
   // Make the content full-width when printing.
   @media print {
     width: 100% !important;
diff --git a/netbox/templates/base/layout.html b/netbox/templates/base/layout.html
index fbadf595d..c5923b468 100644
--- a/netbox/templates/base/layout.html
+++ b/netbox/templates/base/layout.html
@@ -13,7 +13,7 @@
     {% include 'base/sidenav.html' %}
 
       {# Body #}
-      <div class="content-container">
+      <div class="content-container" tabindex="-2">
 
         {# Netbox Logo, only visible when printing #}
         <div class="p-2 printonly">