Improve styling for images and sponsor section presentation
Update CSS to fix image display issues, adjust the sponsors section layout, and resolve minor styling inconsistencies. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 8702cea6-5379-4542-9446-7e71f9f057ab Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 8201fba5-a9b5-45f9-8405-e7872874ad43 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/705de26f-a3c1-41e6-845d-88f96627134c/8702cea6-5379-4542-9446-7e71f9f057ab/ejKynqE Replit-Helium-Checkpoint-Created: true
This commit is contained in:
ka-official
@@ -4534,6 +4534,74 @@ header.main-header .header-sticky.active{
|
|||||||
color: var(--accent-color);
|
color: var(--accent-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/************************************/
|
||||||
|
/*** 35b. Sponsors Section ***/
|
||||||
|
/************************************/
|
||||||
|
|
||||||
|
.our-sponsors-section{
|
||||||
|
padding: 70px 0 60px;
|
||||||
|
background-color: var(--white-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors-logo-grid{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 40px;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsor-logo-item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px solid var(--dark-divider-color);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 20px 30px;
|
||||||
|
transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out;
|
||||||
|
min-width: 200px;
|
||||||
|
max-width: 260px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsor-logo-item:hover{
|
||||||
|
box-shadow: 0 8px 30px rgba(0,0,0,0.10);
|
||||||
|
transform: translateY(-3px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsor-logo-item img{
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100px;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
object-fit: contain;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors-footer{
|
||||||
|
text-align: center;
|
||||||
|
max-width: 600px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors-footer p{
|
||||||
|
margin: 0;
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors-footer p a{
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--accent-color);
|
||||||
|
text-decoration: underline;
|
||||||
|
transition: all 0.3s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors-footer p a:hover{
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
|
||||||
/************************************/
|
/************************************/
|
||||||
/*** 36. responsive css ***/
|
/*** 36. responsive css ***/
|
||||||
/************************************/
|
/************************************/
|
||||||
@@ -5542,6 +5610,24 @@ header.main-header .header-sticky.active{
|
|||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.our-sponsors-section{
|
||||||
|
padding: 40px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors-logo-grid{
|
||||||
|
gap: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsor-logo-item{
|
||||||
|
min-width: 140px;
|
||||||
|
max-width: 180px;
|
||||||
|
padding: 15px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsor-logo-item img{
|
||||||
|
max-height: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
.mission-img{
|
.mission-img{
|
||||||
padding: 0 0 60px 60px;
|
padding: 0 0 60px 60px;
|
||||||
}
|
}
|
||||||
|
|||||||
67
index.html
67
index.html
@@ -337,7 +337,7 @@
|
|||||||
<!-- Mission Image Start -->
|
<!-- Mission Image Start -->
|
||||||
<div class="mission-img">
|
<div class="mission-img">
|
||||||
<figure class="image-anime reveal">
|
<figure class="image-anime reveal">
|
||||||
<img src="images/about.gif" style="width: 450px; height: 750px;" alt="">
|
<img src="images/about.gif" alt="">
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
<!-- Mission Image End -->
|
<!-- Mission Image End -->
|
||||||
@@ -451,73 +451,36 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- Service Ticker End -->
|
<!-- Service Ticker End -->
|
||||||
|
|
||||||
<p></p>
|
<!-- Sponsors Section Start -->
|
||||||
<p></p>
|
<div class="our-sponsors-section">
|
||||||
|
|
||||||
<!-- Our Ministries Section Start -->
|
|
||||||
<div class="our-ministries">
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row section-row">
|
<div class="row section-row">
|
||||||
<!-- Section Title Start -->
|
|
||||||
<div class="section-title">
|
<div class="section-title">
|
||||||
<h3 class="wow fadeInUp">Our Sponsors</h3>
|
<h3 class="wow fadeInUp">Our Sponsors</h3>
|
||||||
<h2 class="text-anime-style-2" data-cursor="-opaque">Our Proud <span>Sponsors</span></h2>
|
<h2 class="text-anime-style-2" data-cursor="-opaque">Our Proud <span>Sponsors</span></h2>
|
||||||
</div>
|
</div>
|
||||||
<!-- Section Title End -->
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="service-single-slider">
|
<div class="sponsors-logo-grid wow fadeInUp" data-wow-delay="0.25s">
|
||||||
<div class="swiper">
|
<div class="sponsor-logo-item">
|
||||||
<div class="swiper-wrapper">
|
<img src="images/ncca.jpg" alt="NCCA">
|
||||||
<!-- Service Image Slide Start -->
|
|
||||||
<div class="swiper-slide">
|
|
||||||
<div class="service-slider-image">
|
|
||||||
<figure>
|
|
||||||
<img src="images/ncca.jpg"" alt="">
|
|
||||||
</figure>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="sponsor-logo-item">
|
||||||
|
<img src="images/hit-fantasy.jpg" alt="Hit Fantasy">
|
||||||
</div>
|
</div>
|
||||||
<!-- Service Image Slide End -->
|
<div class="sponsor-logo-item">
|
||||||
|
<img src="images/srisports.png" alt="Sri Sports">
|
||||||
<!-- Service Image Slide Start -->
|
|
||||||
<div class=" swiper-slide">
|
|
||||||
<div class="service-slider-image">
|
|
||||||
<figure>
|
|
||||||
<img src="images/hit-fantasy.jpg" alt="">
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Service Image Slide End -->
|
|
||||||
|
|
||||||
<!-- Service Image Slide Start -->
|
|
||||||
<div class="swiper-slide">
|
|
||||||
<div class="service-slider-image">
|
|
||||||
<figure>
|
|
||||||
<img src="images/srisports.png" style="width: 1200px; height: 1200px;" alt="">
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Service Image Slide End -->
|
|
||||||
</div>
|
|
||||||
<div class="service-single-btn">
|
|
||||||
<div class="service-single-button-prev"></div>
|
|
||||||
<div class="service-single-button-next"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-lg-12">
|
<div class="sponsors-footer wow fadeInUp" data-wow-delay="0.5s">
|
||||||
<div class="our-ministries-footer wow fadeInUp" data-wow-delay="0.75s">
|
<p>We sincerely thank all of our sponsors who have allowed our community to function.
|
||||||
<p> We sincerely thank all of our sponsors who have allowed our community to function.
|
Their support enables teams to join with no barrier to entry.
|
||||||
Their support enables teams to join with no barrier to entry. <a href="/sponsors.html">View
|
<a href="/sponsors.html">View All Our Sponsors</a></p>
|
||||||
All
|
|
||||||
Our Sponsors</a></p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<!-- Sponsors Section End -->
|
||||||
</div>
|
|
||||||
<!-- Our Ministries Section End -->
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import express, { type Request, Response, NextFunction } from "express";
|
|||||||
import { registerRoutes } from "./routes";
|
import { registerRoutes } from "./routes";
|
||||||
import { serveStatic } from "./static";
|
import { serveStatic } from "./static";
|
||||||
import { createServer } from "http";
|
import { createServer } from "http";
|
||||||
|
import path from "path";
|
||||||
|
|
||||||
const app = express();
|
const app = express();
|
||||||
const httpServer = createServer(app);
|
const httpServer = createServer(app);
|
||||||
@@ -22,6 +23,10 @@ app.use(
|
|||||||
|
|
||||||
app.use(express.urlencoded({ extended: false }));
|
app.use(express.urlencoded({ extended: false }));
|
||||||
|
|
||||||
|
// Serve static HTML files and assets from the project root directory
|
||||||
|
// This enables index.html, about.html, css/, images/, js/ etc. to be accessible
|
||||||
|
app.use(express.static(path.resolve(import.meta.dirname, "..")));
|
||||||
|
|
||||||
export function log(message: string, source = "express") {
|
export function log(message: string, source = "express") {
|
||||||
const formattedTime = new Date().toLocaleTimeString("en-US", {
|
const formattedTime = new Date().toLocaleTimeString("en-US", {
|
||||||
hour: "numeric",
|
hour: "numeric",
|
||||||
|
|||||||
Reference in New Issue
Block a user