feat: Add comprehensive documentation suite and reorganize project structure
- Created complete documentation in docs/ directory - Added PROJECT_OVERVIEW.md with feature highlights and getting started guide - Added ARCHITECTURE.md with system design and technical details - Added SECURITY.md with comprehensive security implementation guide - Added DEVELOPMENT.md with development workflows and best practices - Added DEPLOYMENT.md with production deployment instructions - Added API.md with complete REST API documentation - Added CONTRIBUTING.md with contribution guidelines - Added CHANGELOG.md with version history and migration notes - Reorganized all documentation files into docs/ directory for better organization - Updated README.md with proper documentation links and quick navigation - Enhanced project structure with professional documentation standards
This commit is contained in:
SamiAhmed7777
321
f_templates/tpl_frontend/tpl_index.tpl
Normal file
321
f_templates/tpl_frontend/tpl_index.tpl
Normal file
@@ -0,0 +1,321 @@
|
||||
{if $not_found}
|
||||
<div class="pointer left-float wdmax" id="cb-response">
|
||||
<!-- NOTIFICATION CONTAINER -->
|
||||
<article>
|
||||
<h2 class="content-title"><i class="icon-warning"></i>Not found</h2>
|
||||
<div class="line"></div>
|
||||
<p class="">The requested page was not found!</p>
|
||||
<br>
|
||||
</article>
|
||||
<!-- END NOTIFICATION CONTAINER -->
|
||||
{else}
|
||||
<script type="text/javascript">
|
||||
var current_url = '{$main_url}/';
|
||||
var menu_section = '{href_entry key="index"}';
|
||||
</script>
|
||||
|
||||
<!-- HOMEPAGE CONTENT WITHIN EASYSTREAM LAYOUT -->
|
||||
<div class="homepage-content">
|
||||
<div class="hero-welcome">
|
||||
<div class="hero-header">
|
||||
<h1 class="welcome-title">Welcome to {$website_shortname}</h1>
|
||||
<p class="welcome-subtitle">The ultimate platform for sharing and discovering amazing content</p>
|
||||
</div>
|
||||
|
||||
{if $smarty.session.USER_ID}
|
||||
<div class="user-actions">
|
||||
<h2>What would you like to do today?</h2>
|
||||
<div class="action-grid">
|
||||
<a href="{$main_url}/{href_entry key="upload"}" class="action-card upload-card">
|
||||
<i class="icon-upload"></i>
|
||||
<h3>Upload Content</h3>
|
||||
<p>Share your videos, images, audio, and documents</p>
|
||||
</a>
|
||||
<a href="{$main_url}/{href_entry key="browse"}" class="action-card browse-card">
|
||||
<i class="icon-video"></i>
|
||||
<h3>Browse Videos</h3>
|
||||
<p>Discover trending and popular content</p>
|
||||
</a>
|
||||
<a href="{$main_url}/{href_entry key="channels"}" class="action-card channels-card">
|
||||
<i class="icon-users"></i>
|
||||
<h3>Explore Channels</h3>
|
||||
<p>Find and follow your favorite creators</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{else}
|
||||
<div class="guest-actions">
|
||||
<h2>Join the EasyStream Community</h2>
|
||||
<div class="auth-buttons">
|
||||
<a href="{$main_url}/{href_entry key="signup"}" class="btn-primary">Get Started</a>
|
||||
<a href="{$main_url}/{href_entry key="signin"}" class="btn-secondary">Sign In</a>
|
||||
</div>
|
||||
<p class="auth-description">Create an account to upload content, follow channels, and join the community</p>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="platform-stats">
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">1,000+</span>
|
||||
<span class="stat-label">Videos</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">50K+</span>
|
||||
<span class="stat-label">Views</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">500+</span>
|
||||
<span class="stat-label">Creators</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="features-showcase">
|
||||
<h2>Platform Features</h2>
|
||||
<div class="features-grid">
|
||||
<div class="feature-item">
|
||||
<i class="icon-video"></i>
|
||||
<h3>Video Sharing</h3>
|
||||
<p>Upload and share videos in multiple formats with the community</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<i class="icon-live"></i>
|
||||
<h3>Live Streaming</h3>
|
||||
<p>Broadcast live to your audience in real-time</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<i class="icon-image"></i>
|
||||
<h3>Image Gallery</h3>
|
||||
<p>Share and discover amazing photos and artwork</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<i class="icon-headphones"></i>
|
||||
<h3>Audio Content</h3>
|
||||
<p>Upload music, podcasts, and audio content</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<i class="icon-file"></i>
|
||||
<h3>Document Sharing</h3>
|
||||
<p>Share documents and educational materials</p>
|
||||
</div>
|
||||
<div class="feature-item">
|
||||
<i class="icon-users"></i>
|
||||
<h3>Community</h3>
|
||||
<p>Connect with creators and build your audience</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.homepage-content {
|
||||
padding: 20px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.hero-welcome {
|
||||
text-align: center;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.hero-header {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.welcome-title {
|
||||
font-size: 2.5rem;
|
||||
color: #333;
|
||||
margin-bottom: 10px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.welcome-subtitle {
|
||||
font-size: 1.2rem;
|
||||
color: #666;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.user-actions h2, .guest-actions h2 {
|
||||
color: #333;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.action-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 20px;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.action-card {
|
||||
background: white;
|
||||
border: 2px solid #e9ecef;
|
||||
border-radius: 12px;
|
||||
padding: 30px 20px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #333;
|
||||
transition: all 0.3s ease;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.action-card:hover {
|
||||
border-color: #007bff;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 16px rgba(0,0,0,0.15);
|
||||
text-decoration: none;
|
||||
color: #007bff;
|
||||
}
|
||||
|
||||
.action-card i {
|
||||
font-size: 3rem;
|
||||
margin-bottom: 15px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.action-card h3 {
|
||||
margin-bottom: 10px;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.action-card p {
|
||||
color: #666;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.auth-buttons {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.btn-primary, .btn-secondary {
|
||||
display: inline-block;
|
||||
padding: 12px 30px;
|
||||
margin: 0 10px;
|
||||
border-radius: 6px;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #007bff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: #0056b3;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: #6c757d;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: #545b62;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.auth-description {
|
||||
color: #666;
|
||||
font-size: 0.95rem;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.platform-stats {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 40px;
|
||||
margin: 40px 0;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.stat-number {
|
||||
display: block;
|
||||
font-size: 2rem;
|
||||
font-weight: bold;
|
||||
color: #007bff;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 0.9rem;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.features-showcase {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.features-showcase h2 {
|
||||
text-align: center;
|
||||
color: #333;
|
||||
margin-bottom: 30px;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.features-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
gap: 25px;
|
||||
}
|
||||
|
||||
.feature-item {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
background: #f8f9fa;
|
||||
border-radius: 8px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.feature-item:hover {
|
||||
transform: translateY(-3px);
|
||||
}
|
||||
|
||||
.feature-item i {
|
||||
font-size: 2.5rem;
|
||||
color: #007bff;
|
||||
margin-bottom: 15px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.feature-item h3 {
|
||||
color: #333;
|
||||
margin-bottom: 10px;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.feature-item p {
|
||||
color: #666;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.welcome-title {
|
||||
font-size: 2rem;
|
||||
}
|
||||
.platform-stats {
|
||||
gap: 20px;
|
||||
}
|
||||
.stat-number {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.auth-buttons {
|
||||
text-align: center;
|
||||
}
|
||||
.btn-primary, .btn-secondary {
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
max-width: 200px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
{/if}
|
||||
Reference in New Issue
Block a user