Mirrors
/
gitea
mirror of https://github.com/go-gitea/gitea.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improve context popup rendering (#30824) (#30829) 

Backport #30824 by @silverwind

Before, lot of empty space when no labels or body:

<img width="281" alt="Screenshot 2024-05-02 at 13 51 29"
src="https://github.com/go-gitea/gitea/assets/115237/8a980ccd-d53c-43a3-a059-dc8c614621e1">

After, empty space collapsed:

<img width="306" alt="Screenshot 2024-05-02 at 13 51 16"
src="https://github.com/go-gitea/gitea/assets/115237/8d9c154d-5de1-43d0-8536-afd9194d99b3">

All `<p>` (unsuitable) and `<small>` (discouraged in favor of css) tags
are removed.

Co-authored-by: silverwind <me@silverwind.io>
This commit is contained in:
Giteabot 2024-05-02 21:47:32 +08:00 committed by GitHub
parent 606b12caf0
commit 3f0dc69400
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
web_src/js/components/.eslintrc.yaml
View File

@ -18,4 +18,5 @@ rules:
vue/attributes-order: [0] vue/attributes-order: [0]
vue/html-closing-bracket-spacing: [2, {startTag: never, endTag: never, selfClosingTag: never}] vue/html-closing-bracket-spacing: [2, {startTag: never, endTag: never, selfClosingTag: never}]
vue/max-attributes-per-line: [0] vue/max-attributes-per-line: [0]
vue/singleline-html-element-content-newline: [0]
vue-scoped-css/enforce-style-type: [0] vue-scoped-css/enforce-style-type: [0]

22
web_src/js/components/ContextPopup.vue
View File

@ -91,16 +91,22 @@ export default {
<template> <template>
<div ref="root"> <div ref="root">
<div v-if="loading" class="tw-h-12 tw-w-12 is-loading"/> <div v-if="loading" class="tw-h-12 tw-w-12 is-loading"/>
<div v-if="!loading && issue !== null"> <div v-if="!loading && issue !== null" class="tw-flex tw-flex-col tw-gap-2">
<p><small>{{ issue.repository.full_name }} on {{ createdAt }}</small></p> <div class="tw-text-12">{{ issue.repository.full_name }} on {{ createdAt }}</div>
<p><svg-icon :name="icon" :class="['text', color]"/> <strong>{{ issue.title }}</strong> #{{ issue.number }}</p> <div class="flex-text-block">
<p>{{ body }}</p> <svg-icon :name="icon" :class="['text', color]"/>
<span class="issue-title tw-font-semibold tw-break-anywhere">
{{ issue.title }}
<span class="index">#{{ issue.number }}</span>
</span>
</div>
<div v-if="body">{{ body }}</div>
<!-- eslint-disable-next-line vue/no-v-html --> <!-- eslint-disable-next-line vue/no-v-html -->
<div v-html="renderedLabels"/> <div v-if="issue.labels.length" v-html="renderedLabels"/>
</div> </div>
<div v-if="!loading && issue === null"> <div class="tw-flex tw-flex-col tw-gap-2" v-if="!loading && issue === null">
<p><small>{{ i18nErrorOccurred }}</small></p> <div class="tw-text-12">{{ i18nErrorOccurred }}</div>
<p>{{ i18nErrorMessage }}</p> <div>{{ i18nErrorMessage }}</div>
</div> </div>
</div> </div>
</template> </template>