General: Add marketing landing page for unauthenticated users#12287
Draft
General: Add marketing landing page for unauthenticated users#12287
General: Add marketing landing page for unauthenticated users#12287Conversation
Transplant the artemisapp.github.io landing page into the Angular app as standalone components. Unauthenticated visitors now see a full marketing page (hero, features, programming exercises, exams, CTA) instead of the minimal login prompt. - Add landing page components (hero, features, programming exercises, exams, CTA, footer, navbar, glowbar, visible-on-scroll directive) - Route unauthenticated users to landing page, keep login at /login - Add Inter Variable font via @fontsource-variable/inter - Add i18n translations (en/de) for all landing page content - Update auth guards and LTI components for new routing
# Conflicts: # package-lock.json # package.json
- Fix SAML2 post-login redirect to /sign-in instead of / (which is now the marketing landing page) - Fix logout redirect to /sign-in so expired-session feedback is shown - Fix image alt text to use translated strings via ArtemisTranslatePipe - Change below-fold images to loading="lazy" for performance - Add aria-label to mobile hamburger menu button - Fix LTI subscription leaks with filter(Boolean) + take(1)
- Switch canMatch to canActivate for authenticated user redirect to /courses - Center navbar links on screen using absolute positioning - Replace incorrect pytest, JUnit5, and Java SVG icons with correct Simple Icons versions - Set black body background and transparent page-wrapper to prevent white flash on landing page load
…avbar - Add PrimeNG popup menu with links to Student, Instructor, Admin, and Developer docs - Add EN/DE language toggle left of the Sign In button - Add documentation links to mobile menu - Rename nav-link class to landing-link to avoid Bootstrap collision
- Replace anchor links with smooth scrollIntoView navigation - Replace <a> tags with <span>/<button> to avoid Bootstrap hover styles - Add scroll-to-top on logo click - Fix footer bottom margin causing black gap
Replace the three separate feature sections (Features grid, Programming Exercises, Exams) with a single LandingFeatureShowcaseComponent that presents 7 primary features in a scroll-driven narrative with a sticky side navigation rail, scroll-triggered reveal animations, and active section tracking via IntersectionObserver. Tier 3 features (plagiarism detection, modeling, quizzes, etc.) appear in a compact grid below the main sequence. The navbar is simplified to Features + Documentation. All content is fully localized (EN/DE).
…ture
Split the single LandingFeatureShowcaseComponent into a multi-component
chaptered layout with 3 chapters (AI, Assessment, Platform), 11 feature
sections, a sticky contents rail, and reusable chapter intro/section
components. Fix active section tracking by using { read: ElementRef }
on viewChildren query.
github-actions
bot
added
tests
server
github-actions
bot
added
lti
- Add missing imageAlt i18n keys for quiz, modeling, lectures, communication, and integrity sections (EN + DE) - Change nav-brand and mobile menu spans to buttons for keyboard a11y - Convert menu item getters to computed() signals for reactivity - Remove double inject(TranslateService) in navbar - Query prefers-reduced-motion inline instead of at construction time
github-actions
bot
removed
documentation
config-change
- Convert glowColor getter to computed signal for consistency - Add type="button" to mobile sign-in button - Add rel="noreferrer" to all external links - Add prefers-reduced-motion support to hero and CTA components - Internationalize hero screenshot alt text
Resolve conflict in global.scss: keep both chat-history tooltip (from develop) and landing page dropdown styles (from PR).
End-to-End Test Results
Test Strategy: Two-phase execution
Overall: ❌ Phase 2 (remaining tests) failed |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds a new marketing-style landing page for unauthenticated users visiting Artemis. Instead of showing a plain sign-in form, visitors now see a comprehensive product overview with a chaptered narrative showcasing Artemis's key capabilities across AI, assessment, and platform features.
Checklist
General
Client
Motivation and Context
The existing landing experience for unauthenticated users is a basic sign-in page that provides no information about what Artemis is or what it offers. Universities considering Artemis, or students encountering it for the first time, have no way to understand the platform's capabilities without signing in.
This PR creates a marketing landing page that communicates Artemis's value proposition through a scroll-driven narrative organized into three chapters: AI features, assessment tools, and platform capabilities.
Description
New components:
LandingComponent— Page shell with scroll containerLandingHeroComponent— Hero section with tagline and trust strip of university logosLandingNavbarComponent— Sticky navbar with Features/Documentation dropdowns and language switcherLandingFeatureNarrativeComponent— Orchestrates the chaptered narrative with sticky side railLandingChapterIntroComponent— Reusable chapter heading with gradient textLandingFeatureSectionComponent— Reusable feature section (narrative + deep-dive variants)LandingCapabilityMatrixComponent— Compact "And More" section for additional featuresLandingGlowbarComponent— Decorative separator between chaptersLandingCtaComponent— Call-to-action sectionLandingFooterComponent— Footer with copyright and imprint linkLandingSupportStripComponent— University logo trust stripVisibleOnScrollDirective— IntersectionObserver-based scroll revealKey technical details:
signal(),viewChildren(),effect(),computed()).page-wrapper, notwindow— all IntersectionObservers use this as rootlanding.*namespaceprefers-reduced-motionsupport throughoutSteps for Testing
Prerequisites:
Testserver States
You can manage test servers using Helios.
Review Progress
Code Review
Manual Tests
Screenshots