Make the hero section brighter and center its text content
Adjusted CSS variables in `static/css/styles.css` to increase brightness of hr element and center-align text within `.hero-text-container`, `.hero-title`, and `.hero-description`. Also updated positioning and transform properties for `.hero-text-container`. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 5e584ab0-c340-4432-97ef-1972582b60e9 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: d21238ad-8e95-4779-8c03-ce66774f7dc0 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/d0a1d46d-d203-4308-bc6a-312ac7c0243b/5e584ab0-c340-4432-97ef-1972582b60e9/XuUfYJo
This commit is contained in:
@@ -370,7 +370,7 @@ hr {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
filter: grayscale(100%) brightness(0.55);
|
filter: grayscale(100%) brightness(0.65);
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-overlay {
|
.hero-overlay {
|
||||||
@@ -385,11 +385,13 @@ hr {
|
|||||||
|
|
||||||
.hero-text-container {
|
.hero-text-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 64px;
|
top: 50%;
|
||||||
left: 48px;
|
left: 50%;
|
||||||
right: 48px;
|
transform: translate(-50%, -50%);
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
max-width: 800px;
|
max-width: 800px;
|
||||||
|
width: 90%;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-title {
|
.hero-title {
|
||||||
@@ -398,7 +400,7 @@ hr {
|
|||||||
font-size: clamp(32px, 5vw, 56px);
|
font-size: clamp(32px, 5vw, 56px);
|
||||||
color: var(--white);
|
color: var(--white);
|
||||||
margin: 0 0 24px 0;
|
margin: 0 0 24px 0;
|
||||||
text-align: left;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-description {
|
.hero-description {
|
||||||
@@ -407,7 +409,7 @@ hr {
|
|||||||
color: var(--gray-300);
|
color: var(--gray-300);
|
||||||
line-height: 1.8;
|
line-height: 1.8;
|
||||||
margin: 0 0 20px 0;
|
margin: 0 0 20px 0;
|
||||||
text-align: left;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-description:last-child {
|
.hero-description:last-child {
|
||||||
@@ -1347,9 +1349,7 @@ span.emoji:hover::after {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.hero-text-container {
|
.hero-text-container {
|
||||||
bottom: 40px;
|
width: 90%;
|
||||||
left: 24px;
|
|
||||||
right: 24px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.hero-title {
|
.hero-title {
|
||||||
|
|||||||
Reference in New Issue
Block a user