diff --git a/unity-client/Assets/UI/MainMenu.uss b/unity-client/Assets/UI/MainMenu.uss new file mode 100644 index 0000000..b02d4e9 --- /dev/null +++ b/unity-client/Assets/UI/MainMenu.uss @@ -0,0 +1,192 @@ +/* ============================================================ + MainMenu.uss - Main Menu / Navigation Hub Styles + Commander AI Lab - Unity UI Toolkit + ============================================================ */ + +/* ---------- Header Bar ---------- */ +.header-bar { + flex-direction: row; + justify-content: space-between; + align-items: center; + padding: 16px 24px; + background-color: rgba(15, 5, 25, 0.95); + border-bottom-width: 2px; + border-bottom-color: #6b21a8; +} + +.app-title { + font-size: 28px; + color: #e9d5ff; + -unity-font-style: bold; + letter-spacing: 1px; +} + +.version-label { + font-size: 12px; + color: #9ca3af; + padding: 4px 10px; + background-color: rgba(107, 33, 168, 0.3); + border-radius: 8px; +} + +/* ---------- Server Config Panel ---------- */ +.server-config-panel { + margin: 16px 24px; + padding: 16px; + background-color: rgba(30, 15, 50, 0.8); + border-radius: 10px; + border-width: 1px; + border-color: #374151; +} + +.server-row { + flex-direction: row; + align-items: center; + margin-top: 10px; +} + +.server-url-input { + flex-grow: 1; + margin-right: 10px; +} + +.server-url-input > .unity-text-field__input { + background-color: #1f1135; + border-color: #4b5563; + border-radius: 6px; + color: #e5e7eb; + padding: 8px 12px; + font-size: 14px; +} + +.server-url-input > .unity-text-field__input:focus { + border-color: #a855f7; +} + +.status-row { + flex-direction: row; + align-items: center; + margin-top: 10px; +} + +.status-dot { + width: 12px; + height: 12px; + border-radius: 6px; + margin-right: 8px; +} + +.status-connected { + background-color: #22c55e; +} + +.status-disconnected { + background-color: #ef4444; +} + +.status-connecting { + background-color: #eab308; +} + +.status-text { + font-size: 13px; + color: #9ca3af; +} + +/* ---------- Navigation Grid ---------- */ +.nav-grid { + flex-grow: 1; + padding: 8px 24px 16px 24px; +} + +.nav-cards-row { + flex-direction: row; + justify-content: flex-start; + margin-bottom: 12px; +} + +.nav-cards-row-single { + justify-content: flex-start; +} + +/* ---------- Navigation Card ---------- */ +.nav-card { + width: 30%; + min-width: 220px; + margin-right: 12px; + padding: 20px; + background-color: rgba(30, 15, 50, 0.85); + border-radius: 12px; + border-width: 1px; + border-color: #374151; + transition-property: border-color, background-color; + transition-duration: 0.2s; +} + +.nav-card:hover { + border-color: #a855f7; + background-color: rgba(45, 20, 75, 0.9); +} + +.nav-card-icon { + width: 48px; + height: 48px; + margin-bottom: 12px; + border-radius: 10px; +} + +/* Icon colour placeholders (swap for real textures later) */ +.collection-icon { background-color: #3b82f6; } +.deckbuilder-icon { background-color: #8b5cf6; } +.deckgen-icon { background-color: #10b981; } +.simulator-icon { background-color: #f59e0b; } +.coach-icon { background-color: #ec4899; } +.training-icon { background-color: #06b6d4; } +.scanner-icon { background-color: #6366f1; } + +.nav-card-title { + font-size: 18px; + color: #e9d5ff; + -unity-font-style: bold; + margin-bottom: 6px; +} + +.nav-card-desc { + font-size: 12px; + color: #9ca3af; + margin-bottom: 14px; + white-space: normal; +} + +/* ---------- Error Panel ---------- */ +.error-panel { + flex-direction: row; + align-items: center; + justify-content: space-between; + margin: 0 24px 12px 24px; + padding: 12px 16px; + background-color: rgba(127, 29, 29, 0.6); + border-radius: 8px; + border-width: 1px; + border-color: #dc2626; +} + +.error-text { + font-size: 13px; + color: #fca5a5; + flex-grow: 1; + margin-right: 12px; +} + +/* ---------- Footer ---------- */ +.footer { + padding: 12px 24px; + border-top-width: 1px; + border-top-color: #1f2937; + align-items: center; +} + +.footer-text { + font-size: 11px; + color: #6b7280; +}