Skip to content

Commit 5ced2a2

Browse files
committed
Fix banner-taskbar overlap with precise height and z-index
- Set fixed height of 48px for banner to prevent overlap - Reduced z-index to 9999 (below taskbar's 10000) - Adjusted padding to maintain visual balance - Added box-sizing: border-box for precise height control - Updated responsive heights: 44px (tablet), 40px (mobile)
1 parent 712758c commit 5ced2a2

File tree

1 file changed

+8
-4
lines changed

1 file changed

+8
-4
lines changed

frontend/src/components/ProofOfConceptBanner.css

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,15 @@
44
top: 0;
55
left: 0;
66
right: 0;
7-
z-index: 10001;
7+
z-index: 9999;
88
background: linear-gradient(135deg, #87CEEB, #4682B4);
99
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
1010
display: flex;
1111
align-items: center;
1212
justify-content: space-between;
13-
padding: 12px 24px;
13+
padding: 10px 24px;
14+
height: 48px;
15+
box-sizing: border-box;
1416
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
1517
animation: slideDown 0.3s ease-out;
1618
}
@@ -105,7 +107,8 @@
105107
/* Mobile Responsive */
106108
@media (max-width: 768px) {
107109
.poc-banner {
108-
padding: 10px 16px;
110+
padding: 8px 16px;
111+
height: 44px;
109112
}
110113

111114
.poc-banner-content {
@@ -131,7 +134,8 @@
131134

132135
@media (max-width: 480px) {
133136
.poc-banner {
134-
padding: 8px 12px;
137+
padding: 6px 12px;
138+
height: 40px;
135139
}
136140

137141
.poc-banner-text {

0 commit comments

Comments
 (0)