Skip to content

Latest commit

 

History

8 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SentinelSec Launchpad

A modern, single-file HTML website for SentinelSec - Security solutions company providing digital security, penetration testing, and managed security services (MSSP).

Features

No Framework - Pure HTML, CSS, and JavaScript ✅ Single File - Everything in one index.html file ✅ Responsive - Mobile-friendly design ✅ Dark Theme - Professional cybersecurity aesthetic ✅ Smooth Animations - Scroll reveal effects ✅ Accordion Components - Expandable LGPD section ✅ Mobile Menu - Hamburger menu for mobile devices ✅ Modal Dialog - WhatsApp contact modal

Quick Start

Simply open the index.html file in your web browser. No build process, no dependencies, no setup required.

Local Development

# Using Python 3
python -m http.server 8000

# Using Node.js
npx http-server

# Using Live Server (VS Code extension)
# Open index.html and click "Go Live"

Then navigate to http://localhost:8000 (or your server port).

Project Structure

sentinelsec-launchpad/
├── index.html          # Complete website (single file)
├── README.md           # This file
└── public/
    └── robots.txt

Sections

  1. Navigation Bar - Fixed navbar with smooth scroll
  2. Hero Section - Main landing section with CTA buttons
  3. Problema Section - Problem statement with bullet points
  4. Solução Section - Solution overview
  5. Serviços Section - Service cards grid
  6. LGPD Section - Accordion component for compliance
  7. Autoridade Section - Expertise badges
  8. Contato Section - Contact CTA
  9. Footer - Footer with links
  10. Modal - WhatsApp contact modal

Customization

To modify content, edit the HTML in index.html:

  • Colors: Update CSS variables in :root (lines ~19-35)
  • Text Content: Edit text within section tags
  • WhatsApp Number: Update the phone number in WhatsApp links (currently 5511999999999)
  • Links: Modify URLs in navigation and footer

Color Variables

--primary: 217 91% 60%;           /* Main blue */
--background: 222 47% 6%;         /* Dark navy */
--foreground: 210 40% 96%;        /* Off-white text */
--secondary: 222 30% 14%;         /* Secondary dark */
--destructive: 0 84% 60%;         /* Red for alerts */

Browser Support

  • Chrome/Edge (latest)
  • Firefox (latest)
  • Safari (latest)
  • Mobile browsers (iOS Safari, Chrome Mobile)

Performance

  • Size: ~80KB (single HTML file with embedded styles and scripts)
  • Load Time: < 1 second on standard connections
  • No Build Process: Ready to deploy immediately
  • No External Dependencies: Only loads Google Fonts

Deployment

Static Hosting (Recommended)

  1. Netlify: Drag and drop index.html
  2. Vercel: Same as above
  3. GitHub Pages: Push to repository
  4. AWS S3 + CloudFront: Static hosting solution
  5. Cloudflare Pages: Free CDN hosting

Traditional Web Hosting

Upload index.html to your web server via FTP/SSH.

Docker (Optional)

FROM nginx:alpine
COPY index.html /usr/share/nginx/html/
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

SEO

The file includes proper meta tags for:

  • Open Graph (social media preview)
  • Meta description
  • Responsive viewport
  • Proper HTML structure

Analytics Integration

To add Google Analytics or other tracking, add the script before </body>:

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'GA_ID');
</script>

Accessibility

  • Semantic HTML structure
  • ARIA labels for interactive elements
  • Color contrast meets WCAG AA standards
  • Keyboard navigation support
  • Screen reader friendly

License

© 2026 SentinelSec. All rights reserved.

  • Edit files directly within the Codespace and commit and push your changes once you're done.

What technologies are used for this project?

This project is built with:

  • Vite
  • TypeScript
  • React
  • shadcn-ui
  • Tailwind CSS

How can I deploy this project?

Simply open Lovable and click on Share -> Publish.

Can I connect a custom domain to my Lovable project?

Yes, you can!

To connect a domain, navigate to Project > Settings > Domains and click Connect Domain.

Read more here: Setting up a custom domain

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages