Commit Graph

135 Commits

Author SHA1 Message Date
1e60656eac Add overflow: "visible" to styles for better element rendering
This ensures that elements can overflow their containers when necessary, improving visual consistency and layout flexibility. Corrected a typo in the second "overflow" property.
2026-02-07 18:43:56 +01:00
762e2d8300 Add zIndex property to styling in App component
The zIndex property was added to ensure proper layering of elements in the UI. This change enhances design consistency and prevents potential overlapping issues.
2026-02-07 18:40:47 +01:00
2018b24029 Adjust button margin for improved spacing
Increased the `marginLeft` value from 6 to 20 in the button styling for better alignment and visual consistency in the layout. This change ensures a more polished appearance.
2026-02-07 18:39:52 +01:00
5b901b0f98 Add margin-left styling to target element
Added a small adjustment by including a `marginLeft` property with a value of 6. This change helps ensure proper spacing and alignment for the styled element.
2026-02-07 18:38:49 +01:00
b18ae57779 Make overflow visible in body and left pane
Changed the `overflow` property from `hidden` to `visible` in both the `body` and `.leftPane` styles. This update ensures content is not clipped and allows for better handling of overflows.
2026-02-07 18:35:21 +01:00
a19d13b1b5 Remove visual effects and adjust HUD overflow behavior
Removed border, background, blur, and shadow effects on specific UI elements to simplify the design. Changed the HUD overflow property from "hidden" to "visible" to allow better flexibility.
2026-02-07 13:01:52 +01:00
456d22d985 Update PlayerIdentityCard defaults and styles
Changed the default `houseLabel` to "Gryffindor" and the `overflow` style to "visible" for a better visual effect. Removed an unnecessary styled block to clean up the component structure.
2026-02-07 12:57:57 +01:00
6638622903 Adjust card dimensions in App component.
Updated the card's width and maxWidth to better fit the design requirements. This change ensures a more consistent and visually appealing layout.
2026-02-07 12:55:35 +01:00
f7730df3ec Enhance card UI with improved styles and hover effects
Adjusted styling for better visuals and responsiveness, including background, shadows, and dimensions. Added interactive hover effects for a dynamic user experience and refined card elements like gloss, label, and tag designs.
2026-02-07 12:54:04 +01:00
bc894de505 Add PlayerIdentityCard component and Harry Potter card
Introduced a new PlayerIdentityCard component for displaying themed player cards with customizable options. Added a Harry Potter identity card as the first example, including relevant styling and an image. Integrated the new card into the player HUD in the app layout.
2026-02-07 12:49:50 +01:00
dbca035ca0 Adjust dimensions of dünnes Pergament component
Updated the height to 96 and set the width to 90% for better scaling and alignment of the dünnes Pergament component. These changes ensure improved visual consistency and responsiveness.
2026-02-07 12:43:02 +01:00
c0f0e72967 Fix width styling in App.jsx component
The width was changed from "100%" to 88 to ensure consistent styling and alignment with design specifications. This adjustment prevents visual discrepancies in the rendered component.
2026-02-07 12:40:37 +01:00
0fa26ddf5a Refactor HUD styling for cleaner and simpler design.
Simplified the background, padding, and shadow styles while adjusting dimensions for a more refined appearance. These changes improve maintainability and provide a sleeker visual presentation.
2026-02-07 12:39:14 +01:00
145af05471 Adjust layout and overflow settings for consistency
Updated the App component's overflow property to "visible" for better content display and modified grid row sizing in the layout to improve spacing control. These changes ensure better alignment and a more consistent user interface.
2026-02-07 12:36:42 +01:00
b65d25f66a Refine UI styles for improved layout and visual consistency
Updated component and HUD styles to add better alignment, spacing, and consistent radius values. Enhanced background effects and shadows for a more polished and subtle appearance. Adjusted layout properties to ensure proper stretching and alignment of elements.
2026-02-07 12:33:10 +01:00
598b8b9b6e Improve HUD styling and layout consistency
Adjusted various height, padding, and spacing values for better alignment and responsiveness in the HUD. Increased font sizes and refined positioning to ensure a visually balanced layout. These changes enhance the user experience by improving aesthetic and functional design.
2026-02-07 12:30:29 +01:00
3e4e26297b Refine HogwartsPointsCard styles for cleaner UI.
Simplified and updated styling for the HogwartsPointsCard component by adjusting spacing, borders, shadows, and fonts. These refinements enhance visual consistency and improve readability across various design elements.
2026-02-07 12:27:17 +01:00
9d744c8674 Refine HogwartsPointsCard design and styling.
Updated the HogwartsPointsCard component to enhance its styling. Changes include a more subtle and consistent visual appearance by refining colors, borders, shadows, padding, and grid spacing. Adjusted font sizes and shadows for better readability and aesthetics.
2026-02-07 12:24:28 +01:00
06b6544653 Enhance HogwartsPointsCard design and layout
Refactored the component to improve its visual hierarchy and styling for better usability and aesthetics. Added new design elements like gold accents, updated text shadows, and a refined grid layout. Improved responsiveness and structure to align with overall application design standards.
2026-02-07 12:21:20 +01:00
86c4cf2639 Add HogwartsPointsCard component with styled design
Introduced a new `HogwartsPointsCard` component to display Hogwarts points with a custom styled design. The component leverages layered backgrounds, gradients, and thoughtful typography to enhance the overall visual appeal. Replaced the placeholder card with this new component in the points section.
2026-02-07 12:18:50 +01:00
b1e5198880 Update CSS overflow properties for visibility
Changed `overflow` from `hidden` to `visible` in multiple elements to ensure proper content display. This adjustment avoids clipping issues and aligns with the desired layout behavior.
2026-02-07 12:14:25 +01:00
f282ac42fb Add playerRailInner wrapper and adjust CSS styling.
Introduced a `playerRailInner` div for better structural organization and improved styling flexibility. Adjusted CSS to manage overflow and improve visual cropping while maintaining a clean radius design.
2026-02-07 12:11:14 +01:00
393cd94f4b Update player list with avatar images and visual enhancements
Replaced placeholder players with detailed profiles including names, avatars, and unique colors. Updated player icons to display images with improved styling, active state effects, and tooltips for better user experience.
2026-02-07 12:08:16 +01:00
ccb51d750a Enhance panel styling and layout handling.
Updated the panel container to use a flexible column layout with conditional "flex" or "block" display based on its state. This ensures better structure and responsiveness while maintaining current functionality.
2026-02-07 11:58:24 +01:00
a9fe71046c Update board placeholder styling in App.jsx
Adjusted the placeholder component with new styling properties, including changing opacity and adding a flex property. This enhances the basic layout for future integration with the game board and pieces.
2026-02-07 11:57:38 +01:00
a3d052d2c1 Refactor: Introduce unified PlaceholderCard variants
Updated the PlaceholderCard component to support unified variants: "compact," "tile," and "panel," enabling consistent styling throughout the app. Replaced old placeholder logic with the new variant system across various UI sections for better maintainability and scalability.
2026-02-07 11:52:25 +01:00
15e5869aec [Message]
Refine layout and responsiveness in AppLayout.css

