style: footer menu

razonyang · Jan 29, 2023 · b601eb9 · b601eb9
1 parent f230f2d
commit b601eb9
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/assets/main/scss/_footer.scss b/assets/main/scss/_footer.scss
@@ -2,4 +2,8 @@
     .social-link {
         font-size: 1.5em;
     }
+
+    .nav-link {
+        text-overflow: ellipsis;
+    }
 }
diff --git a/layouts/partials/footer/menu.html b/layouts/partials/footer/menu.html
@@ -5,21 +5,21 @@
   <li class="nav-item col-12 col-md-6 col-lg-3 px-0">
     {{- if .HasChildren -}}
     <ul class="nav flex-column align-items-start">
-      <li class="nav-item">
+      <li class="nav-item w-100">
       {{- template "footer-menu-item" (dict "item" . "class" "nav-link fw-bold fs-lg") -}}
       </li>
       {{- range .Children -}}
         {{- if .Params.divider -}}
         <li><hr class="dropdown-divider"></li>
         {{- else -}}
-        <li class="nav-item">
+        <li class="nav-item w-100">
           {{- template "footer-menu-item" (dict "item" .) -}}
         </li>
         {{- end -}}
       {{- end -}}
     </ul>
     {{- else -}}
-    <li class="nav-item">
+    <li class="nav-item w-100">
       {{- template "footer-menu-item" (dict "item" .) -}}
     </li>
     {{- end -}}
@@ -29,10 +29,14 @@
 {{- end -}}
 
 {{- define "footer-menu-item" -}}
-{{- $class := default "nav-link" .class -}}
+{{- $class := default "nav-link text-nowrap overflow-hidden" .class -}}
+{{- $title := partial "helpers/menu-name" .item }}
 {{- if .item.URL -}}
-<a class="{{ $class }}" href="{{ .item.URL }}"{{ if not .item.Page }} target="_blank" rel="noopener noreferrer"{{ end }}>{{ partial "helpers/menu-name" .item }}</a>
+<a class="{{ $class }}" title="{{ $title }}"
+  href="{{ .item.URL }}"{{ if not .item.Page }} target="_blank" rel="noopener noreferrer"{{ end }}>
+  {{- $title -}}
+</a>
 {{- else -}}
-<a class="{{ $class }}" href="javascript: void(0);">{{ partial "helpers/menu-name" .item }}</a>
+<a class="{{ $class }}" href="javascript: void(0);">{{ $title }}</a>
 {{- end -}}
 {{- end -}}