Merge pull request #211 from jenkinsci/theme-design

Adapt several Bootstrap components to Jenkins design language

Author: uhafner

src/main/webapp/css/jenkins-style.css

@@ -7,6 +7,20 @@
     --bs-nav-tabs-border-width: 0;
 }
 
+.pagination {
+    --bs-pagination-active-color: var(--text-color);
+    --bs-pagination-active-bg: var(--item-background--active);
+    --bs-pagination-active-border-color: var(--item-background--active);
+
+    --bs-pagination-hover-color: var(--link-color);
+    --bs-pagination-hover-bg: var(--item-background--hover);
+    --bs-pagination-hover-border-color: var(--item-background--hover);
+
+    --bs-link-color: var(--link-color);
+    --bs-pagination-bg: var(--background);
+    --bs-pagination-border-color: var(--item-background--hover);
+}
+
 .modal {
     --bs-modal-color: var(--text-color);
     --bs-modal-bg: var(--background);
@@ -106,23 +120,23 @@ pre {
     display: flex;
 }
 
-.tooltip-inner {
-    color: #fff;
-    background-color: rgba(0, 0, 0, 0.8);
-}
-
-.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before, .tooltip.bs-tooltip-top .arrow::before {
-    border-top-color: rgba(0, 0, 0, 0.8);
+.tooltip {
+    --bs-tooltip-opacity: 1;
+    --bs-tooltip-arrow-width: 0px;
+    --bs-tooltip-arrow-height: 0px;
+    --bs-tooltip-font-size: 550;
+    --bs-tooltip-color: var(--text-color);
+    --bs-tooltip-padding-x: 0.8rem;
+    --bs-tooltip-padding-y: 0.45rem;
+    --bs-tooltip-max-width: min(50vw, 1000px) !important;
+    --bs-tooltip-border-radius: 0.66rem;
+    --bs-tooltip-bg: #f8f9fa;
 }
 
-.tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before, .tooltip.bs-tooltip-right .arrow::before {
-    border-right-color: rgba(0, 0, 0, 0.8);
-}
-
-.tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .tooltip.bs-tooltip-bottom .arrow::before {
-    border-bottom-color: rgba(0, 0, 0, 0.8);
-}
-
-.tooltip.bs-tooltip-auto[x-placement^=left] .arrow::before, .tooltip.bs-tooltip-left .arrow::before {
-    border-left-color: rgba(0, 0, 0, 0.8);
+.tooltip-inner {
+    background-color: var(--background);
+    font-weight: 550;
+    font-size: 0.75rem;
+    backdrop-filter: contrast(0.6) brightness(2.4) saturate(2) blur(15px);
+    box-shadow: 0 0 8px 2px rgba(0,0,30,.05), 0 0 1px 1px rgba(0,0,20,.025), 0 10px 20px rgba(0,0,20,.15);
 }