Remove striped tables in UI (#36509)

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
+1 -1
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>
+1 -1
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>
+1 -1
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">
+1 -1
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>
+1 -1
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>
+1 -1
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>
+1 -1
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>
+1 -1
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>
+1 -1
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>
+1 -1
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>
+1 -1
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>