NexusRP Template Documentation

A comprehensive guide to the NexusRP FiveM server template. This documentation covers the design system, components, pages, and customization options.

Installation

Getting started with the NexusRP template is simple. Follow these steps:

1. Download the Template

Download or clone the template files to your local machine or web server.

2. File Requirements

The template uses CDN links for all dependencies, so no npm or build process is required:

• TailwindCSS - Utility-first CSS framework (CDN)
• Bootstrap Icons - Icon library (CDN)
• AOS - Animate On Scroll library (CDN)
• Google Fonts - Inter & Orbitron fonts (CDN)

3. Launch

Open index.html in your browser or deploy to your web server.

File Structure

The template follows an organized structure for easy navigation:

Color Palette

The template uses a carefully crafted dark theme with vibrant accent colors:

Primary Colors

Accent Colors

Dark Theme

Typography

The template uses two font families for visual hierarchy:

Font Classes

.font-display  → Orbitron (headings)
.font-body     → Inter (body text)

Spacing System

The template uses Tailwind's spacing scale. Common values used:

Buttons

The template includes several button styles:

Primary Button

<a href="#" class="btn-primary">
    <i class="bi bi-play-circle me-2"></i> Play Now
</a>

Button Variants

Cards

Various card components used throughout the template:

Feature Card

<div class="feature-card" data-aos="fade-up">
    <div class="feature-icon">
        <i class="bi bi-speedometer2"></i>
    </div>
    <h3 class="feature-title">Title</h3>
    <p class="feature-description">Description text</p>
</div>

Card Types

Navigation

The navigation is a fixed header with responsive mobile menu:

Desktop Navigation

<a href="index.html" class="nav-link">
    <i class="bi bi-house-door me-1"></i> Home
</a>
<a href="rules.html" class="nav-link active">
    <i class="bi bi-book me-1"></i> Rules
</a>

Mobile Navigation

<a href="index.html" class="mobile-nav-link">
    <i class="bi bi-house-door"></i> Home
</a>

Forms

Form styling used in the Contact page:

Form Elements

<div class="form-group">
    <label for="name" class="form-label">Your Name</label>
    <input type="text" id="name" class="form-input" placeholder="John Doe">
</div>

<textarea class="form-input form-textarea" rows="5"></textarea>

<select class="form-input">
    <option>Option 1</option>
</select>

Pages Overview

The template includes 6 fully designed pages:

Branding Customization

To rebrand the template for your server:

1. Server Name

Replace "NexusRP" throughout all HTML files:

Find: NexusRP
Replace: YourServerName

2. Logo

The logo is an icon-based design. To change it:

<div class="w-12 h-12 bg-gradient-to-br from-primary-500 to-accent-500 rounded-xl">
    <i class="bi bi-controller"></i>  <!-- Change icon here -->
</div>

3. Colors

Modify the Tailwind config in each HTML file:

tailwind.config = {
    theme: {
        extend: {
            colors: {
                primary: { 
                    400: '#YOUR_COLOR',
                    500: '#YOUR_COLOR',
                    // ...
                }
            }
        }
    }
}

Also update CSS variables in style.css:

:root {
    --primary-400: #8093f8;
    --primary-500: #6366f1;
    --accent-500: #f43f5e;
    // ...
}

Content Customization

Hero Section

Update the hero in index.html:

• Change the title and subtitle text
• Update the statistics (players, uptime)
• Replace hero.jpeg with your own background

Features

Modify the features section with your server's unique offerings.

Rules

Edit pages/rules.html to match your server's rules.

Team

Update team members in pages/about.html with real staff info.

Links & URLs

Important URLs to update:

License & Copyright

Terms of Use

Purchase Information

Any other source distributing this template is unauthorized and potentially illegal. If you obtained this template from anywhere other than CodeStrike.STORE, please report it.

Need Help?

If you need assistance with customization or have questions about the template:

• Review this documentation thoroughly
• Check the style.css file for all available classes
• Study the HTML structure of each page
• Contact support at codestrike.store

NexusRP Template v1.0.0 — Made with ❤️ by illusion @ CodeStrike.STORE