Frontend: Fixed note header rendering
ci/woodpecker/push/ociImagePush Pipeline was successful Details

This commit is contained in:
Natty 2024-12-20 00:23:37 +01:00
parent 3e4ae86c38
commit 647006d04f
Signed by: natty
GPG Key ID: BF6CB659ADEE60EC
2 changed files with 12 additions and 12 deletions

View File

@ -74,10 +74,10 @@ const showTicker =
display: flex; display: flex;
align-items: center; align-items: center;
white-space: nowrap; white-space: nowrap;
justify-self: flex-end;
border-radius: 100px; border-radius: 100px;
font-size: 0.8em; font-size: 0.8em;
text-shadow: 0 2px 2px var(--shadow); text-shadow: 0 2px 2px var(--shadow);
gap: 0 0.1em;
> .avatar { > .avatar {
width: 3.7em; width: 3.7em;
@ -99,6 +99,8 @@ const showTicker =
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
gap: 0.1em 0; gap: 0.1em 0;
display: flex;
flex-wrap: wrap;
} }
&:last-child { &:last-child {
@ -151,7 +153,6 @@ const showTicker =
margin: 0 0.5em 0 0; margin: 0 0.5em 0 0;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
align-self: flex-start;
font-size: 0.9em; font-size: 0.9em;
} }

View File

@ -4,7 +4,7 @@
v-tooltip=" v-tooltip="
capitalize( capitalize(
magTransProperty(instance, 'software_name', 'softwareName') ?? magTransProperty(instance, 'software_name', 'softwareName') ??
'?', '?'
) )
" "
ref="ticker" ref="ticker"
@ -40,7 +40,7 @@ const instance = props.instance ?? {
name: instanceName, name: instanceName,
themeColor: ( themeColor: (
document.querySelector( document.querySelector(
'meta[name="theme-color-orig"]', 'meta[name="theme-color-orig"]'
) as HTMLMetaElement ) as HTMLMetaElement
)?.content, )?.content,
softwareName: (Instance.softwareName || "Magnetar") as string | null, softwareName: (Instance.softwareName || "Magnetar") as string | null,
@ -61,18 +61,18 @@ const bg = {
}; };
function getInstanceIcon( function getInstanceIcon(
instance?: Misskey.entities.User["instance"] | types.InstanceTicker | null, instance?: Misskey.entities.User["instance"] | types.InstanceTicker | null
): string { ): string {
if (!instance) return "/client-assets/dummy.png"; if (!instance) return "/client-assets/dummy.png";
return ( return (
getProxiedImageUrlNullable( getProxiedImageUrlNullable(
magTransProperty(instance, "icon_url", "iconUrl"), magTransProperty(instance, "icon_url", "iconUrl"),
"preview", "preview"
) ?? ) ??
getProxiedImageUrlNullable( getProxiedImageUrlNullable(
magTransProperty(instance, "favicon_url", "faviconUrl"), magTransProperty(instance, "favicon_url", "faviconUrl"),
"preview", "preview"
) ?? ) ??
"/client-assets/dummy.png" "/client-assets/dummy.png"
); );
@ -90,6 +90,7 @@ function getInstanceIcon(
font-size: 0.8em; font-size: 0.8em;
text-shadow: 0 2px 2px var(--shadow); text-shadow: 0 2px 2px var(--shadow);
overflow: hidden; overflow: hidden;
.header > .body & { .header > .body & {
width: max-content; width: max-content;
max-width: 100%; max-width: 100%;
@ -108,11 +109,9 @@ function getInstanceIcon(
font-weight: bold; font-weight: bold;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
text-shadow: text-shadow: -1px -1px 0 var(--bg), 1px -1px 0 var(--bg),
-1px -1px 0 var(--bg), -1px 1px 0 var(--bg), 1px 1px 0 var(--bg);
1px -1px 0 var(--bg),
-1px 1px 0 var(--bg),
1px 1px 0 var(--bg);
.article > .main &, .article > .main &,
.header > .body & { .header > .body & {
display: unset; display: unset;