193 lines
3.6 KiB
Plaintext
193 lines
3.6 KiB
Plaintext
/* ============================================================
|
|
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;
|
|
}
|