Updated grid settings for better flexibility and spacing across various screen sizes. Adjusted dimensions, padding, and responsive breakpoints to enhance layout appearance and usability, especially for smaller screens. Added minor styling tweaks for improved aesthetics and consistency.
2026-02-07 11:49:27 +01:00
c06ae53b4f Update layout and annotations for player HUD and board tools
Improved clarity of component annotations and adjusted the layout styling in App.jsx and AppLayout.css. Key changes include the introduction of a middle section in the player HUD and refined descriptions for board-related elements. This enhances code readability and structuring consistency.
2026-02-07 11:47:28 +01:00
fd91bbe207 Adjust grid column widths for improved layout consistency
Updated the grid column sizes across the application to ensure a better visual balance and alignment. This includes reducing the minimum and maximum widths for side panels and stacking elements vertically for better usability in the left tools section.
2026-02-07 11:43:00 +01:00
e5f8f00832 Add player rail, dice overlay, and compact card support
This update introduces a player rail to the right of the board, visually representing active and inactive players, and adds a dice overlay beneath the board. Compact variants for placeholder cards were added, with corresponding adjustments to layouts and styles for better responsiveness and a cleaner interface.
2026-02-07 11:38:38 +01:00
e035a99179 Refactor layout for improved responsiveness and scroll control
Updated the app layout to separate fixed and scrollable sections, enabling only the notes panel to scroll. Introduced a new CSS file for a cleaner structure and responsive behavior, ensuring a more consistent user experience across different screen sizes.
2026-02-07 11:31:55 +01:00
3d7d4c01f7 Update layout and scrolling styles for better responsiveness
Adjusted grid column sizing using "clamp" for improved adaptability to various screen sizes. Minor tweaks to sticky position and maximum height calculation ensure better alignment and consistent scroll behavior.
2026-02-07 11:17:54 +01:00
cf81c25e6e new logic, testing 2026-02-07 11:15:33 +01:00
62439d2d28 Enhance loading screen with animation and splash improvements
Updated the loading screen to include animated gold lines, a loader, and a spark effect. Adjusted splash visibility to ensure a minimum display time of 3 seconds and improved transitions for smoother visuals. Enhanced style and structure for better user experience during app initialization.
2026-02-06 18:52:16 +01:00
57cb9a57ef Replace preload mechanism with splash screen
The preload class was replaced by a more user-friendly splash screen design. This change ensures a smoother transition while loading assets and eliminates black background flashes. The splash overlay is automatically hidden and removed after the app is ready, providing a seamless loading experience.
2026-02-06 18:49:25 +01:00
e975d7aa25 Set up immediate theme application and manual SW updates
Moved theme application logic to occur immediately on app initialization to prevent UI flash. Added a check to wait for all fonts to load before making the app visible and adjusted Service Worker behavior to require manual updates instead of auto-reloading.
2026-02-06 18:47:13 +01:00
7c4754e506 "Enhance loading experience and optimize theme application
Added a fallback background and a preload lock for smoother loading transitions. Improved theme application by applying it prior to React rendering and removed theme flash. Adjusted Service Worker registration for better performance and reliability."
2026-02-06 18:44:44 +01:00
070057afb3 Set and persist theme preference in localStorage
Implemented logic to store and retrieve theme preferences using localStorage for both logged-in users and guests. This ensures the selected theme is applied immediately on load, preventing theme flash issues. Adjusted initialization to apply the correct theme at app startup.
2026-02-06 18:41:45 +01:00
6434256dfb Set dynamic theme color for PWA and Android status bar.
Added logic to update the theme-color meta tag dynamically based on the active theme. This improves the visual consistency of the application, particularly for PWA and Android users. Default theme color has also been updated in the configuration.
2026-02-06 18:39:04 +01:00
770b2cb531 Enhance WinnerCelebration visuals and confetti effects
Updated confetti burst and rain effects with brighter colors, improved motion, and increased visibility on dark overlays. Refined UI styling for better clarity, reduced dimensions for mobile-friendliness, and adjusted overlay opacity for enhanced contrast. Made layout and text updates for improved alignment and readability.
2026-02-06 17:13:42 +01:00
61c7ed6ffe Improve winner celebration logic in game meta updates
Adjusted the logic to ensure celebrations trigger only when the winner ID changes and not on initial meta loads. Also added a reset check to prevent celebrations when the winner ID becomes empty.
2026-02-06 17:09:43 +01:00
3a9da788e5 Add winner celebration feature with confetti effects
This update introduces a winner celebration overlay displayed when a game's winner is announced. It includes confetti animations along with a congratulatory message, enhancing user experience. The feature resets appropriately during game transitions and logout to maintain correct behavior.
2026-02-06 17:05:19 +01:00
56ef076010 Remove star emoji for host users in GamePickerCard.
The star emoji for identifying host users has been removed from the `suffix` logic. This simplifies the component and aligns with updated display requirements.
2026-02-06 16:52:17 +01:00
aefb4234d6 Update host icon in GamePickerCard
Replaced the star () icon with a crown (👑) to represent the host. Adjusted labels, tooltip styles, and descriptive text accordingly for improved clarity and consistency.
2026-02-06 15:01:50 +01:00
83893a0060 Remove unused "teilen" hint from GamePickerCard.
The small "teilen" hint was not being actively used and has been removed for cleaner code. This improves readability and maintains consistency in the component.
2026-02-06 14:59:58 +01:00
f555526e64 Add host and player identification in GamePickerCard
This update introduces visual indicators to identify the host and the current user in the GamePickerCard component. Hosts are marked with a star, and the current user is labeled as "(du)". The design of the member pills has also been enhanced for better clarity and aesthetics.
2026-02-06 14:57:35 +01:00
d4e629b211 Enhance member display in GamePickerCard and remove redundancy
Added functionality to display members in GamePickerCard, replacing the previously redundant implementation in NewGameModal. This change centralizes member display logic, reducing code duplication and improving maintainability.
2026-02-06 14:53:11 +01:00
85805531c2 Add current members list display in NewGameModal
Introduced a UI element in NewGameModal to display the list of current members when available. Also used React Portal to render the bottom snack for joins directly in the document body. These updates enhance UI clarity and user feedback during game interactions.
2026-02-06 14:46:36 +01:00
7b7b23f52d Add join notifications with bottom snack and vibration feedback
Added functionality to detect new members joining games, displaying a snack message and providing optional vibration feedback. Managed state with refs to track members and reset baselines when switching games. Styled a bottom toast notification for better user feedback.
2026-02-06 14:37:36 +01:00
3cbb4ce89a Enhance new game modal with running game state handling
Introduced functionality to detect and handle ongoing games in the new game modal. The modal now switches between "running" and "choice" modes based on game state, improving clarity for users. Added a dedicated section to display the game code when a game is active.
2026-02-06 14:17:39 +01:00