May 11th, 2025
This week at 120.dev, we’ve shipped more improvements to give users more control and feedback in our apps. First, we added a General Theme Mode toggle in Settings so users can choose Dark, Light, or System themes (System follows the OS preference automatically). Next, we expanded our component library with a versatile Toast Notification System, featuring multiple positions and contextual triggers.
We've implemented theme mode selection in Settings, giving users precise control over their visual experience with Dark, Light, and System options. The System mode follows device preferences, automatically transitioning between light and dark themes based on OS settings.
This feature builds upon our existing theming infrastructure while providing more granular control to users who have specific visual preferences. The implementation required careful coordination between our design system and native platform capabilities to ensure smooth transitions between modes.
We've implemented a specialized Toast that appears in the top-right corner when users attempt to send a message without selecting a model or when sending an empty message. This gentle reminder helps users understand why an action didn't complete as expected, providing immediate guidance rather than simply disabling the send button.
Our Toast component supports three distinct positions along the top edge of the interface: top-left, top-center, and top-right. This flexibility allows different types of notifications to be displayed in locations that make contextual sense based on the triggering action.
Top positions are particularly effective for notifications that require immediate attention without blocking the primary content area. The top-center position works well for system-wide announcements, while the top-left and top-right positions can be used for more contextual notifications related to specific UI regions.
Similarly, our Toast component can be anchored to three positions along the bottom edge: bottom-left, bottom-center, and bottom-right. These positions are ideal for notifications that provide supplementary information without demanding immediate action.
Bottom positions are particularly useful on mobile interfaces where they're more easily accessible to thumb interaction. The bottom-center position works well for confirmation messages, while bottom corners can be leveraged for feature announcements or tips.
Each Toast position includes carefully calculated spacing to ensure proper stacking when multiple notifications appear simultaneously.
Next week, we’re continuing to improve both accessibility and rich text editing across the platform. Our Text component is getting support for inline font families and sizes, along with improved styling and wrapping capabilities. On the app side, we’re enhancing keyboard navigation: Tab will move focus between the title bar and new conversation section, while Enter will trigger relevant actions, making the experience smoother for power users and screen reader users alike.
Stay tuned for more updates from the 120.dev team!