@hashtagcms/web-ui-kit 1.0.5

package/src/themes/basic/views/stories.blade.php

@@ -0,0 +1,55 @@
+@php
+    $results = $data['results'];
+    $hasData = count($results) > 0;
+@endphp
+
+<section class="section-blogs">
+    <div class="container">
+        <div class="row">
+            <div class="col-lg-9 col-6">
+                @if($hasData)
+                    @foreach($results as $index=>$story)
+                        <div class="card shadow blog">
+                            <div class="card-body">
+                                <div>
+                                    <div class="pull-right">
+                                    <span class="blog-date shadow-common">
+                                            <span class="fa fa-calendar-o icon"></span>
+                                            <span class="text">{{getFormattedDate($story['createdAt'])}}
+                                            </span>
+                                    </span>
+                                    </div>
+                                    <h2><a href="{{htcms_get_path($story['categoryLinkRewrite'].'/'.$story['linkRewrite'])}}">{{$story['title']}}</a></h2>
+                                </div>
+                                {!!  $story['description'] !!}
+
+                                <p class="more">
+                                    <a href="{{htcms_get_path($story['categoryLinkRewrite'].'/'.$story['linkRewrite'])}}">Read More</a>
+                                </p>
+                            </div>
+                            <div class="card-footer">
+                                <div class="pull-left author">
+                                   @if(!empty($story['author'])) Author: {{$story['author']}} @endif &nbsp;
+                                </div>
+                                <div class="pull-right">
+                                    <span class="fa fa-comment-o"></span> {{$story['commentsCount'] ?? 0}} Comments
+                                </div>
+                            </div>
+                        </div>
+                    @endforeach
+                @else
+                    <div class="card shadow blog">
+                        <div class="card-body">
+                            There is no post for now.
+                        </div>
+                    </div>
+                @endif
+            </div>
+            <div class="col-lg-3 col-6">
+                <div style="border: 1px solid #c3c3c3; background: #f3f3f3; width: 350px; height: 250px; padding:5px">
+                    Ad Content
+                </div>
+            </div>
+        </div>
+    </div>
+</section>

package/src/themes/basic/views/story-comments.blade.php

@@ -0,0 +1,56 @@
+@if(isset($isBlogHome) && $isBlogHome == 1)
+
+@else
+    @php
+        $commentsCount = isset($data) ? sizeof($data) : 0;
+        $hasComments =  $commentsCount > 0;
+    @endphp
+    <section class="section-comments">
+        <div class="container">
+            @if($hasComments)
+                <hr/>
+                <fieldset>
+                    <legend>
+                        <h3>Comments <span class="badge badge-dark">{{$commentsCount}}</span></h3>
+                    </legend>
+                    <div class="row mb-3 mt-3">
+                        <div class="col-lg-12 text-right mt-1">
+
+                        </div>
+                    </div>
+                    @foreach($data as $comment)
+                        <div class="row">
+                            <div class="col-lg-2 mb-5 text-center image-column">
+                                <div class="rounded-circle image" style="width:75px;height:75px">
+                                    @php
+                                        $email = md5($comment['email']);
+                                    @endphp
+                                    <img src="https://www.gravatar.com/avatar/{{$email}}?d=&s=75}}" />
+                                </div>
+                                <span class="author">
+                            {{$comment['name']}}
+                        </span>
+                                <span class="said">said on</span>
+                                <span class="date"><span class="fa fa-calendar-o"></span> {{getFormattedDate($comment['created_at'])}}</span>
+                            </div>
+                            <div class="col-lg-6">
+                                <div style="" class="" role="tooltip" x-placement="right">
+                                    <div class="arrow" style="top: 16px;"></div>
+                                    <h3 class="popover-header"></h3>
+                                    <div class="popover-body">{{$comment['comment']}}
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    @endforeach
+                </fieldset>
+            @else
+            <legend style="margin-bottom: 100px; display: none">
+            <span class="first-text">
+                Be the first to write a comment.
+            </span>
+                </legend>
+            @endif
+        </div>
+    </section>
+@endif

package/src/themes/basic/views/story.blade.php

