Conversation
Implements a new Vue.js application for the POLAR website's landing page. This includes a full structure with dedicated sections for hero, features, roadmap, UX, developer experience, calls to action, and video content. Global styling is established using the KERN design system and custom theme variables.
Implements a new visual identity with a custom SVG background, updated brand colors, and new typography. Overhauls the header with a distinctive logo, centralized pill navigation, and a prominent GitHub call-to-action. Redesigns the hero section for a modern and engaging first impression, featuring an updated map preview and refined calls-to-action. Simplifies the Features section layout and enhances content descriptions within the UX and Video sections for clarity. Integrates `kern-extra-icons` and updates TypeScript configuration to support dynamic icon management. This comprehensive update aims to provide a more cohesive and visually appealing experience for visitors.
Introduces a new `lp-pill` component with associated color tokens, replacing the `kern-badge` components across various sections for a unified design. Completely redesigns the Features section, adding a new visual background and updating its structure. Applies minor styling improvements to the Hero section's title and subtitle for enhanced readability and visual depth.
Introduces the main `App.vue` component, defining global styles and layout. Extracts inline SVGs for backgrounds and icons into dedicated asset files. Updates components like `TheHeader`, `FeaturesSection`, `DevExSection`, and `UxSection` to import and utilize these SVG assets. Adds the new `UsedBySection` to showcase integrations. Refines component layouts and styles for a cleaner, more responsive user experience. Establishes KERN design system integration and custom color tokens for consistent theming.
Integrates the UsedBySection into the main application layout and applies consistent formatting across all components. Introduces ESLint overrides for safe v-html usage with build-time SVG imports. Normalizes CSS hex color tokens and fixes script tag string escaping within the developer experience code snippets to improve reliability.
Replaces the basic timeline in the Roadmap section with a sophisticated phased design, incorporating milestones, status-specific accents, and a responsive alternating grid. Updates the UsedBy section to use a light background and ensures the logo SVG scales consistently across the full width of the section by removing the container constraints.
Splits the section into a dual-band layout with distinct header and body backgrounds. Enables per-item icons within roadmap cards and introduces a custom CSS-based progress indicator for active milestones. Adjusts component shadows and borders to improve visual depth and consistency.
Lists dynamically used icon names in a comment for vite-plugin-kern-extra-icons to ensure they are correctly identified during static analysis. Also updates the accent icon for the Q4 2025 roadmap phase.
Switches the section to a dark background and removes fixed padding. Programmatically adjusts the logo SVG attributes and CSS properties to ensure the asset scales fluidly across different screen sizes.
Moves global styles from App.vue into scoped components to improve encapsulation. Enhances the CTA section with a background SVG and updated icons, and switches the Video section to a dark theme for better visual distinction.
Reflects the transition to the unified @polar/polar package across the install, quickstart, and advanced code snippets. Also refines the code block UI by implementing a fixed-height layout with internal scrolling, updating syntax highlighting colors for better contrast, and redesigning the tab states.
Refines the hero section by replacing the background asset and implementing dynamic SVG attribute patching to ensure it fluidly covers the container. Updates the DevEx section snippets to reflect the latest `createMap` and `subscribe` APIs while improving syntax highlighting logic. Also enhances header responsiveness on small screens by adjusting the navigation grid and creating a more compact GitHub link.
background-size: cover or background-size: 100% auto; for main differences
Implements an interactive map in the hero section using the `@polar/polar` library to showcase its features directly on the landing page. The demo integrates several plugins, including address search, pins, and a custom coordinate display. Additionally, updates the TypeScript configuration to resolve the package and its plugins from the local source directories, ensuring the website reflects the latest library changes.
Refines the description to emphasize the benefits of POLAR for mapping applications and adjusts the card background color to a light gray for improved visual distinction.
Refines the roadmap UI by implementing pill-shaped phase labels, gradient connectors, and improved card layouts. It also transitions hardcoded hex values to a centralized set of CSS variables and adds new items to the Q1 2025 roadmap.
…data files Refines the component architecture by breaking down the RoadmapSection into smaller sub-components and moving static content for the roadmap and developer experience sections into dedicated TypeScript files. Additionally, replaces remaining inline styles with CSS classes across the CTA, Video, and Roadmap sections to improve maintainability and consistency.
…ed to the store raw Also, add proper cleanup example to snowbox.
Also, add information on what to do on teardown.
Transitions the interactive hero map to the @polar/polar/client entry point for a more concise configuration. This update switches to a remote service registry, implements mask layers for the Hamburg city border, and adds logic for selectable report markers. Additionally, it simplifies the hero title and subtitle font sizes.
Replaces the 2023 FOSSGIS presentation with the more recent 2024 talk, updating the embedded video link and associated accessibility labels.
Replaces the hero background and introduces layered SVG assets, including a polar bear and star, using CSS masking to enhance the landing page's visual depth.
…ader Removes the redundant wrapper around the hero map to streamline its layout and deletes the "Playground" link from the header navigation.
Transitions from raw SVG string imports and v-html injection to standard img tags across landing page components. This improves security and simplifies component logic by removing the need for manual regex manipulation of SVG strings for attributes like opacity and width. Also introduces a dedicated background asset for the CTA section.
56da65b to
f6da8ae
Compare
|
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
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
Summarization of the changes in a short and concise sentence.
Instructions for local reproduction and review
Relevant tickets, issues, et cetera