feat: widgets and ai chat

apps/website/src/blog/students-analytics.md

@@ -21,16 +21,7 @@ The audience page as you already know allows you to view the students in your **
 
 <br />
 
-<video
-loop
-muted
-autoplay
-preload="auto"
-autoPictureInPicture
-class="rounded-md"
-src="https://assets.cdn.clsrio.com/blog/organisation-student-analytics.mp4"
-
-> </video>
+<video loop muted autoplay preload="auto" autoPictureInPicture class="rounded-md" src="https://assets.cdn.clsrio.com/blog/organisation-student-analytics.mp4"></video>
 
 ## Course Student Analytics
 
@@ -43,17 +34,7 @@ Further more, when you go into any course and go to the people tab, you can view
 
 <br />
 
-<video
-loop
-muted
-autoplay
-preload="auto"
-autoPictureInPicture
-class="rounded-md"
-src="https://assets.cdn.clsrio.com/blog/course-students-analytics.mp4"
-controls
-
-> </video>
+<video loop muted autoplay preload="auto" autoPictureInPicture class="rounded-md" src="https://assets.cdn.clsrio.com/blog/course-students-analytics.mp4" controls></video>
 
 ## What's Next?
 

apps/website/src/lib/components/features-section.svelte

@@ -1,34 +1,45 @@
 <script>
   import { BlurFade } from '@cio/ui/custom/animation/blurfade';
+  import Palette from '@lucide/svelte/icons/palette';
+  import Globe from '@lucide/svelte/icons/globe';
+  import Code2 from '@lucide/svelte/icons/code-2';
+  import Settings2 from '@lucide/svelte/icons/settings-2';
 
   const features = [
     {
-      icon: '🎨',
+      Icon: Palette,
+      iconBg: 'bg-rose-50',
+      iconColor: 'text-rose-600',
       title: 'Full Theming',
-      description:
-        "Match your brand exactly. Custom colors, fonts, logos, and layouts. Your learners will never know it's ClassroomIO under the hood.",
+      description: 'Pick the colors, fonts, and logo. Your brand shows up everywhere your learners look.',
       tags: ['Custom colors', 'Logo upload', 'Font control']
     },
     {
-      icon: '🌐',
+      Icon: Globe,
+      iconBg: 'bg-blue-50',
+      iconColor: 'text-blue-600',
       title: 'Custom Domain',
       description:
-        'Serve your LMS from learn.yourcompany.com. Full SSL, zero ClassroomIO branding. Just your platform, your way.',
+        'Host the LMS on learn.yourcompany.com with SSL included. No ClassroomIO branding anywhere on the page.',
       tags: ['SSL included', 'White label', 'DNS setup guide']
     },
     {
-      icon: '⚙️',
-      title: 'Deep LMS Customization',
+      Icon: Code2,
+      iconBg: 'bg-violet-50',
+      iconColor: 'text-violet-600',
+      title: 'Embed courses on your site',
       description:
-        'Modern codebase means any developer can go in and change anything. No Moodle plugin archaeology. No undocumented hacks.',
-      tags: ['Modern stack', 'Clean codebase', 'Extensible']
+        'Add one script tag to any page. Your courses render right there and send learners back to your LMS to enroll.',
+      tags: ['One-line script', 'Auto-styled', 'Links to your domain']
     },
     {
-      icon: '📊',
-      title: 'Manager Dashboards',
+      Icon: Settings2,
+      iconBg: 'bg-emerald-50',
+      iconColor: 'text-emerald-600',
+      title: 'Deep LMS Customization',
       description:
-        'See exactly where your team stands. Completion rates, overdue courses, certificate expiry dates, all in one view and exportable to CSV.',
-      tags: ['Team views', 'CSV export', 'Audit logs']
+        'The codebase is modern and readable. Your developers can change anything without fighting a plugin system.',
+      tags: ['Modern stack', 'Clean codebase', 'Extensible']
     }
   ];
 </script>
@@ -49,8 +60,10 @@
       {#each features as feature, i}
         <BlurFade delay={0.1 * i} once>
           <div class="rounded-2xl border border-gray-200 bg-white p-8 lg:p-9">
-            <div class="mb-5 flex h-12 w-12 items-center justify-center rounded-xl bg-blue-50 text-2xl">
-              {feature.icon}
+            <div
+              class="mb-5 flex h-12 w-12 items-center justify-center rounded-xl {feature.iconBg} {feature.iconColor}"
+            >
+              <feature.Icon class="h-6 w-6" strokeWidth={1.75} />
             </div>
             <h3 class="mb-2.5 text-xl font-medium tracking-tight">{feature.title}</h3>
             <p class="mb-5 text-sm leading-relaxed text-gray-500">{feature.description}</p>

apps/website/src/lib/components/footer.svelte

@@ -11,7 +11,7 @@
       <p class="mr-2 mb-5 text-sm leading-7 tracking-wide text-gray-600 lg:text-base lg:leading-7">
         The Open Source Learning Management System for Companies
         <br />
-        Nail your compliance training and your certification program.
+        The LMS for compliance training and certification programs.
       </p>
       <!-- <a
         href="https://www.producthunt.com/posts/classroomio?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-classroomio"

apps/website/src/lib/components/hero.svelte

@@ -21,8 +21,10 @@
 
       <BlurFade delay={0.1} once>
         <h1 class="mb-6 text-[clamp(2.4rem,4vw,3.4rem)] leading-[1.12] font-medium tracking-tight text-gray-950">
-          Nail your compliance training and your
-          <em class="text-blue-700 not-italic">certification program.</em>
+          The LMS for
+          <em class="text-blue-700 not-italic">compliance training</em>
+          and
+          <em class="text-blue-700 not-italic">certification programs.</em>
         </h1>
       </BlurFade>
 

apps/website/src/routes/+page.svelte

@@ -21,7 +21,7 @@
 <LearnerSection />
 <QuestionTypes />
 <!-- <AutomateSection /> -->
-<DeploySection />
+<!-- <DeploySection /> -->
 <EnterpriseSection />
 <Testimonial />
 <PageSignupCTA