aboutsummaryrefslogtreecommitdiffstats
path: root/web_src
diff options
context:
space:
mode:
Diffstat (limited to 'web_src')
-rw-r--r--web_src/css/actions.css4
-rw-r--r--web_src/css/helpers.css10
-rw-r--r--web_src/js/components/ActionRunStatus.vue2
-rw-r--r--web_src/js/components/DashboardRepoList.vue20
-rw-r--r--web_src/js/components/DiffCommitSelector.vue2
-rw-r--r--web_src/js/components/DiffFileList.vue4
-rw-r--r--web_src/js/components/DiffFileTreeItem.vue2
-rw-r--r--web_src/js/components/PullRequestMergeForm.vue2
-rw-r--r--web_src/js/components/RepoBranchTagSelector.vue4
-rw-r--r--web_src/js/components/RepoCodeFrequency.vue4
-rw-r--r--web_src/js/components/RepoContributors.vue10
-rw-r--r--web_src/js/components/RepoRecentCommits.vue4
-rw-r--r--web_src/js/features/repo-issue-content.js2
-rw-r--r--web_src/js/features/repo-issue-list.js2
14 files changed, 29 insertions, 43 deletions
diff --git a/web_src/css/actions.css b/web_src/css/actions.css
index e353a013a7..e7b9a3855a 100644
--- a/web_src/css/actions.css
+++ b/web_src/css/actions.css
@@ -14,10 +14,6 @@
color: var(--color-red-light);
}
-.runner-container .runner-basic-info .gt-dib {
- margin-right: 1em;
-}
-
.runner-container .runner-new-text {
color: var(--color-white);
}
diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css
index a3817be223..c7097e631b 100644
--- a/web_src/css/helpers.css
+++ b/web_src/css/helpers.css
@@ -2,16 +2,6 @@
Gitea's tailwind-style CSS helper classes have `gt-` prefix.
Gitea's private styles use `g-` prefix.
*/
-.gt-df { display: flex !important; }
-.gt-dib { display: inline-block !important; }
-.gt-ac { align-items: center !important; }
-.gt-jc { justify-content: center !important; }
-.gt-je { justify-content: flex-end !important; }
-.gt-sb { justify-content: space-between !important; }
-.gt-fc { flex-direction: column !important; }
-.gt-f1 { flex: 1 !important; }
-.gt-fw { flex-wrap: wrap !important; }
-.gt-vm { vertical-align: middle !important; }
.gt-mono {
font-family: var(--fonts-monospace) !important;
diff --git a/web_src/js/components/ActionRunStatus.vue b/web_src/js/components/ActionRunStatus.vue
index 51a7745431..08a47eded7 100644
--- a/web_src/js/components/ActionRunStatus.vue
+++ b/web_src/js/components/ActionRunStatus.vue
@@ -28,7 +28,7 @@ export default {
};
</script>
<template>
- <span class="gt-df gt-ac" :data-tooltip-content="localeStatus" v-if="status">
+ <span class="tw-flex tw-content-center" :data-tooltip-content="localeStatus" v-if="status">
<SvgIcon name="octicon-check-circle-fill" class="text green" :size="size" :class-name="className" v-if="status === 'success'"/>
<SvgIcon name="octicon-skip" class="text grey" :size="size" :class-name="className" v-else-if="status === 'skipped'"/>
<SvgIcon name="octicon-clock" class="text yellow" :size="size" :class-name="className" v-else-if="status === 'waiting'"/>
diff --git a/web_src/js/components/DashboardRepoList.vue b/web_src/js/components/DashboardRepoList.vue
index 177ae04855..df46516449 100644
--- a/web_src/js/components/DashboardRepoList.vue
+++ b/web_src/js/components/DashboardRepoList.vue
@@ -345,12 +345,12 @@ export default sfc; // activate the IDE's Vue plugin
<a :class="{item: true, active: tab === 'organizations'}" @click="changeTab('organizations')">{{ textOrganization }}</a>
</div>
<div v-show="tab === 'repos'" class="ui tab active list dashboard-repos">
- <h4 class="ui top attached header gt-df gt-ac">
- <div class="gt-f1 gt-df gt-ac">
+ <h4 class="ui top attached header tw-flex tw-content-center">
+ <div class="tw-flex-1 tw-flex tw-content-center">
{{ textMyRepos }}
<span class="ui grey label gt-ml-3">{{ reposTotalCount }}</span>
</div>
- <a class="gt-df gt-ac muted" :href="subUrl + '/repo/create' + (isOrganization ? '?org=' + organizationId : '')" :data-tooltip-content="textNewRepo">
+ <a class="tw-flex tw-content-center muted" :href="subUrl + '/repo/create' + (isOrganization ? '?org=' + organizationId : '')" :data-tooltip-content="textNewRepo">
<svg-icon name="octicon-plus"/>
</a>
</h4>
@@ -411,7 +411,7 @@ export default sfc; // activate the IDE's Vue plugin
</div>
<div v-if="repos.length" class="ui attached table segment tw-rounded-b">
<ul class="repo-owner-name-list">
- <li class="gt-df gt-ac gt-py-3" v-for="repo, index in repos" :class="{'active': index === activeIndex}" :key="repo.id">
+ <li class="tw-flex tw-content-center gt-py-3" v-for="repo, index in repos" :class="{'active': index === activeIndex}" :key="repo.id">
<a class="repo-list-link muted" :href="repo.link">
<svg-icon :name="repoIcon(repo)" :size="16" class-name="repo-list-icon"/>
<div class="text truncate">{{ repo.full_name }}</div>
@@ -419,7 +419,7 @@ export default sfc; // activate the IDE's Vue plugin
<svg-icon name="octicon-archive" :size="16"/>
</div>
</a>
- <a class="gt-df gt-ac" v-if="repo.latest_commit_status_state" :href="repo.latest_commit_status_state_link" :data-tooltip-content="repo.locale_latest_commit_status_state">
+ <a class="tw-flex tw-content-center" v-if="repo.latest_commit_status_state" :href="repo.latest_commit_status_state_link" :data-tooltip-content="repo.locale_latest_commit_status_state">
<!-- the commit status icon logic is taken from templates/repo/commit_status.tmpl -->
<svg-icon :name="statusIcon(repo.latest_commit_status_state)" :class-name="'gt-ml-3 commit-status icon text ' + statusColor(repo.latest_commit_status_state)" :size="16"/>
</a>
@@ -458,18 +458,18 @@ export default sfc; // activate the IDE's Vue plugin
</div>
</div>
<div v-if="!isOrganization" v-show="tab === 'organizations'" class="ui tab active list dashboard-orgs">
- <h4 class="ui top attached header gt-df gt-ac">
- <div class="gt-f1 gt-df gt-ac">
+ <h4 class="ui top attached header tw-flex tw-content-center">
+ <div class="tw-flex-1 tw-flex tw-content-center">
{{ textMyOrgs }}
<span class="ui grey label gt-ml-3">{{ organizationsTotalCount }}</span>
</div>
- <a class="gt-df gt-ac muted" v-if="canCreateOrganization" :href="subUrl + '/org/create'" :data-tooltip-content="textNewOrg">
+ <a class="tw-flex tw-content-center muted" v-if="canCreateOrganization" :href="subUrl + '/org/create'" :data-tooltip-content="textNewOrg">
<svg-icon name="octicon-plus"/>
</a>
</h4>
<div v-if="organizations.length" class="ui attached table segment tw-rounded-b">
<ul class="repo-owner-name-list">
- <li class="gt-df gt-ac gt-py-3" v-for="org in organizations" :key="org.name">
+ <li class="tw-flex tw-content-center gt-py-3" v-for="org in organizations" :key="org.name">
<a class="repo-list-link muted" :href="subUrl + '/' + encodeURIComponent(org.name)">
<svg-icon name="octicon-organization" :size="16" class-name="repo-list-icon"/>
<div class="text truncate">{{ org.name }}</div>
@@ -479,7 +479,7 @@ export default sfc; // activate the IDE's Vue plugin
</span>
</div>
</a>
- <div class="text light grey gt-df gt-ac gt-ml-3">
+ <div class="text light grey tw-flex tw-content-center gt-ml-3">
{{ org.num_repos }}
<svg-icon name="octicon-repo" :size="16" class-name="gt-ml-2 gt-mt-1"/>
</div>
diff --git a/web_src/js/components/DiffCommitSelector.vue b/web_src/js/components/DiffCommitSelector.vue
index b465127aca..e8ceffa3e8 100644
--- a/web_src/js/components/DiffCommitSelector.vue
+++ b/web_src/js/components/DiffCommitSelector.vue
@@ -240,7 +240,7 @@ export default {
@click.meta.exact="commitClicked(commit.id, true)"
@click.shift.exact.stop.prevent="commitClickedShift(commit)"
>
- <div class="gt-f1 gt-df gt-fc gt-gap-2">
+ <div class="tw-flex-1 tw-flex tw-flex-col gt-gap-2">
<div class="gt-ellipsis commit-list-summary">
{{ commit.summary }}
</div>
diff --git a/web_src/js/components/DiffFileList.vue b/web_src/js/components/DiffFileList.vue
index 8bde61804f..2499d998a8 100644
--- a/web_src/js/components/DiffFileList.vue
+++ b/web_src/js/components/DiffFileList.vue
@@ -38,7 +38,7 @@ export default {
<template>
<ol class="diff-stats gt-m-0" ref="root" v-if="store.fileListIsVisible">
<li v-for="file in store.files" :key="file.NameHash">
- <div class="gt-font-semibold gt-df gt-ac pull-right">
+ <div class="gt-font-semibold tw-flex tw-content-center pull-right">
<span v-if="file.IsBin" class="gt-ml-1 gt-mr-3">{{ store.binaryFileMessage }}</span>
{{ file.IsBin ? '' : file.Addition + file.Deletion }}
<span v-if="!file.IsBin" class="diff-stats-bar gt-mx-3" :data-tooltip-content="store.statisticsMessage.replace('%d', (file.Addition + file.Deletion)).replace('%d', file.Addition).replace('%d', file.Deletion)">
@@ -50,7 +50,7 @@ export default {
<a class="file gt-mono" :href="'#diff-' + file.NameHash">{{ file.Name }}</a>
</li>
<li v-if="store.isIncomplete" class="gt-pt-2">
- <span class="file gt-df gt-ac gt-sb">{{ store.tooManyFilesMessage }}
+ <span class="file tw-flex tw-content-center tw-justify-between">{{ store.tooManyFilesMessage }}
<a :class="['ui', 'basic', 'tiny', 'button', store.isLoadingNewData ? 'disabled' : '']" @click.stop="loadMoreData">{{ store.showMoreMessage }}</a>
</span>
</li>
diff --git a/web_src/js/components/DiffFileTreeItem.vue b/web_src/js/components/DiffFileTreeItem.vue
index 9d7ab4afc5..a5d78f07f1 100644
--- a/web_src/js/components/DiffFileTreeItem.vue
+++ b/web_src/js/components/DiffFileTreeItem.vue
@@ -37,7 +37,7 @@ export default {
>
<!-- file -->
<SvgIcon name="octicon-file"/>
- <span class="gt-ellipsis gt-f1">{{ item.name }}</span>
+ <span class="gt-ellipsis tw-flex-1">{{ item.name }}</span>
<SvgIcon :name="getIconForDiffType(item.file.Type).name" :class="getIconForDiffType(item.file.Type).classes"/>
</a>
<div v-else class="item-directory" :title="item.name" @click.stop="collapsed = !collapsed">
diff --git a/web_src/js/components/PullRequestMergeForm.vue b/web_src/js/components/PullRequestMergeForm.vue
index 170d0d85c6..5f2e19f2e5 100644
--- a/web_src/js/components/PullRequestMergeForm.vue
+++ b/web_src/js/components/PullRequestMergeForm.vue
@@ -136,7 +136,7 @@ export default {
</div>
</form>
- <div v-if="!showActionForm" class="gt-df">
+ <div v-if="!showActionForm" class="tw-flex">
<!-- the merge button -->
<div class="ui buttons merge-button" :class="[mergeForm.emptyCommit ? 'grey' : mergeForm.allOverridableChecksOk ? 'primary' : 'red']" @click="toggleActionForm(true)">
<button class="ui button">
diff --git a/web_src/js/components/RepoBranchTagSelector.vue b/web_src/js/components/RepoBranchTagSelector.vue
index 83289c8852..a5ac689e5a 100644
--- a/web_src/js/components/RepoBranchTagSelector.vue
+++ b/web_src/js/components/RepoBranchTagSelector.vue
@@ -245,8 +245,8 @@ export default sfc; // activate IDE's Vue plugin
</script>
<template>
<div class="ui dropdown custom">
- <button class="branch-dropdown-button gt-ellipsis ui basic small compact button gt-df gt-m-0" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible">
- <span class="text gt-df gt-ac gt-mr-2">
+ <button class="branch-dropdown-button gt-ellipsis ui basic small compact button tw-flex gt-m-0" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible">
+ <span class="text tw-flex tw-content-center gt-mr-2">
<template v-if="release">{{ textReleaseCompare }}</template>
<template v-else>
<svg-icon v-if="isViewTag" name="octicon-tag"/>
diff --git a/web_src/js/components/RepoCodeFrequency.vue b/web_src/js/components/RepoCodeFrequency.vue
index c55bbff9cd..305732afc1 100644
--- a/web_src/js/components/RepoCodeFrequency.vue
+++ b/web_src/js/components/RepoCodeFrequency.vue
@@ -144,10 +144,10 @@ export default {
</script>
<template>
<div>
- <div class="ui header gt-df gt-ac gt-sb">
+ <div class="ui header tw-flex tw-content-center tw-justify-between">
{{ isLoading ? locale.loadingTitle : errorText ? locale.loadingTitleFailed: `Code frequency over the history of ${repoLink.slice(1)}` }}
</div>
- <div class="gt-df ui segment main-graph">
+ <div class="tw-flex ui segment main-graph">
<div v-if="isLoading || errorText !== ''" class="gt-tc tw-m-auto">
<div v-if="isLoading">
<SvgIcon name="octicon-sync" class="gt-mr-3 job-status-rotate"/>
diff --git a/web_src/js/components/RepoContributors.vue b/web_src/js/components/RepoContributors.vue
index 6093c762cb..ca51ca8aba 100644
--- a/web_src/js/components/RepoContributors.vue
+++ b/web_src/js/components/RepoContributors.vue
@@ -303,7 +303,7 @@ export default {
</script>
<template>
<div>
- <div class="ui header gt-df gt-ac gt-sb">
+ <div class="ui header tw-flex tw-content-center tw-justify-between">
<div>
<relative-time
v-if="xAxisMin > 0"
@@ -352,7 +352,7 @@ export default {
</div>
</div>
</div>
- <div class="gt-df ui segment main-graph">
+ <div class="tw-flex ui segment main-graph">
<div v-if="isLoading || errorText !== ''" class="gt-tc tw-m-auto">
<div v-if="isLoading">
<SvgIcon name="octicon-sync" class="gt-mr-3 job-status-rotate"/>
@@ -374,17 +374,17 @@ export default {
:key="index"
v-memo="[sortedContributors, type]"
>
- <div class="ui top attached header gt-df gt-f1">
+ <div class="ui top attached header tw-flex tw-flex-1">
<b class="ui right">#{{ index + 1 }}</b>
<a :href="contributor.home_link">
- <img class="ui avatar gt-vm" height="40" width="40" :src="contributor.avatar_link">
+ <img class="ui avatar tw-align-middle" height="40" width="40" :src="contributor.avatar_link">
</a>
<div class="gt-ml-3">
<a v-if="contributor.home_link !== ''" :href="contributor.home_link"><h4>{{ contributor.name }}</h4></a>
<h4 v-else class="contributor-name">
{{ contributor.name }}
</h4>
- <p class="gt-font-12 gt-df gt-gap-2">
+ <p class="gt-font-12 tw-flex gt-gap-2">
<strong v-if="contributor.total_commits">{{ contributor.total_commits.toLocaleString() }} {{ locale.contributionType.commits }}</strong>
<strong v-if="contributor.total_additions" class="text green">{{ contributor.total_additions.toLocaleString() }}++ </strong>
<strong v-if="contributor.total_deletions" class="text red">
diff --git a/web_src/js/components/RepoRecentCommits.vue b/web_src/js/components/RepoRecentCommits.vue
index c1fd40f506..23738b8060 100644
--- a/web_src/js/components/RepoRecentCommits.vue
+++ b/web_src/js/components/RepoRecentCommits.vue
@@ -121,10 +121,10 @@ export default {
</script>
<template>
<div>
- <div class="ui header gt-df gt-ac gt-sb">
+ <div class="ui header tw-flex tw-content-center tw-justify-between">
{{ isLoading ? locale.loadingTitle : errorText ? locale.loadingTitleFailed: "Number of commits in the past year" }}
</div>
- <div class="gt-df ui segment main-graph">
+ <div class="tw-flex ui segment main-graph">
<div v-if="isLoading || errorText !== ''" class="gt-tc tw-m-auto">
<div v-if="isLoading">
<SvgIcon name="octicon-sync" class="gt-mr-3 job-status-rotate"/>
diff --git a/web_src/js/features/repo-issue-content.js b/web_src/js/features/repo-issue-content.js
index 9e2b773730..f67a22ea6f 100644
--- a/web_src/js/features/repo-issue-content.js
+++ b/web_src/js/features/repo-issue-content.js
@@ -16,7 +16,7 @@ function showContentHistoryDetail(issueBaseUrl, commentId, historyId, itemTitleH
$dialog = $(`
<div class="ui modal content-history-detail-dialog">
${svg('octicon-x', 16, 'close icon inside')}
- <div class="header gt-df gt-ac gt-sb">
+ <div class="header tw-flex tw-content-center tw-justify-between">
<div>${itemTitleHtml}</div>
<div class="ui dropdown dialog-header-options gt-mr-5 gt-hidden">
${i18nTextOptions}
diff --git a/web_src/js/features/repo-issue-list.js b/web_src/js/features/repo-issue-list.js
index 48658fd723..4bdd5e5a8e 100644
--- a/web_src/js/features/repo-issue-list.js
+++ b/web_src/js/features/repo-issue-list.js
@@ -108,7 +108,7 @@ function initRepoIssueListAuthorDropdown() {
// the content is provided by backend IssuePosters handler
const processedResults = []; // to be used by dropdown to generate menu items
for (const item of resp.results) {
- let html = `<img class="ui avatar gt-vm" src="${htmlEscape(item.avatar_link)}" aria-hidden="true" alt="" width="20" height="20"><span class="gt-ellipsis">${htmlEscape(item.username)}</span>`;
+ let html = `<img class="ui avatar tw-align-middle" src="${htmlEscape(item.avatar_link)}" aria-hidden="true" alt="" width="20" height="20"><span class="gt-ellipsis">${htmlEscape(item.username)}</span>`;
if (item.full_name) html += `<span class="search-fullname gt-ml-3">${htmlEscape(item.full_name)}</span>`;
processedResults.push({value: item.user_id, name: html});
}