This commit is contained in:
かっこかり 2025-05-04 21:30:14 +09:00 committed by GitHub
commit 2be71a034a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 26 additions and 1 deletions

View File

@ -6,7 +6,11 @@ SPDX-License-Identifier: AGPL-3.0-only
<template> <template>
<div :class="$style.root" :style="themeColorStyle"> <div :class="$style.root" :style="themeColorStyle">
<img v-if="faviconUrl" :class="$style.icon" :src="faviconUrl"/> <img v-if="faviconUrl" :class="$style.icon" :src="faviconUrl"/>
<div :class="$style.name">{{ instanceName }}</div> <div :class="$style.name">
<svg :class="$style.nameSvg" version="1.1" xmlns="http://www.w3.org/2000/svg">
<text x="0" y="0" :class="$style.nameSvgText">{{ instanceName }}</text>
</svg>
</div>
</div> </div>
</template> </template>
@ -78,10 +82,31 @@ $height: 2ex;
.name { .name {
margin-left: 4px; margin-left: 4px;
height: 100%;
line-height: 1; line-height: 1;
font-size: 0.9em; font-size: 0.9em;
font-weight: bold; font-weight: bold;
white-space: nowrap; white-space: nowrap;
overflow: visible; overflow: visible;
} }
.nameSvg {
width: auto;
height: 100%;
overflow: visible;
}
.nameSvgText {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
text-rendering: optimizeLegibility;
transform: translateY(calc(100% - 2.5px)); // 2.5px
fill: currentColor;
stroke: #000;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2.5px;
paint-order: stroke fill markers;
}
</style> </style>