github/gitea
1
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2026-02-21 22:06:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove striped tables in UI (#36509)

Browse Source 
We've been cutting down on the "striped" tables (where rows are using
alternate row background colors). This completely removes them as I
think such a design looks outdated.

The removal of selectors starting with `.ui[class*="very
basic"].table:not(.striped)` is needed because of a specificity issue in
the CSS where table cells would otherwise render with incorrect padding.

Example of one affected table:

<img width="1027" height="224" alt="image"
src="https://github.com/user-attachments/assets/2f3006ca-99a1-4655-afdb-b7cd9e5f19c7"
/>
This commit is contained in:
silverwind
2026-02-11 02:58:56 +01:00
committed by GitHub
parent c17280149f
commit 018a88590c
18 changed files with 17 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
templates/admin/auth/list.tmpl
View File

@@ -7,7 +7,7 @@
</div>
</h4>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th>ID</th>

2
templates/admin/cron.tmpl
View File

@@ -5,7 +5,7 @@
</h4>
<div class="ui attached table segment">
<form method="post" action="{{AppSubUrl}}/-/admin">
<table class="ui very basic striped table unstackable tw-mb-0">
<table class="ui very basic table unstackable tw-mb-0">
<thead>
<tr>
<th></th>

2
templates/admin/emails/list.tmpl
View File

@@ -24,7 +24,7 @@
</div>
</div>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th data-sortt-asc="username" data-sortt-desc="reverseusername">

2
templates/admin/notice.tmpl
View File

@@ -3,7 +3,7 @@
<h4 class="ui top attached header">
{{ctx.Locale.Tr "admin.notices.system_notice_list"}} ({{ctx.Locale.Tr "admin.total" .Total}})
</h4>
<table class="ui attached segment select selectable striped table unstackable g-table-auto-ellipsis">
<table class="ui attached segment select selectable table unstackable g-table-auto-ellipsis">
<thead>
<tr>
<th></th>

2
templates/admin/org/list.tmpl
View File

@@ -29,7 +29,7 @@
</div>
</div>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th data-sortt-asc="oldest" data-sortt-desc="newest">ID{{SortArrow "oldest" "newest" $.SortType false}}</th>

2
templates/admin/packages/list.tmpl
View File

@@ -26,7 +26,7 @@
</form>
</div>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th>ID</th>

2
templates/admin/queue.tmpl
View File

@@ -4,7 +4,7 @@
{{ctx.Locale.Tr "admin.monitor.queues"}}
</h4>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th>{{ctx.Locale.Tr "admin.monitor.queue.name"}}</th>

2
templates/admin/queue_manage.tmpl
View File

@@ -4,7 +4,7 @@
{{ctx.Locale.Tr "admin.monitor.queue" .Queue.GetName}}
</h4>
<div class="ui attached table segment">
<table class="ui very basic striped table">
<table class="ui very basic table">
<thead>
<tr>
<th>{{ctx.Locale.Tr "admin.monitor.queue.name"}}</th>

2
templates/admin/repo/list.tmpl
View File

@@ -10,7 +10,7 @@
{{template "shared/repo/search" .}}
</div>
<div class="ui attached table segment">
<table class="ui very basic striped table selectable unstackable">
<table class="ui very basic table selectable unstackable">
<thead>
<tr>
<th data-sortt-asc="oldest" data-sortt-desc="newest">ID{{SortArrow "oldest" "newest" $.SortType false}}</th>

2
templates/admin/stats.tmpl
View File

@@ -4,7 +4,7 @@
{{ctx.Locale.Tr "admin.dashboard.statistic"}}
</h4>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
{{range $statsKey := .StatsKeys}}
<tr>
<td width="200">{{$statsKey}}</td>

2
templates/admin/user/list.tmpl
View File

@@ -56,7 +56,7 @@
</form>
</div>
<div class="ui attached table segment">
<table class="ui very basic striped selectable table unstackable">
<table class="ui very basic selectable table unstackable">
<thead>
<tr>
<th data-sortt-asc="oldest" data-sortt-desc="newest">ID{{SortArrow "oldest" "newest" .SortType false}}</th>

