CSS: Sticky table headers (fix #918)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 86f1118bc6cdea29299f7c803813ed6e3d84457e..bd56990ce7a23686f5d1c4ad894912c20e5f901e 100644 (file)
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ## Adminer dev
 - PostgreSQL: Display auto_increment of inserted rows
+- CSS: Sticky table headers (bug #918)
 
 ## Adminer 5.0.6 (released 2025-03-17)
 - Align numbers right (bug #912)

diff --git a/adminer/static/dark.css b/adminer/static/dark.css
index 8261461aef41fe2da9cb693f6a5ee478e07db960..76a491696aca033e0f20600681548d3c62264f43 100644 (file)
--- a/adminer/static/dark.css
+++ b/adminer/static/dark.css
@@ -6,7 +6,7 @@ a:visited { color: #517fa8; }
 a:link:hover, a:visited:hover { color: #9bc0e1; }
 h1 { border-color: #5e94c1; color: #ffddbf; background: #154269; }
 h2 { border-color: #a3bdd3; color: #000; background: #3c678d; }
-td, th { border-color: #0e416d; }
+table, td, th { border-color: #0e416d; }
 th { background: #11385a; }
 thead td, thead th { color: #a8b05f; background: #011d35; }
 thead th a { color: #a8b05f; }

diff --git a/adminer/static/default.css b/adminer/static/default.css
index e19a6d1538bd7686150559f097c55931f9acdf31..3c3d26e5a38061d73e69c2b5c58d30693240f5fe 100644 (file)
--- a/adminer/static/default.css
+++ b/adminer/static/default.css
@@ -11,11 +11,13 @@ h2 { font-size: 150%; margin: 0 0 20px -18px; padding: .8em 1em; border-bottom:
 h3 { font-weight: normal; font-size: 130%; margin: 1em 0 0; }
 form { margin: 0; }
 td table { width: 100%; margin: 0; }
-table { margin: 1em 20px 0 0; border-collapse: collapse; font-size: 90%; }
-td, th { border: 1px solid #999; padding: .2em .3em; }
+table { margin: 1em 20px 0 0; font-size: 90%; border-spacing: 0; border-width: 1px 0 0 1px; }
+table, td, th { border-color: #999; border-style: solid; }
+td, th { border-width: 0 1px 1px 0; padding: .2em .3em; margin: 0; }
 th { background: #eee; text-align: left; }
+thead { position: sticky; top: 0; }
 thead th { text-align: center; padding: .2em .5em; }
-thead td, thead th { background: #ddf; } /* position: sticky; causes Firefox to lose borders */
+thead td, thead th { background: #ddf; }
 fieldset { display: inline; vertical-align: top; padding: .5em .8em; margin: .8em .5em 0 0; border: 1px solid #999; }
 p { margin: .8em 20px 0 0; }
 img { vertical-align: middle; border: 0; }

diff --git a/designs/brade/adminer.css b/designs/brade/adminer.css
index b5e407a68183398a898bf6304c7cf7bdc9463867..347960d6c01b9723f13fb827ce2459d66e90ec08 100644 (file)
--- a/designs/brade/adminer.css
+++ b/designs/brade/adminer.css
@@ -24,6 +24,7 @@ code{background:#eee;padding:2px 4px;font:16px/20px Courier,monospace}
 code a:hover{background:transparent}
 table{margin:4px 0 8px;border:1px solid #ccc;font-size:inherit}
 tbody tr:hover td,tbody tr:hover th{background:#eee}
+thead { top: 40px; }
 thead tr:hover td,thead tr:hover th{background:#ddd}
 th,td{text-align:left;padding:2px 4px;vertical-align:top;font-weight:normal;border:1px dotted #ccc;border-width:0 0 0 1px;
 margin:0;background:inherit}

diff --git a/designs/esterka/adminer.css b/designs/esterka/adminer.css
index 5e87d13df10a99fc8f51befefa15973edcf672e7..07cbebf848a4bf14706001674c6b36f8436c1438 100644 (file)
--- a/designs/esterka/adminer.css
+++ b/designs/esterka/adminer.css
@@ -109,6 +109,10 @@ tbody tr:hover td,tbody tr:hover th{
        background:#edf4ff
 }
 
+thead{
+       top: 44px;
+}
+
 thead th, thead td {
        text-align:center;
        vertical-align:middle;

diff --git a/designs/haeckel/adminer.css b/designs/haeckel/adminer.css
index 4c876f4d6d0aab70bfcf9c36c216a46445a96c06..ec5018186ba158f824665cefaabc15e14b872c8f 100644 (file)
--- a/designs/haeckel/adminer.css
+++ b/designs/haeckel/adminer.css
@@ -423,6 +423,9 @@ table {
        border-radius: 2px !important;
        box-shadow: 0px 0px 3px rgba(0,0,0,0.30) !important;
 }
+thead {
+       top: 34px;
+}
 thead td, thead th {
        background: #eee;
 }

diff --git a/designs/mvt/adminer.css b/designs/mvt/adminer.css
index dc8140251adfed13ac372f10adc0ce058a1b15f4..c61f7b40245a3d11bb58db3f9f5185f765d11b61 100644 (file)
--- a/designs/mvt/adminer.css
+++ b/designs/mvt/adminer.css
@@ -363,6 +363,10 @@ tbody tr:hover td, tbody tr:hover th {
        background: #edf4ff
 }
 
+thead {
+       top: 34px;
+}
+
 thead td, thead th {
        text-align: center;
        vertical-align: middle;

diff --git a/designs/nette/adminer.css b/designs/nette/adminer.css
index fc8d7503a7c0c3af2588fe1a8936dc896f78edad..0d1754e793c06238708a7222cfb9dde370492948 100644 (file)
--- a/designs/nette/adminer.css
+++ b/designs/nette/adminer.css
@@ -161,6 +161,10 @@ th, td {
        background: #CEE0FC;\r
 }\r
 \r
+thead {\r
+       top: 40px;\r
+}\r
+\r
 thead th, thead td {\r
        background: #F2EEE1;\r
        border-color: #D0CDC4;\r

diff --git a/designs/ng9/adminer.css b/designs/ng9/adminer.css
index 9c18a6e33f74541faefb29327127519f39efe48d..e89523aaa2383fd5639483c89e1199cc69326854 100644 (file)
--- a/designs/ng9/adminer.css
+++ b/designs/ng9/adminer.css
@@ -108,6 +108,10 @@ tbody tr:hover td,tbody tr:hover th{
        background:#edf4ff\r
 }\r
 \r
+thead {\r
+       top: 46px;\r
+}\r
+\r
 thead th, thead td {\r
        text-align:center;\r
        vertical-align:middle;\r

diff --git a/designs/pappu687/adminer.css b/designs/pappu687/adminer.css
index c6a3013f0e67611797b483df83e2efda68991ad9..448cf95ef4dd0def91eff1e2d0cd966aee3a6c45 100644 (file)
--- a/designs/pappu687/adminer.css
+++ b/designs/pappu687/adminer.css
@@ -140,6 +140,10 @@ tbody tr:hover td,tbody tr:hover th{
     background:#edf4ff\r
 }\r
 \r
+thead {\r
+       top: 50px;\r
+}\r
+\r
 thead th, thead td {\r
     text-align:center;\r
     vertical-align:middle;\r

diff --git a/designs/paranoiq/adminer.css b/designs/paranoiq/adminer.css
index a7730faebfe964a518da392315c36ce462f03219..3f34fe0c6fedfecfeb456f1e1774b87abba1ac7c 100644 (file)
--- a/designs/paranoiq/adminer.css
+++ b/designs/paranoiq/adminer.css
@@ -59,6 +59,8 @@ tr:first-child td, tr:first-child th {
     border-top-width: 0; }\r
 td:first-child, th:first-child {\r
     border-left-width: 0; }\r
+thead {\r
+       top: -1px; }\r
 thead td, thead th {\r
     background-color: #EEE;\r
     border: none;\r