Date converter form

src/Header.css

@@ -24,3 +24,11 @@
   text-shadow: -1.5px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black,
     1px 1px 0 black;
 }
+
+#navbar-container {
+  width: 100%;
+}
+
+#menu-lines {
+  padding: 0 40px;
+}

src/Header.tsx

@@ -4,7 +4,6 @@ import { LinkContainer } from 'react-router-bootstrap'
 import _ from 'lodash'
 
 import User from './auth/User'
-
 import './Header.css'
 import lmuLogo from './LMU_Logo.svg'
 import ExternalLink from 'common/ExternalLink'
@@ -55,24 +54,38 @@ export default function Header(): JSX.Element {
               <EblLogo />
             </Navbar.Brand>
           </LinkContainer>
+          <Navbar.Toggle aria-controls={id} />
           <Navbar.Collapse id={id}>
-            <Nav
-              activeKey={activeKey}
-              onSelect={(key) => setActiveKey(key ?? undefined)}
-              className="mx-auto"
+            <div
+              id="navbar-container"
+              className="d-flex justify-content-between"
             >
-              <NavItem href="/about" title="About" />
-              <NavItem href="/signs" title="Signs" />
-              <NavItem href="/dictionary" title="Dictionary" />
-              <NavItem href="/corpus" title="Corpus" />
-              <NavItem href="/fragmentarium" title="Fragmentarium" />
-              <NavItem href="/bibliography" title="Bibliography" />
-            </Nav>
-            <Navbar.Text>
-              <User />
-            </Navbar.Text>
+              <div id="menu-lines">
+                <Nav
+                  activeKey={activeKey}
+                  onSelect={(key) => setActiveKey(key ?? undefined)}
+                  className="mx-auto"
+                >
+                  <NavItem href="/signs" title="Signs" />
+                  <NavItem href="/dictionary" title="Dictionary" />
+                  <NavItem href="/corpus" title="Corpus" />
+                  <NavItem href="/fragmentarium" title="Fragmentarium" />
+                </Nav>
+                <Nav
+                  activeKey={activeKey}
+                  onSelect={(key) => setActiveKey(key ?? undefined)}
+                  className="mx-auto"
+                >
+                  <NavItem href="/about" title="About" />
+                  <NavItem href="/bibliography" title="Bibliography" />
+                  <NavItem href="/tools" title="Tools" />
+                </Nav>
+              </div>
+              <Navbar.Text id="user">
+                <User />
+              </Navbar.Text>
+            </div>
           </Navbar.Collapse>
-          <Navbar.Toggle aria-controls={id} />
         </Container>
       </Navbar>
     </header>

src/about/ui/__snapshots__/about.test.tsx.snap

@@ -121,17 +121,6 @@ exports[`Snapshot 1`] = `
         >
           Bibliography
         </a>
-        <a
-          aria-controls="about-tabpane-list-of-kings"
-          aria-selected="false"
-          class="nav-item nav-link"
-          data-rb-event-key="list-of-kings"
-          href="#"
-          id="about-tab-list-of-kings"
-          role="tab"
-        >
-          List of kings
-        </a>
       </nav>
       <div
         class="tab-content"

src/about/ui/about.sass

@@ -1,96 +1,94 @@
-[id^="about-tabpane-"].tab-pane
+[id^="about-tabpane-"], [id^="tools-tabpane-"]
+  &.tab-pane
     padding-top: 30px
 
-.tab-content:has([id^="about-tabpane-"])
+  .tab-content:has(&)
     text-align: justify
     padding: 0em 4em
 
-[id^="about-tabpane-"] .type-abbreviation
-  display: none
+  .type-abbreviation
+    display: none
 
-[id^="about-tabpane-"] h3
-  padding-top: 10px
-  clear: left
+  h3
+    padding-top: 10px
+    clear: left
 
-[id^="about-tabpane-"] h4
-  padding-top: 10px
+  h4
+    padding-top: 10px
 
-[id^="about-tabpane-"] blockquote
-  padding-left: 40%
+  blockquote
+    padding-left: 40%
 
-[id^="about-tabpane-"] .Introduction
+  .Introduction
+    &__200px
+      width: 200px
+      height: auto
 
-  &__200px
-    width: 200px
-    height: auto
+    &__250px
+      width: 250px
+      height: auto
 
-  &__250px
-    width: 250px
-    height: auto
+    &__300px
+      width: 300px
+      height: auto
 
-  &__300px
-    width: 300px
-    height: auto
+    &__350px
+      width: 350px
+      height: auto
 
-  &__350px
-    width: 350px
-    height: auto
+    &__400px
+      width: 400px
+      height: auto
 
-  &__400px
-    width: 400px
-    height: auto
+    &__450px
+      width: 450px
+      height: auto
 
-  &__450px
-    width: 450px
-    height: auto
+    &__caption
+      font-size: 80%
+      padding-top: 0.5em
+      text-align: center
 
-  &__caption
-    font-size: 80%
-    padding-top: 0.5em
-    text-align: center
+    &__cite
+      border: 1px solid black
+      display: block
+      margin: 10px auto
+      width: 70%
+      padding: 10px
+      text-align: center
 
-  &__cite
-    border: 1px solid black
-    display: block
-    margin: 10px auto
-    width: 70%
-    padding: 10px
-    text-align: center
+    &__creativecommons
+      border-width: 0
+      margin: auto
+      display: block
+      padding: 10px
 
-  &__creativecommons
-    border-width: 0
-    margin: auto
-    display: block
-    padding: 10px
+    &__creativeCommonsLicense
+      text-align: center
 
-  &__creativeCommonsLicense
-    text-align: center
+    &__fossey
+      float: right
+      width: 300px
+      height: auto
+      padding: 1em 0em 1em 1em
 
-  &__fossey
-    float: right
-    width: 300px
-    height: auto
-    padding: 1em 0em 1em 1em
+    &__meszlColoredChanges
+      color: #00610F
 
-  &__meszlColoredChanges
-    color: #00610F
+    &__photoCentered, &__photoLeft, &__photoRight
+      text-align: center
 
-  &__photoCentered
-    text-align: center
+    &__photoLeft, &__photoRight
+      float: left
+      margin: 0em 0.5em 0em 0em
 
-  &__photoLeft
-    text-align: center
-    float: left
-    margin: 0em 0.5em 0em 0em
+    &__photoRight
+      float: right
+      margin: 0em 0em 0.5em 0.5em
 
-  &__photoRight
-    text-align: center
-    float: right
-    margin: 0em 0em 0.5em 0.5em
+    &__quotation
+      display: block
+      padding: 0 0 1em 1em
 
-  &__quotation
-    display: block
-    padding: 0 0 1em 1em
-
-  &__secondLineOfParallelism
-    padding-left: 1em
+    &__secondLineOfParallelism
+      padding-left: 1em

src/about/ui/about.tsx

@@ -11,7 +11,6 @@ import AboutCorpus from 'about/ui/corpus'
 import AboutSigns from 'about/ui/signs'
 import AboutDictionary from 'about/ui/dictionary'
 import AboutBibliography from 'about/ui/bibliography'
-import AboutListOfKings from 'about/ui/chronology'
 import _ from 'lodash'
 
 export const tabIds = [
@@ -44,7 +43,7 @@ export default function About({
       title="About"
       crumbs={[
         new TextCrumb('About'),
-        new TextCrumb(_.capitalize(selectedTab).replaceAll('-', ' ')),
+        new TextCrumb(_.capitalize(selectedTab)),
       ]}
     >
       <Tabs
@@ -72,9 +71,6 @@ export default function About({
         <Tab eventKey="bibliography" title="Bibliography">
           {AboutBibliography(markupService)}
         </Tab>
-        <Tab eventKey="list-of-kings" title="List of kings">
-          {AboutListOfKings()}
-        </Tab>
       </Tabs>
     </AppContent>
   )

src/afo-register/ui/AfoRegisterSearchPage.tsx

@@ -25,7 +25,7 @@ function AfoRegisterIntroduction(): JSX.Element {
     <Markdown
       className="AfoRegister__introduction"
       text="The [AfO-Register](https://orientalistik.univie.ac.at/publikationen/afo/register/) (Archiv für Orientforschung: Register Assyriologie), 
-      curated by the Department of Near Eastern Studies of the University of Vienna, is an essential bibliographic bibliographic tool for Ancient Near. 
+      curated by the Department of Near Eastern Studies of the University of Vienna, is an essential bibliographic tool for Ancient Near 
       Eastern Studies. Starting with Volume 25 (1974–1977), it has published comprehensive bibliographies of new Assyriological literature and an
       index in most volumes, categorized by subject areas, Akkadian and Sumerian words, and texts and passages. With the kind permission of the AfO
       Redaktion, the Register has been digitized and made searchable by the eBL team, thus enhancing its accessibility for researchers,