style: tag tooltip content width
This commit is contained in:
jialin
@@ -29,6 +29,7 @@ type StatusTagProps = {
|
||||
download?: {
|
||||
percent: number;
|
||||
};
|
||||
maxTooltipWidth?: number;
|
||||
extra?: React.ReactNode;
|
||||
actions?: {
|
||||
label: string;
|
||||
@@ -44,6 +45,7 @@ const StatusTag: React.FC<StatusTagProps> = ({
|
||||
download,
|
||||
extra,
|
||||
actions = [],
|
||||
maxTooltipWidth = 250,
|
||||
type = 'tag'
|
||||
}) => {
|
||||
const { text, status } = statusValue;
|
||||
@@ -118,7 +120,7 @@ const StatusTag: React.FC<StatusTagProps> = ({
|
||||
<div
|
||||
style={{
|
||||
width: 'max-content',
|
||||
maxWidth: 250,
|
||||
maxWidth: maxTooltipWidth,
|
||||
whiteSpace: 'pre-wrap',
|
||||
wordBreak: 'break-word'
|
||||
}}
|
||||
|
||||
+1
-1
@@ -72,7 +72,7 @@ html {
|
||||
--color-green-fill-light: rgb(243 251 248);
|
||||
--ant-rate-star-color: #fadb14;
|
||||
--color-fill-spin-bg: rgba(255, 255, 255, 15%);
|
||||
--width-tooltip-max: 300px;
|
||||
--width-tooltip-max: 420px;
|
||||
--color-bg-tooltip: '#fff';
|
||||
--color-modal-content-bg: rgba(255, 255, 255, 90%);
|
||||
--color-modal-box-shadow: 0 4px 16px rgba(0, 0, 0, 10%);
|
||||
|
||||
@@ -74,7 +74,7 @@ export default {
|
||||
'resources.modelfiles.copy.tips': 'Copy Full Path',
|
||||
'resources.filter.path': 'Filter by path',
|
||||
'resources.register.worker.step1':
|
||||
'Click the <span class="bold-text">Copy the token</span> menu.',
|
||||
'Click the <span class="bold-text">Copy token</span> menu.',
|
||||
'resources.register.worker.step2':
|
||||
'Click the <span class="bold-text">Quick Config</span> menu.',
|
||||
'resources.register.worker.step3':
|
||||
@@ -82,7 +82,7 @@ export default {
|
||||
'resources.register.worker.step4':
|
||||
'Select <span class="bold-text">Worker</span> as the service role.',
|
||||
'resources.register.worker.step5':
|
||||
'Enter the <span="bold-text">Server URL</span>.',
|
||||
'Enter the <span class="bold-text">Server URL</span>.',
|
||||
'resources.register.worker.step6':
|
||||
'Paste the <span class="bold-text">Token</span>.',
|
||||
'resources.register.worker.step7':
|
||||
|
||||
@@ -75,7 +75,7 @@ export default {
|
||||
'resources.modelfiles.copy.tips': 'フルパスをコピー',
|
||||
'resources.filter.path': 'パスでフィルタ',
|
||||
'resources.register.worker.step1':
|
||||
'Click the <span class="bold-text">Copy the token</span> menu.',
|
||||
'Click the <span class="bold-text">Copy token</span> menu.',
|
||||
'resources.register.worker.step2':
|
||||
'Click the <span class="bold-text">Quick Config</span> menu.',
|
||||
'resources.register.worker.step3':
|
||||
@@ -83,7 +83,7 @@ export default {
|
||||
'resources.register.worker.step4':
|
||||
'Select <span class="bold-text">Worker</span> as the service role.',
|
||||
'resources.register.worker.step5':
|
||||
'Enter the <span="bold-text">Server URL</span>.',
|
||||
'Enter the <span class="bold-text">Server URL</span>.',
|
||||
'resources.register.worker.step6':
|
||||
'Paste the <span class="bold-text">Token</span>.',
|
||||
'resources.register.worker.step7':
|
||||
@@ -93,11 +93,11 @@ export default {
|
||||
};
|
||||
|
||||
// ========== To-Do: Translate Keys (Remove After Translation) ==========
|
||||
// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy the token</span> menu.',
|
||||
// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy token</span> menu.',
|
||||
// 2. 'resources.register.worker.step2': 'Click the <span class="bold-text">Quick Config</span> menu.',
|
||||
// 3. 'resources.register.worker.step3': 'Click the <span class="bold-text">General</span> tab.',
|
||||
// 4. 'resources.register.worker.step4': 'Select <span class="bold-text">Worker</span> as the service role.',
|
||||
// 5. 'resources.register.worker.step5': 'Enter the <span="bold-text">Server URL</span>.',
|
||||
// 5. 'resources.register.worker.step5': 'Enter the <span class="bold-text">Server URL</span>.',
|
||||
// 6. 'resources.register.worker.step6': 'Paste the <span class="bold-text">Token</span>.',
|
||||
// 7. 'resources.register.worker.step7': 'Click <span class="bold-text">Restart</span> to apply the settings.',
|
||||
// 8. 'resources.register.install.title': 'Install GPUStack',
|
||||
|
||||
@@ -73,7 +73,7 @@ export default {
|
||||
'resources.modelfiles.copy.tips': 'Скопировать полный путь',
|
||||
'resources.filter.path': 'Фильтрация по пути',
|
||||
'resources.register.worker.step1':
|
||||
'Click the <span class="bold-text">Copy the token</span> menu.',
|
||||
'Click the <span class="bold-text">Copy token</span> menu.',
|
||||
'resources.register.worker.step2':
|
||||
'Click the <span class="bold-text">Quick Config</span> menu.',
|
||||
'resources.register.worker.step3':
|
||||
@@ -81,7 +81,7 @@ export default {
|
||||
'resources.register.worker.step4':
|
||||
'Select <span class="bold-text">Worker</span> as the service role.',
|
||||
'resources.register.worker.step5':
|
||||
'Enter the <span="bold-text">Server URL</span>.',
|
||||
'Enter the <span class="bold-text">Server URL</span>.',
|
||||
'resources.register.worker.step6':
|
||||
'Paste the <span class="bold-text">Token</span>.',
|
||||
'resources.register.worker.step7':
|
||||
@@ -91,11 +91,11 @@ export default {
|
||||
};
|
||||
|
||||
// ========== To-Do: Translate Keys (Remove After Translation) ==========
|
||||
// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy the token</span> menu.',
|
||||
// 1. 'resources.register.worker.step1': 'Click the <span class="bold-text">Copy token</span> menu.',
|
||||
// 2. 'resources.register.worker.step2': 'Click the <span class="bold-text">Quick Config</span> menu.',
|
||||
// 3. 'resources.register.worker.step3': 'Click the <span class="bold-text">General</span> tab.',
|
||||
// 4. 'resources.register.worker.step4': 'Select <span class="bold-text">Worker</span> as the service role.',
|
||||
// 5. 'resources.register.worker.step5': 'Enter the <span="bold-text">Server URL</span>.',
|
||||
// 5. 'resources.register.worker.step5': 'Enter the <span class="bold-text">Server URL</span>.',
|
||||
// 6. 'resources.register.worker.step6': 'Paste the <span class="bold-text">Token</span>.',
|
||||
// 7. 'resources.register.worker.step7': 'Click <span class="bold-text">Restart</span> to apply the settings.',
|
||||
// 8. 'resources.register.install.title': 'Install GPUStack',
|
||||
|
||||
@@ -283,6 +283,7 @@ const Workers: React.FC = () => {
|
||||
render={(text, record: ListItem) => {
|
||||
return (
|
||||
<StatusTag
|
||||
maxTooltipWidth={400}
|
||||
statusValue={{
|
||||
status: status[record.state] as any,
|
||||
text: WorkerStatusMapValue[record.state],
|
||||
|
||||
Reference in New Issue
Block a user