mirror of
https://github.com/aljazceru/njump.git
synced 2026-02-21 05:54:22 +01:00
Fix long names visualization
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
package main
|
||||
|
||||
templ clientsTemplate(clients []ClientReference) {
|
||||
<aside class="fixed bottom-0 left-0 top-auto mt-4 w-full basis-3/12 self-start transition-all duration-500 print:hidden sm:sticky sm:bottom-auto sm:left-auto sm:top-8 sm:w-auto">
|
||||
<aside class="fixed flex-1 bottom-0 left-0 top-auto mt-4 w-full self-start transition-all duration-500 print:hidden sm:sticky sm:bottom-auto sm:left-auto sm:top-8 sm:w-auto">
|
||||
<div class="absolute right-0 top-0 z-10 mb-4 h-10 w-10 text-center text-sm sm:relative sm:h-auto sm:w-auto">
|
||||
<span class="hidden sm:block">Open in</span>
|
||||
<div
|
||||
|
||||
@@ -42,16 +42,16 @@ templ profileTemplate(params ProfilePageParams) {
|
||||
<div class="mx-auto px-4 sm:flex sm:items-center sm:justify-center sm:px-0">
|
||||
<div class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12 lg:gap-48vw">
|
||||
<header
|
||||
class="relative top-auto flex basis-1/4 items-center self-start sm:sticky sm:top-8 sm:mt-8 sm:block sm:items-start"
|
||||
class="relative top-auto flex basis-1/5 sm:max-w-[20%] items-center self-start sm:sticky sm:top-8 sm:mt-8 sm:block sm:items-start"
|
||||
>
|
||||
<div
|
||||
class="hidden basis-[64%] items-center overflow-hidden text-left"
|
||||
class="hidden basis-[60%] pr-4 sm:pr-0 items-center overflow-hidden text-left break-words"
|
||||
_="on load or scroll from window or resize from window get #profile_name then measure its top, height then if top is less than height / -2 or height is 0 remove .hidden otherwise add .hidden"
|
||||
>
|
||||
<div class="mb-3 sm:text-center">
|
||||
<div class="text-2xl">{ params.Metadata.Name }</div>
|
||||
<div class="text-2xl break-words">{ params.Metadata.Name }</div>
|
||||
if params.Metadata.Name != params.Metadata.DisplayName {
|
||||
<div class="text-base text-stone-400">
|
||||
<div class="text-base text-stone-400 break-words">
|
||||
{ params.Metadata.DisplayName }
|
||||
</div>
|
||||
}
|
||||
@@ -63,12 +63,12 @@ templ profileTemplate(params ProfilePageParams) {
|
||||
<img class="block h-auto w-full" src={ params.Metadata.Picture }/>
|
||||
</div>
|
||||
</header>
|
||||
<div class="w-full break-words print:w-full sm:w-1/2">
|
||||
<div class="w-full flex-1 break-words print:w-full sm:w-1/2">
|
||||
<header class="mb-6 hidden leading-5 sm:flex sm:items-center">
|
||||
<h1>
|
||||
<div id="profile_name" class="text-2xl">{ params.Metadata.Name }</div>
|
||||
<h1 class="sm:max-w-full">
|
||||
<div id="profile_name" class="text-2xl break-words">{ params.Metadata.Name }</div>
|
||||
if params.Metadata.Name != params.Metadata.DisplayName {
|
||||
<div class="text-xl text-stone-400">
|
||||
<div class="text-xl text-stone-400 break-words">
|
||||
{ params.Metadata.DisplayName }
|
||||
</div>
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user