2
templates/package/shared/cleanup_rules/preview.tmpl
View File

@@ -3,7 +3,7 @@
<p>{{ctx.Locale.Tr "packages.owner.settings.cleanuprules.preview.overview" (len .VersionsToRemove)}}</p>
</div>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th>{{ctx.Locale.Tr "admin.packages.type"}}</th>

4
templates/repo/branch/list.tmpl
View File

@@ -15,7 +15,7 @@
</h4>
<div class="ui attached table segment">
<table class="ui very basic striped fixed table single line">
<table class="ui very basic fixed table single line">
<tbody>
<tr>
<td>
@@ -83,7 +83,7 @@
</div>
<div class="ui attached table segment">
<table class="ui very basic striped fixed table single line">
<table class="ui very basic fixed table single line">
<tbody>
{{range .Branches}}
<tr>

2
templates/repo/commits_list.tmpl
View File

@@ -1,5 +1,5 @@
<div class="ui attached table segment commit-table">
<table class="ui very basic striped table unstackable" id="commits-table">
<table class="ui very basic table unstackable" id="commits-table">
<thead>
<tr>
<th class="three wide">{{ctx.Locale.Tr "repo.commits.author"}}</th>

2
templates/shared/actions/runner_edit.tmpl
View File

@@ -49,7 +49,7 @@
{{ctx.Locale.Tr "actions.runners.task_list"}}
</h4>
<div class="ui attached segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th>{{ctx.Locale.Tr "actions.runners.task_list.run"}}</th>

2
templates/shared/actions/runner_list.tmpl
View File

@@ -41,7 +41,7 @@
</form>
</div>
<div class="ui attached table segment">
<table class="ui very basic striped table unstackable">
<table class="ui very basic table unstackable">
<thead>
<tr>
<th data-sortt-asc="online" data-sortt-desc="offline">

32
web_src/css/modules/table.css
View File

@@ -196,11 +196,6 @@
margin-bottom: 0;
}
.ui.striped.table > tr:nth-child(2n),
.ui.striped.table > tbody > tr:nth-child(2n) {
background: var(--color-light);
}
.ui.table[class*="single line"],
.ui.table [class*="single line"] {
white-space: nowrap;
@@ -291,37 +286,10 @@
.ui.basic.table > tr > td {
background: transparent;
}
.ui.basic.striped.table > tbody > tr:nth-child(2n) {
background: var(--color-light);
}
.ui.basic.striped.selectable.table > tbody > tr:nth-child(2n):hover {
background: var(--color-hover);
}
.ui[class*="very basic"].table {
border: none;
}
.ui[class*="very basic"].table:not(.striped) > tr > th:first-child,
.ui[class*="very basic"].table:not(.striped) > thead > tr > th:first-child,
.ui[class*="very basic"].table:not(.striped) > tbody > tr > th:first-child,
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > th:first-child,
.ui[class*="very basic"].table:not(.striped) > tr > td:first-child,
.ui[class*="very basic"].table:not(.striped) > tbody > tr > td:first-child,
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > td:first-child {
padding-left: 0;
}
.ui[class*="very basic"].table:not(.striped) > tr > th:last-child,
.ui[class*="very basic"].table:not(.striped) > thead > tr > th:last-child,
.ui[class*="very basic"].table:not(.striped) > tbody > tr > th:last-child,
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > th:last-child,
.ui[class*="very basic"].table:not(.striped) > tr > td:last-child,
.ui[class*="very basic"].table:not(.striped) > tbody > tr > td:last-child,
.ui[class*="very basic"].table:not(.striped) > tfoot > tr > td:last-child {
padding-right: 0;
}
.ui[class*="very basic"].table:not(.striped) > thead > tr:first-child > th {
padding-top: 0;
}
.ui.celled.table > tr > th,
.ui.celled.table > thead > tr > th,

4
web_src/css/repo.css
View File

@@ -774,10 +774,6 @@ td .commit-summary {
width: 200px;
}
.repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n) {
background-color: var(--color-light) !important;
}
.repository .data-table {
width: 100%;
}