v0.2.36 Add user-specific features and UI enhancements

Updated the version to 0.2.36. Introduced `user_id` and `subscription_level` attributes in `GameResult` and `GameState` to support user-specific functionality. Expanded `game_mode` options to include "easy."

Enhanced the UI with improved styling and layout adjustments:
- Styled the guess input box and added placeholder text.
- Increased font sizes in various components for better readability.
- Adjusted dialog and footer layouts.

Added conditional rendering for subscription-based features, such as difficulty and timer display. Updated CSS selectors and styles for better maintainability.

README.md

@@ -19,21 +19,17 @@ tags:
 
 > **This project is used by [huggingface.co](https://huggingface.co/spaces/Surn/BattleWords) as a demonstration of interactive word games in Python.**
 
-**Current Version:** 0.2.35
-**Last Updated:** 2026-01-29
+**Current Version:** 0.2.36
+**Last Updated:** 2026-02-01
 
 BattleWords is a vocabulary learning game inspired by classic Battleship mechanics. The objective is to discover hidden words on a grid, earning points for strategic guessing before all letters are revealed.
 
 ## Recent Changes
-- version 0.2.35
-- New spinner implementation for loading states
-- Updated graphics and improved visual polish
-- Favicon added for browser tab branding
-- Leaderboard navigation moved to footer menu (not sidebar)
-- Game over dialog integrates leaderboard submission and displays qualification results
-- Leaderboard page routing uses query parameters and custom navigation links
-- Footer navigation links to Leaderboard, Play, and Settings pages
-- Minimal documentation and UI updates for these changes
+- version 0.2.36
+- Added `user_id` and `subscription_level` to game state/results for user-specific features
+- Expanded `game_mode` options (includes `easy`)
+- UI polish: improved guess input styling (placeholder, typography) and layout tweaks (dialog/footer)
+- Conditional rendering for subscription-based features (difficulty and timer display)
 
 
 ## Features
@@ -213,7 +209,13 @@ CRYPTO_PK=                             # Reserved for future signing
  - Personal high scores sidebar with filtering
  - Player statistics tracking (games played, averages, bests)
  
- - version 0.2.34
+ - version 0.2.36
+  - Added `user_id` and `subscription_level` to game state/results for user-specific features
+  - Expanded `game_mode` options (includes `easy`)
+  - UI polish: improved guess input styling (placeholder, typography) and layout tweaks (dialog/footer)
+  - Conditional rendering for subscription-based features (difficulty and timer display)
+
+ - version 0.2.35
   - New spinner implementation for loading states
   - Updated graphics and improved visual polish
   - Favicon added for browser tab branding

battlewords/__init__.py

@@ -1,2 +1,2 @@
-__version__ = "0.2.35"
+__version__ = "0.2.36"
 __all__ = ["models", "generator", "logic", "ui", "game_storage", "modules"]

battlewords/local_storage.py

@@ -65,6 +65,9 @@ class GameResult:
     words_found: List[str]
     completed_at: str
     player_name: Optional[str] = None
+    user_id: Optional[str] = None
+    subscription_level: Optional[int] = 0
+    
 
     def to_dict(self) -> Dict[str, Any]:
         return asdict(self)

battlewords/models.py

@@ -96,7 +96,9 @@ class GameState:
     score: int
     last_action: str
     can_guess: bool
-    game_mode: Literal["classic", "too easy"] = "classic"
+    game_mode: Literal["classic", "easy", "too easy"] = "classic"
     points_by_word: Dict[str, int] = field(default_factory=dict)
     start_time: Optional[datetime] = None
-    end_time: Optional[datetime] = None
+    end_time: Optional[datetime] = None
+    user_id: Optional[str] = None
+    subscription_level : Optional[int] = 0

battlewords/settings_page.py

@@ -26,6 +26,9 @@ _PERSISTED_SETTING_KEYS: tuple[str, ...] = (
     "effects_volume",
     "enable_sound_effects",
     "music_track_path",
+    "user_id",
+    "subscription_level",
+    "player_name",
 )
 
 

battlewords/ui.py

@@ -769,6 +769,37 @@ def _render_guess_form(state: GameState):
     st.markdown(
         """
         <style>
+        .st-key-guess_input .stTextInput label .st-emotion-cache-lyi571, .st-key-guess_input .stTextInput label .st-emotion-cache-on6lu2  {
+            font-size: 1.2em;
+        }    
+        .st-key-guess_input .stTextInput input {
+            font-size: 1.1em;
+        }
+        /* Placeholder styling for guess textbox */
+        .st-key-guess_input .stTextInput input::placeholder {
+            font-size: 0.75em;
+            font-style: italic;
+            opacity: 0.9;            
+            color: #a1a1aa;
+        }
+        .st-key-guess_input .stTextInput input::-webkit-input-placeholder {
+            font-size: 0.75em;
+            font-style: italic;
+            opacity: 0.9;            
+            color: #a1a1aa;
+        }
+        .st-key-guess_input .stTextInput input:-ms-input-placeholder {
+            font-size: 0.75em;
+            font-style: italic;
+            opacity: 0.9;            
+            color: #a1a1aa;
+        }
+        .st-key-guess_input .stTextInput input::-ms-input-placeholder {
+            font-size: 0.75em;
+            font-style: italic;
+            opacity: 0.9;            
+            color: #a1a1aa;
+        }
         /* Grey-out the guess textbox when disabled */
         .st-key-guess_input input:disabled {
             background-color: #ffffff66 !important;
@@ -781,7 +812,7 @@ def _render_guess_form(state: GameState):
             border-color: #ffffff !important;
         }
         .bw-incorrect-guesses {
-            font-size: 0.7rem;
+            font-size: 0.8rem;
             color: #ff9999;
             margin-top: -10px;
             font-style: italic;
@@ -833,6 +864,9 @@ def _render_guess_form(state: GameState):
         }
 
         .stForm { padding-bottom: 30px; }
+        
+        .stColumn .st-emotion-cache-6023h2 {margin-top:0px;}
+        /*.stColumn .st-emotion-cache-1w9nhvb { display:none;}  hide OK BUTTON col spacing under form */
 
         @media (max-width: 640px) {
           .st-emotion-cache-1xwdq91, .st-emotion-cache-1r70o5,  {
@@ -850,7 +884,7 @@ def _render_guess_form(state: GameState):
           }
           .st-emotion-cache-bw9c3d, .st-emotion-cache-1w9nhvb, .st-emotion-cache-bah2wz, .st-emotion-cache-tuze3w, .st-emotion-cache-nwgyir, .st-emotion-cache-1pzr114 {
             min-width: unset;
-          }
+          }          
         }
         </style>
         """,
@@ -858,7 +892,7 @@ def _render_guess_form(state: GameState):
     )
     
     with st.form("guess_form", width="stretch", clear_on_submit=True):
-        col1, col2, col3 = st.columns([0.4, 0.25, 0.35], vertical_alignment="bottom")
+        col1, col2, col3 = st.columns([0.525, 0.025, 0.5], vertical_alignment="bottom")
         with col1:
             guess_text = st.text_input(
                 "Your Guess", 
@@ -867,7 +901,8 @@ def _render_guess_form(state: GameState):
                 width=200, 
                 key="guess_input",
                 help=tooltip_text,  # Use Streamlit's built-in help parameter for tooltip
-                disabled=not state.can_guess
+                disabled=not state.can_guess,
+                placeholder="Enter guess",
             )
         with col2:
             submitted = st.form_submit_button("OK", disabled=not state.can_guess, width=100, key="guess_submit")
@@ -967,7 +1002,7 @@ def _render_score_panel(state: GameState):
         .bold-text {{ font-weight: 700; }}
         .blue-background {{ background:#1d64c8dd; opacity:0.9; color:#fff; }}
         .shiny-border {{ position: relative; padding: 10px; background: #333; color: white; border-radius: 1.25rem; overflow: hidden; }}
-        .bw-score-panel-container {{ height: 100%; overflow: hidden; text-align:center;}}
+        .bw-score-panel-container {{ height: 100%; overflow: hidden; text-align:center; font-size: 1.1em;}}
         .bw-score-panel-container table tbody tr h3 {{display: flex;flex-direction: row;justify-content: space-evenly;flex-wrap: wrap;}}
 
         table {{ width: 100%; margin: 0 auto; border-collapse: separate; border-spacing: 0; }}
@@ -1074,9 +1109,12 @@ def _game_over_content(state: GameState) -> None:
     # Render difficulty line only if we have a value
     difficulty_html = (
         f'<tr><td colspan=\"3\"><h5 class=\"m-2\">Word list difficulty: {difficulty_value:.2f}</h5></td></tr>'
-        if difficulty_value is not None else ""
+        if difficulty_value is not None and st.session_state.get("subscription_level", 0) > 0 else ""
     )
 
+    timer_html = (f'<span style="font-size:1.25rem; color:#1d64c8;">&nbsp;⏱ {timer_str}</span>'
+                  if st.session_state.get("subscription_level", 0) > 0 else "")
+
     # Build table body HTML for dialog content
     word_rows = []
     for w in state.puzzle.words:
@@ -1087,14 +1125,14 @@ def _game_over_content(state: GameState) -> None:
         )
 
     table_html = (
-        "<table class=\"shiny-border\" style=\"border-radius:0.75rem; overflow:hidden; width:100%; margin:0 auto; border-collapse:separate; border-spacing: 0;\">"
+        "<table class=\"shiny-border word-table\" style=\"border-radius:0.75rem; overflow:hidden; width:100%; margin:0 auto; border-collapse:separate; border-spacing: 0;\">"
         "<thead><tr>"
         "<th scope=\"col\">Word</th>"
         "<th scope=\"col\">Letters</th>"
         "<th scope=\"col\">Extra</th>"
         "</tr></thead>"
         f"<tbody>{''.join(word_rows)}"
-        f"<tr><td colspan=\"3\"><h5 class=\"m-2\">Total: {state.score} <span style='font-size:1.25rem; color:#1d64c8;'>&nbsp;⏱ {timer_str}</span></h5></td></tr>"
+        f"<tr><td colspan=\"3\"><h5 class=\"m-2\">Total: {state.score} {timer_html}</h5></td></tr>"
         f"{difficulty_html}"
         "</tbody>"
         "</table>"
@@ -1104,12 +1142,14 @@ def _game_over_content(state: GameState) -> None:
     st.markdown(
         """
         <style>
+          .stDialog div.st-e1 { padding: 1.5rem 1.5rem 0.1rem !important;}
           .bw-dialog-container {
             border-radius: 1rem;
             box-shadow: 0 0 32px #1d64c8;
             background: linear-gradient(-45deg, #1d64c8, #ffffff, #1d64c8, #666666);
             color: #fff;
-            padding: 16px;
+            padding: 0px;
+            font-size: 1.1em;
           }
           .bw-dialog-header { display:flex; justify-content: space-between; align-items:center; }
           .bw-dialog-title, .st-emotion-cache-11elpad p { margin: 0; font-weight: bold;font-size: 1.5rem;text-align: center;flex: auto;filter:drop-shadow(1px 1px 2px #003);} 
@@ -1123,6 +1163,8 @@ def _game_over_content(state: GameState) -> None:
            .st-key-new_game_btn_dialog button, .st-key-close_game_over button {
             height: 50px !important;
            }
+           .word-table h5,.st-emotion-cache-16vm6ba h5 {font-size: 1.5rem !important; padding: 4px;}
+           .st-key-close_game_over button p {font-size:1.4em;}
            .st-key-new_game_btn_dialog:hover, .st-key-close_game_over:hover{
               /*background: linear-gradient(-45deg, #1d64c8, #ffffff, #1d64c8, #666666);*/
               background: #1d64c8 !important;

battlewords/ui_helpers.py

@@ -410,11 +410,11 @@ def inject_styles() -> None:
            .stHeading {
                 margin-bottom: -1.2rem !important;
                 margin-top: -1.5rem !important;
-                # font-size: 1.75rem !important; /* Title */
-                line-height: 1.1 !important;
+                # font-size: 1.8rem !important; /* Title */
+                line-height: 1.15 !important;
            }
            #subtitle {
-            font-size: 16px !important; /* Subheader */
+            font-size: 18px !important; /* Subheader */
             margin-top: .1rem !important;
            }
           /* Base grid cell visuals */
@@ -463,9 +463,9 @@ def inject_styles() -> None:
           /* div[data-testid="stButton"] button { max-width: 100%; aspect-ratio: 1 / 1; border-radius: 0; background: #1d64c8; color: #ffffff; font-weight: 700; padding: 0.5rem 0.75rem; min-height: 2.5rem; min-width: 2.5rem;} */
           .st-key-new_game_btn, .st-key-sort_wordlist_btn, .st-key-filter_wordlist_btn, .st-key-settings_save_apply_btn, .st-key-settings_discard_btn { margin: 0 auto; aspect-ratio: unset; z-index:9999;}
           .st-key-new_game_btn > div[data-testid="stButton"] button, .st-key-sort_wordlist_btn > div[data-testid="stButton"] button, .st-key-filter_wordlist_btn > div[data-testid="stButton"] button, .st-key-settings_save_apply_btn > div[data-testid="stButton"] button, .st-key-settings_discard_btn > div[data-testid="stButton"] button { aspect-ratio: unset; text-align:center; height: auto; width: 160px; border-radius:8px;}
-          .stVerticalBlock .st-emotion-cache-tn0cau.e1wguzas3 div:first-child { display: none; } 
-          .stVerticalBlock .st-emotion-cache-tn0cau.e1wguzas3 div:nth-child(2) { display: none; }
-          .stVerticalBlock .st-emotion-cache-tn0cau.e1wguzas3 div:nth-child(3) { display: none; }    
+          .stVerticalBlock .st-emotion-cache-tn0cau.e1wguzas3 div.element-container:first-child { display: none; } 
+          .stVerticalBlock.st-emotion-cache-tn0cau.e1wguzas3 div.element-container:nth-child(2), .stVerticalBlock.st-emotion-cache-tn0cau.ek2vi383 div.element-container:nth-child(2)  { display: none; }
+          .stVerticalBlock.st-emotion-cache-tn0cau.e1wguzas3 div.element-container:nth-child(3), .stVerticalBlock.st-emotion-cache-tn0cau.ek2vi383 div.element-container:nth-child(3)  { display: none; }    
           .st-emotion-cache-18kf3ut.e1wguzas41 { display: none; }   
           
           .bw-fadein-prep {visibility: hidden !important;}
@@ -491,7 +491,7 @@ def inject_styles() -> None:
            .st-key-new_game_btn > div[data-testid="stButton"] button, .st-key-sort_wordlist_btn > div[data-testid="stButton"] button { min-height: calc(100% + 20px) !important;}
            .st-emotion-cache-ckafi0 { gap:0.1rem !important; min-height: calc(100% + 20px) !important; aspect-ratio: 1 / 1; width: auto !important;  flex: 1 1 auto !important;  min-width: 100% !important;  max-width: 100% !important;}
            /*.st-emotion-cache-1n6tfoc { aspect-ratio: 1 / 1; min-height: calc(100% + 20px) !important;}*/
-           .st-emotion-cache-1n6tfoc::before { min-height: calc(100% + 20px) !important; }
+           .st-emotion-cache-1n6tfoc::before { min-height: calc(80% + 20px) !important; }
 
           }
           div[data-testid="stElementToolbarButtonContainer"], button[data-testid="stBaseButton-elementToolbar"], button[data-testid="stBaseButton-elementToolbar"]:hover {
@@ -632,7 +632,7 @@ def render_footer(current_page: str = "play") -> None:
             color: #d7faff;
             text-decoration: none;
             font-weight: 600;
-            font-size: 0.85rem;
+            font-size: 0.9rem;
             padding: 0.4rem 0.8rem;
             border-radius: 0.5rem;
             background: rgba(29, 100, 200, 0.3);
@@ -650,7 +650,7 @@ def render_footer(current_page: str = "play") -> None:
             border-color: rgba(32, 212, 108, 0.5);
         }}
         .stMainBlockContainer {{
-            padding-bottom: 70px !important;
+            padding-bottom: 60px !important;
         }}
         </style>
         <div class="bw-footer">

claude.md

@@ -3,8 +3,8 @@
 ## Project Overview
 BattleWords is a vocabulary learning game inspired by Battleship mechanics, built with Streamlit and Python 3.12. Players reveal cells on a 12x12 grid to discover hidden words and earn points for strategic guessing.
 
-**Current Version:** 0.2.35 (Stable - Spinner, Graphics, Favicon, UI Navigation)
-**Last Updated:** 2026-01-29
+**Current Version:** 0.2.36 (Stable - User Features, UI Enhancements)
+**Last Updated:** 2026-02-01
 **Next Version:** 0.3.0 (In Development - Wrdler improvements)
 **Repository:** https://github.com/Oncorporation/BattleWords.git
 **Live Demo:** https://huggingface.co/spaces/Surn/BattleWords
@@ -16,10 +16,17 @@ The detailed porting checklist lives in `specs/upgrade.mdx`.
 ## Recent Changes
 See `README.md` for the canonical release notes: [Recent Changes](README.md#recent-changes)
 
+- v0.2.36
+  - Added `user_id` and `subscription_level` to game state/results for user-specific features
+  - Expanded `game_mode` options (includes `easy`)
+  - UI polish: improved guess input styling (placeholder, typography) and layout tweaks (dialog/footer)
+  - Conditional rendering for subscription-based features (difficulty and timer display)
+
 - v0.2.35
   - New spinner implementation for loading states
   - Updated graphics and improved visual polish
   - Favicon added for browser tab branding
+  - Favicon added for browser tab branding
   - Leaderboard navigation moved to footer menu (not sidebar)
   - Game over dialog integrates leaderboard submission and displays qualification results
   - Leaderboard page routing uses query parameters and custom navigation links

pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "battlewords"
-version = "0.2.35"
+version = "0.2.36"
 description = "BattleWords vocabulary game with game sharing via shortened game_id URL referencing server-side JSON settings"
 readme = "README.md"
 requires-python = ">=3.12,<3.13"

specs/requirements.mdx

@@ -1,18 +1,15 @@
 # Battlewords: Implementation Requirements
 
-**Current Version:** 0.2.35
-**Last Updated:** 2026-01-29
+**Current Version:** 0.2.36
+**Last Updated:** 2026-02-01
 
-## Recent Changes (v0.2.35)
+## Recent Changes (v0.2.36)
 See `README.md` for the canonical release notes: [Recent Changes](README.md#recent-changes)
 
-- New spinner implementation for loading states
-- Updated graphics and improved visual polish
-- Favicon added for browser tab branding
-- Leaderboard navigation moved to footer menu
-- Game over dialog now integrates leaderboard submission and displays qualification results
-- Leaderboard page routing uses query parameters and custom navigation links
-- Footer navigation links to Leaderboard, Play, and Settings pages
+- Added `user_id` and `subscription_level` to game state/results for user-specific features
+- Expanded `game_mode` options (includes `easy`)
+- UI polish: improved guess input styling (placeholder, typography) and layout tweaks (dialog/footer)
+- Conditional rendering for subscription-based features (difficulty and timer display)
 
 This document breaks down the tasks to build Battlewords using the game rules described in `specs.md`. It is organized in phases: a minimal Proof of Concept (POC), a Beta Version (0.5.0), and a Full Version (1.0.0).
 

specs/specs.mdx

@@ -1,7 +1,7 @@
 # Battlewords Game Requirements (specs.md)
 
-**Current Version:** 0.2.35
-**Last Updated:** 2026-01-29
+**Current Version:** 0.2.36
+**Last Updated:** 2026-02-01
 
 ## Overview
 Battlewords is inspired by the classic Battleship game, but uses words instead of ships. The objective is to discover hidden words on a grid, earning points for strategic guessing before all letters are revealed.
@@ -9,16 +9,13 @@ Battlewords is inspired by the classic Battleship game, but uses words instead o
 ## Upgrade Checklist
 The detailed Wrdler  BattleWords porting checklist is tracked in `specs/upgrade.mdx`.
 
-## Recent Changes (v0.2.35)
+## Recent Changes (v0.2.36)
 See `README.md` for the canonical release notes: [Recent Changes](README.md#recent-changes)
 
-- New spinner implementation for loading states
-- Updated graphics and improved visual polish
-- Favicon added for browser tab branding
-- Leaderboard navigation moved to footer menu
-- Game over dialog now integrates leaderboard submission and displays qualification results
-- Leaderboard page routing uses query parameters and custom navigation links
-- Footer navigation links to Leaderboard, Play, and Settings pages
+- Added `user_id` and `subscription_level` to game state/results for user-specific features
+- Expanded `game_mode` options (includes `easy`)
+- UI polish: improved guess input styling (placeholder, typography) and layout tweaks (dialog/footer)
+- Conditional rendering for subscription-based features (difficulty and timer display)
 
 ---