@@ -0,0 +1,103 @@
+
+<section class="section-blogs">
+    <div class="container">
+        @if(isset($data) && count($data) > 0)
+            @php
+                $data = $data[0];
+                $hasContent = true;
+                $categoryId = $data['category_id'];
+                $contentId = $data['id'];
+
+                $storyObj = htcms_get_shared_data('MODULE_STORY');
+                $title = isset($storyObj) ? $storyObj[0]['name'] : htcms_get_category_info('name');
+            @endphp
+            <h1>{{$title}}</h1>
+            {!! $data['page_content'] !!}
+        @else
+            @php
+                $hasContent = false;
+            @endphp
+
+        @endif
+    </div>
+</section>
+
+@php
+    $user = auth()->user();
+    if($user != null) {
+        $name = $user->name. " ".$user->last_name;
+        $email = $user->email;
+    } else {
+        $name = "";
+        $email = "";
+    }
+    $name = old("name", $name);
+    $email = old("email", $email);
+    $comment = old("comment");
+    $sessionResults = session('results');
+    $successMessage = $sessionResults['message'] ?? "";
+@endphp
+
+
+@if($hasContent)
+    @if($data['enable_comments'] == 1)
+        <section class="section-comments">
+            <div class="container">
+                <h2>Post Comments</h2>
+                <form class="comment-form relative" action="/comment/saveComment" method="post">
+                    @csrf
+                    <input type="hidden" name="category_id" value="{{$categoryId}}" />
+                    <input type="hidden" name="page_id" value="{{$contentId}}" />
+                    <div class="row mb-3">
+                        <div class="col-sm-2">
+                            <label for="_htcms_form_comment_name_">Name</label>
+                        </div>
+                        <div class="col-sm-10">
+                            <input id="_htcms_form_comment_name_" name="name" type="text" class="form-control" required placeholder="Please enter your name" value="{{$name}}" />
+                        </div>
+                        <div class="text text-danger"></div>
+                    </div>
+                    <div class="row mb-3">
+                        <div class="col-sm-2">
+                            <label for="_htcms_form_comment_email_">Email</label>
+                        </div>
+                        <div class="col-sm-10">
+                            <input id="_htcms_form_comment_email_" type="email" name="email" class="form-control" required placeholder="Please enter your email  " value="{{$email}}" />
+                        </div>
+                        <div class="text text-danger"></div>
+                    </div>
+                    <div class="row mb-3">
+                        <div class="col-sm-2">
+                            <label for="_htcms_form_comment_comment_">Comment</label>
+                        </div>
+                        <div class="col-sm-10">
+                            <textarea id="_htcms_form_comment_comment_" name="comment" class="form-control" rows="7">{{$comment}}</textarea>
+                            <div class="text text-danger"></div>
+                        </div>
+                    </div>
+                    <div class="row mb-3">
+                        <div class="col-sm-2">
+
+                        </div>
+                        <div class="col-sm-10 text-center">
+                            <button class="btn btn-lg btn-outline-secondary mb-1" type="submit">Submit</button>
+                            <div class="alert text-success">
+                                {{$successMessage}}
+                            </div>
+
+                            @if ($errors->any())
+                                <div class="alert alert-danger">
+                                    <ul>
+                                        @foreach ($errors->all() as $error)
+                                            <li>{{ $error }}</li>
+                                        @endforeach
+                                    </ul>
+                                </div>
+                            @endif
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </section>
+    @endif
+@endif

package/src/themes/basic/views/subscribe.blade.php

