アイヌ語追加 (#428) (#433)

Reviewed-on: #433
Co-authored-by: miteruzo <miteruzo@naver.com>

frontend/src/index.css

@@ -4,6 +4,45 @@
 @tailwind components;
 @tailwind utilities;
 
+.ainu-ui-text
+{
+  white-space: normal !important;
+  word-break: keep-all !important;
+  overflow-wrap: normal !important;
+}
+
+.ainu-ui-word
+{
+  display: inline-block;
+  white-space: nowrap !important;
+  word-break: keep-all !important;
+  overflow-wrap: normal !important;
+}
+
+.ainu-ui-label .ainu-ui-text
+{
+  white-space: nowrap !important;
+}
+
+.ainu-ui-label wbr
+{
+  display: none;
+}
+
+.localised-document
+{
+  min-width: 0;
+  max-width: 100%;
+  overflow-x: auto;
+}
+
+.localised-document a:lang(ain)
+{
+  white-space: nowrap;
+  word-break: keep-all;
+  overflow-wrap: normal;
+}
+
 @layer base
 {
   :root
@@ -208,6 +247,12 @@ body
   column-gap: 4px;
 }
 
+.top-nav-account
+{
+  flex-shrink: 0;
+  width: max-content;
+}
+
 .top-nav-layout .top-nav-brand-link
 {
   margin-inline: 4px;
@@ -216,6 +261,7 @@ body
 
 .top-nav-desktop-menu,
 .top-nav-desktop-submenu,
+.top-nav-layout .top-nav-account,
 .top-nav-user-desktop
 {
   display: none;
@@ -226,6 +272,39 @@ body
   font-size: .875rem;
 }
 
+.top-nav-separator-vertical
+{
+  display: inline-flex;
+}
+
+.top-nav-separator-horizontal
+{
+  display: none;
+}
+
+.top-nav-mobile-menu .top-nav-separator-vertical
+{
+  display: none;
+}
+
+.top-nav-mobile-menu .top-nav-separator-horizontal
+{
+  display: block;
+}
+
+.top-nav-more-menu
+{
+  display: grid;
+  grid-template-columns: fit-content(35%) minmax(0, 1fr);
+  align-items: center;
+}
+
+.top-nav-desktop-submenu .top-nav-menu-link
+{
+  white-space: normal;
+  overflow-wrap: normal;
+}
+
 .top-nav-desktop-menu .top-nav-menu-link
 {
   padding-inline: 8px;
@@ -242,24 +321,67 @@ body
   overflow-wrap: anywhere;
 }
 
+.top-nav-account .top-nav-user-desktop
+{
+  min-width: 0;
+  max-width: 24vw;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.top-nav-locale-name
+{
+  display: none;
+}
+
 @media (min-width: 768px)
 {
+  .top-nav-layout[data-measuring] .top-nav-primary,
+  .top-nav-layout[data-measuring] .top-nav-desktop-menu,
+  .top-nav-layout[data-measuring] .top-nav-account
+  {
+    flex: 0 0 auto;
+    width: max-content;
+    max-width: none;
+  }
+
+  .top-nav-layout:not([data-desktop]) .top-nav-locale-name,
+  .top-nav-layout[data-desktop='true'] .top-nav-locale-name,
+  .top-nav-layout[data-measuring] .top-nav-locale-name
+  {
+    display: inline;
+  }
+
+  .top-nav-layout:not([data-desktop]) .top-nav-account .top-nav-user-desktop,
+  .top-nav-layout[data-desktop='true'] .top-nav-account .top-nav-user-desktop,
+  .top-nav-layout[data-measuring] .top-nav-account .top-nav-user-desktop
+  {
+    max-width: none;
+  }
+
   .top-nav-layout .top-nav-brand-link
   {
     font-size: 1.125rem;
   }
 
+  .top-nav-layout:not([data-desktop]) .top-nav-root,
   .top-nav-layout[data-desktop='true'] .top-nav-root
   {
     background: var(--top-nav-root-bg-desktop);
   }
 
+  .top-nav-layout:not([data-desktop]) .top-nav-desktop-menu,
+  .top-nav-layout:not([data-desktop]) .top-nav-account,
   .top-nav-layout[data-desktop='true'] .top-nav-desktop-menu,
-  .top-nav-layout[data-measuring] .top-nav-desktop-menu
+  .top-nav-layout[data-measuring] .top-nav-desktop-menu,
+  .top-nav-layout[data-desktop='true'] .top-nav-account,
+  .top-nav-layout[data-measuring] .top-nav-account
   {
     display: flex;
   }
 
+  .top-nav-layout:not([data-desktop]) .top-nav-user-desktop,
+  .top-nav-layout:not([data-desktop]) .top-nav-desktop-submenu,
   .top-nav-layout[data-desktop='true'] .top-nav-user-desktop,
   .top-nav-layout[data-measuring] .top-nav-user-desktop,
   .top-nav-layout[data-desktop='true'] .top-nav-desktop-submenu
@@ -267,8 +389,13 @@ body
     display: block;
   }
 
+  .top-nav-layout:not([data-desktop]) .top-nav-mobile-controls,
+  .top-nav-layout:not([data-desktop]) .top-nav-mobile-menu,
+  .top-nav-layout:not([data-desktop]) .top-nav-user-mobile,
   .top-nav-layout[data-desktop='true'] .top-nav-mobile-toggle,
   .top-nav-layout[data-measuring] .top-nav-mobile-toggle,
+  .top-nav-layout[data-desktop='true'] .top-nav-mobile-controls,
+  .top-nav-layout[data-measuring] .top-nav-mobile-controls,
   .top-nav-layout[data-desktop='true'] .top-nav-mobile-menu,
   .top-nav-layout[data-desktop='true'] .top-nav-user-mobile
   {