Skip to content

AnuragWattsLSQ.html #3791

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
367 changes: 329 additions & 38 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,40 +1,331 @@
<!doctype html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

<title>reveal.js</title>

<link rel="stylesheet" href="dist/reset.css">
<link rel="stylesheet" href="dist/reveal.css">
<link rel="stylesheet" href="dist/theme/black.css">

<!-- Theme used for syntax highlighted code -->
<link rel="stylesheet" href="plugin/highlight/monokai.css">
</head>
<body>
<div class="reveal">
<div class="slides">
<section>Slide 1</section>
<section>Slide 2</section>
</div>
</div>

<script src="dist/reveal.js"></script>
<script src="plugin/notes/notes.js"></script>
<script src="plugin/markdown/markdown.js"></script>
<script src="plugin/highlight/highlight.js"></script>
<script>
// More info about initialization & config:
// - https://revealjs.com/initialization/
// - https://revealjs.com/config/
Reveal.initialize({
hash: true,

// Learn about plugins: https://revealjs.com/plugins/
plugins: [ RevealMarkdown, RevealHighlight, RevealNotes ]
});
</script>
</body>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LeadSquared Government Sector Strategy</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/css/all.min.css">
<style>
/* All your existing styles */
body {
margin: 0;
padding: 0;
overflow: hidden;
background-color: #f0f4f8;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.slide-container {
width: 1280px;
min-height: 720px;
margin: 0 auto;
background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
overflow: hidden;
position: relative;
}
.gradient-accent {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 8px;
background: linear-gradient(90deg, #1e40af 0%, #3b82f6 50%, #f97316 100%);
}
.slide-number {
position: absolute;
bottom: 20px;
right: 30px;
font-size: 14px;
color: #94a3b8;
}
.accent-text {
color: #f97316;
}
.blue-text {
color: #2563eb;
}
.bg-pattern {
position: absolute;
bottom: 0;
right: 0;
width: 380px;
height: 380px;
background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%232563eb' fill-opacity='0.05' fill-rule='evenodd'/%3E%3C/svg%3E");
opacity: 0.8;
z-index: 0;
}
.logo {
position: absolute;
top: 30px;
left: 40px;
font-weight: bold;
font-size: 24px;
z-index: 10;
}

/* Navigation styles */
.nav-buttons {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 10px;
z-index: 20;
}
.nav-button {
background-color: #e5e7eb;
color: #4b5563;
border: none;
border-radius: 4px;
padding: 8px 16px;
font-size: 14px;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
align-items: center;
}
.nav-button:hover:not(:disabled) {
background-color: #3b82f6;
color: white;
}
.nav-button:disabled {
opacity: 0.5;
cursor: not-allowed;
}

/* Slide styles */
.slide {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.slide.active {
display: block;
}

/* Responsive design for different screen sizes */
@media (max-width: 1300px) {
.slide-container {
width: 100%;
height: 100vh;
}
}
</style>
</head>
<body>
<div class="slide-container">
<div class="gradient-accent"></div>
<div class="bg-pattern"></div>

<div class="logo">
<span class="blue-text">Lead</span><span class="accent-text">Squared</span>
</div>

<!-- Slide 1: Cover Slide -->
<div id="slide-1" class="slide active">
<div class="flex flex-col justify-center items-center h-full px-24 z-10 relative">
<div class="text-center mb-10">
<h1 class="text-5xl font-bold mb-6">
<span class="blue-text">Building LeadSquared's</span>
<span class="accent-text"> Government & Public Sector</span>
<span class="blue-text"> Business</span>
</h1>
<p class="text-xl text-gray-600 mt-4">Strategic Roadmap for Market Entry & Growth</p>

<div class="w-24 h-1 bg-gradient-to-r from-blue-600 to-orange-500 mx-auto my-8"></div>
</div>

<div class="grid grid-cols-3 gap-8 text-center mt-8">
<div class="bg-white p-6 rounded-lg shadow-md transform transition-transform hover:scale-105">
<div class="text-blue-600 text-4xl mb-4">
<i class="fas fa-chart-line"></i>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-2">Market Opportunity</h3>
<p class="text-gray-600">Tapping into India's growing public sector digitization initiatives</p>
</div>

<div class="bg-white p-6 rounded-lg shadow-md transform transition-transform hover:scale-105">
<div class="text-orange-500 text-4xl mb-4">
<i class="fas fa-bullseye"></i>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-2">Strategic Approach</h3>
<p class="text-gray-600">Customized solutions for government workflows & citizen engagement</p>
</div>

<div class="bg-white p-6 rounded-lg shadow-md transform transition-transform hover:scale-105">
<div class="text-blue-600 text-4xl mb-4">
<i class="fas fa-bolt"></i>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-2">Action Plan</h3>
<p class="text-gray-600">Targeting active tenders & building a sustainable growth roadmap</p>
</div>
</div>

<div class="mt-12 text-gray-500 text-lg">
Prepared for: Executive Leadership Team
</div>
</div>
</div>

<!-- Slide 2: Introduction -->
<div id="slide-2" class="slide">
<div class="flex flex-col p-16 h-full z-10 relative">
<h2 class="section-title">Introduction</h2>

<div class="grid grid-cols-2 gap-10 mt-4">
<div class="pr-8">
<div class="bg-white p-6 rounded-lg shadow-lg mb-8">
<h3 class="text-xl font-semibold mb-3 blue-text">
<i class="fas fa-building mr-2"></i> About LeadSquared
</h3>
<ul class="space-y-3 text-gray-700">
<li class="flex items-start">
<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
<span>SaaS platform providing end-to-end sales, marketing, and onboarding automation</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
<span>Achieved unicorn status in 2022 with $1 billion valuation</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
<span>Established presence across Education, Healthcare, BFSI, and Real Estate sectors</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
<span>Known for verticalized, industry-specific solutions</span>
</li>
</ul>
</div>

<div class="bg-white p-6 rounded-lg shadow-lg">
<h3 class="text-xl font-semibold mb-3 accent-text">
<i class="fas fa-bullseye mr-2"></i> Purpose of This Strategy
</h3>
<p class="text-gray-700 mb-4">
To outline a comprehensive approach for LeadSquared to enter and expand within India's government and public sector market, leveraging our existing strengths while addressing unique public sector requirements.
</p>
</div>
</div>

<div>
<div class="bg-gradient-to-br from-blue-50 to-orange-50 p-6 rounded-lg shadow-lg mb-6">
<h3 class="text-xl font-semibold mb-3 blue-text">
<i class="fas fa-lightbulb mr-2"></i> The Opportunity
</h3>
<p class="text-gray-700 mb-4">
India's government sector represents a significant untapped market for LeadSquared's CRM and marketing automation solutions.
</p>

<div class="bg-white p-4 rounded-md shadow-inner mb-4">
<h4 class="font-semibold text-gray-800 mb-2">Market Indicators</h4>
<div class="flex items-center mb-3">
<div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center mr-4">
<i class="fas fa-chart-line text-blue-600 text-xl"></i>
</div>
<div>
<p class="font-medium">Digital India initiative driving e-governance transformation</p>
</div>
</div>
<div class="flex items-center mb-3">
<div class="w-12 h-12 rounded-full bg-orange-100 flex items-center justify-center mr-4">
<i class="fas fa-gavel text-orange-500 text-xl"></i>
</div>
<div>
<p class="font-medium">Active tenders for CRM solutions across government agencies</p>
</div>
</div>
<div class="flex items-center">
<div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center mr-4">
<i class="fas fa-users text-blue-600 text-xl"></i>
</div>
<div>
<p class="font-medium">Growing demand for citizen engagement platforms</p>
</div>
</div>
</div>
</div>

<div class="bg-white p-6 rounded-lg border-l-4 border-blue-500 shadow-lg">
<h3 class="text-xl font-semibold mb-2 text-gray-800">Why Now?</h3>
<p class="text-gray-700">
The convergence of Digital India initiatives, increased public sector tech spending, and growing citizen expectations creates an optimal entry point for LeadSquared's solutions in the government sector.
</p>
</div>
</div>
</div>
</div>
</div>

<!-- Add more slides here... -->

<!-- Navigation buttons -->
<div class="nav-buttons">
<button id="prev-button" class="nav-button" onclick="prevSlide()"><i class="fas fa-arrow-left mr-2"></i> Previous</button>
<button id="next-button" class="nav-button" onclick="nextSlide()">Next <i class="fas fa-arrow-right ml-2"></i></button>
</div>

<div id="slide-counter" class="slide-number">1 / 20</div>
</div>

<script>
// Slide navigation logic
let currentSlide = 1;
const totalSlides = 2; // Update this number as you add more slides

function updateNavigation() {
// Update slide counter
document.getElementById('slide-counter').textContent = `${currentSlide} / ${totalSlides}`;

// Disable/enable navigation buttons
document.getElementById('prev-button').disabled = currentSlide === 1;
document.getElementById('next-button').disabled = currentSlide === totalSlides;
}

function showSlide(slideNumber) {
// Hide all slides
document.querySelectorAll('.slide').forEach(slide => {
slide.classList.remove('active');
});

// Show the requested slide
document.getElementById(`slide-${slideNumber}`).classList.add('active');

// Update current slide number
currentSlide = slideNumber;

// Update navigation
updateNavigation();
}

function nextSlide() {
if (currentSlide < totalSlides) {
showSlide(currentSlide + 1);
}
}

function prevSlide() {
if (currentSlide > 1) {
showSlide(currentSlide - 1);
}
}

// Add keyboard navigation
document.addEventListener('keydown', function(event) {
if (event.key === 'ArrowRight') {
nextSlide();
} else if (event.key === 'ArrowLeft') {
prevSlide();
}
});

// Initialize navigation
updateNavigation();
</script>
</body>
</html>