@@ -0,0 +1,23 @@
+<section class="section-subscribe">
+    <div class="container">
+        <div class="row justify-content-center">
+            <div class="col-lg-6 text-center">
+                <h2 class="newsletter-title">{{____("hashtagcms::modules.Subscribe to our newsletter")}}</h2>
+                <p class="newsletter-subtitle">{{____("hashtagcms::modules.Please leave us your email address. We will update you.")}}</p>
+                <form data-form="newsletter-form" class="newsletter-form relative newsletter-form" action="/common/newsletter" method="post" onsubmit="return HashtagCms.Newsletter.newsletterNow(this)">
+                    <div class="row">
+                        <div class="col-8" style="padding: 0; margin: 0">
+                                <input type="email" name="email" class="form-control input " placeholder="{{____("hashtagcms::auth.E-Mail Address")}}" required>
+                        </div>
+                        <div class="col-4">
+                            <button class="btn btn-lg btn-primary btn-block newsletter" type="submit">{{____("hashtagcms::auth.Submit")}}</button>
+                        </div>
+                        <div class="alert col-12 mt-2" data-message-holder="newsletter-message-holder" style="display: none; background-color: lightyellow; color:#000">
+                            <span class="message" data-class="newsletter-message"></span> <span data-class="newsletter-close" title="Close" class="pull-right pointer hand" style="background-color: #5f5f5f; color:#fff;padding:1px 5px">x</span>
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
+</section> <!-- end Newsletter -->

package/src/themes/elegant/js/app.js

@@ -0,0 +1,109 @@
+import { Analytics, Newsletter, AppConfig } from "@hashtagcms/web-sdk";
+
+
+window.HashtagCms = { configData: {} };
+window.HashtagCms.Newsletter = new Newsletter();
+window.HashtagCms.Subscribe = window.HashtagCms.Newsletter; // Legacy support
+window.HashtagCms.Analytics = new Analytics();
+window.HashtagCms.AppConfig = new AppConfig();
+
+/**
+ * Elegant Theme - Modern Tech Aesthetic
+ * 
+ * Features:
+ * - Smooth scroll animations
+ * - Parallax effects
+ * - Modern card interactions
+ * - Dynamic Navbar
+ */
+
+class ElegantTheme {
+    constructor() {
+        this.initNewsletter();
+        this.initSmoothScroll();
+        this.initParallax();
+        this.initCardAnimations();
+        this.initNavbar();
+        console.log('Elegant Theme loaded');
+    }
+
+    initNewsletter() {
+        // Newsletter is already initialized globally as window.HashtagCms.Newsletter
+    }
+
+    initNavbar() {
+        const navbar = document.querySelector('.navbar');
+        if (navbar) {
+            window.addEventListener('scroll', () => {
+                if (window.scrollY > 50) {
+                    navbar.classList.add('scrolled');
+                } else {
+                    navbar.classList.remove('scrolled');
+                }
+            });
+            // Initial check
+            if (window.scrollY > 50) {
+                navbar.classList.add('scrolled');
+            }
+        }
+    }
+
+    initSmoothScroll() {
+        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+            anchor.addEventListener('click', function (e) {
+                const href = this.getAttribute('href');
+                if (href && href !== '#' && href !== '#!') {
+                    e.preventDefault();
+                    const target = document.querySelector(href);
+                    if (target) {
+                        target.scrollIntoView({
+                            behavior: 'smooth',
+                            block: 'start'
+                        });
+                    }
+                }
+            });
+        });
+    }
+
+    initParallax() {
+        const parallaxElements = document.querySelectorAll('.parallax');
+
+        if (parallaxElements.length > 0) {
+            window.addEventListener('scroll', () => {
+                const scrolled = window.pageYOffset;
+
+                parallaxElements.forEach(element => {
+                    const speed = element.dataset.speed || 0.5;
+                    element.style.transform = `translateY(${scrolled * speed}px)`;
+                });
+            });
+        }
+    }
+
+    initCardAnimations() {
+        const cards = document.querySelectorAll('.feature-card, .tech-card, .card'); // Added generic .card
+
+        if (cards.length > 0) {
+            const observer = new IntersectionObserver((entries) => {
+                entries.forEach(entry => {
+                    if (entry.isIntersecting) {
+                        entry.target.classList.add('animate-in');
+                        observer.unobserve(entry.target); // Only animate once
+                    }
+                });
+            }, {
+                threshold: 0.1
+            });
+
+            cards.forEach(card => observer.observe(card));
+        }
+    }
+}
+
+// Initialize theme when DOM is ready
+if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', () => new ElegantTheme());
+} else {
+    new ElegantTheme();
+}