avi/SignalElsewhereGame
1
0
Fork 0
forked from avi/signalelsewhere
Code Pull Requests Activity

Save point: add dedicated desktop view CSS with explicit data-view='desktop'

Browse Source
This commit is contained in:
avi
2026-05-18 10:52:58 -05:00
parent f57caea2fe
commit a56d534964
2 changed files with 70 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
index.html
View File

@@ -1029,6 +1029,40 @@ html[data-view="mobile"] #exfilDeskCanvas { max-height: 500px; }
html[data-view="mobile"] #whatIsLabBtn { bottom: 8%; font-size: 1.4rem; padding: 1rem 3rem; }
html[data-view="mobile"] #s8BtnRow .btnNext { padding: 1rem 2rem; font-size: 1.4rem; }
html[data-view="mobile"] #s7BtnRow .btnNext { padding: 1rem 2rem; font-size: 1.4rem; }
/* Desktop view overrides */
html[data-view="desktop"] .scene { font-size: 1.4rem; padding: 3rem; }
html[data-view="desktop"] .scene4text,
html[data-view="desktop"] .scene5text,
html[data-view="desktop"] .scene7text,
html[data-view="desktop"] .scene8text,
html[data-view="desktop"] .s4visual,
html[data-view="desktop"] .s5visual,
html[data-view="desktop"] .s4tl { max-width: 60rem; }
html[data-view="desktop"] .comp-table { font-size: 1rem; max-width: 60rem; }
html[data-view="desktop"] .comp-table th,
html[data-view="desktop"] .comp-table td { padding: 0.6rem 1rem; }
html[data-view="desktop"] .scene4sub { padding: 3rem 3rem 7rem; }
html[data-view="desktop"] #scene3 { padding: 4rem 3rem; }
html[data-view="desktop"] #scene3Title { font-size: 3.5rem; top: 2.5rem; left: 2.5rem; }
html[data-view="desktop"] #scene3Text,
html[data-view="desktop"] #textContainer { max-width: 60rem; }
html[data-view="desktop"] #textContainer { font-size: 1.6rem; }
html[data-view="desktop"] .hub-title { font-size: 2.5rem; }
html[data-view="desktop"] .callout-box { font-size: 1.3rem; padding: 1.5rem 2rem; }
html[data-view="desktop"] #scene2Line1,
html[data-view="desktop"] #scene2Message2 { font-size: 1.4rem; }
html[data-view="desktop"] .scene3ChoiceBtn { font-size: 1.1rem; padding: 1.2rem 2.5rem; }
html[data-view="desktop"] #meshCanvas,
html[data-view="desktop"] #deskCanvas,
html[data-view="desktop"] #phoneCanvas,
html[data-view="desktop"] #exfilCanvas,
html[data-view="desktop"] #exfilDeskCanvas { max-height: 480px; }
html[data-view="desktop"] .punch-card { font-size: 0.95rem; padding: 1.2rem; }
html[data-view="desktop"] .punch-card .punch-icon { font-size: 1.8rem; }
html[data-view="desktop"] .scene3ChoiceBtn:hover,
html[data-view="desktop"] .btnNext:hover,
html[data-view="desktop"] .hub-btn:hover { box-shadow: 0 0 12px rgba(0,255,0,0.2); }
</style>
</head>
<body>
@@ -1613,11 +1647,7 @@ html[data-view="mobile"] #exfilDeskCanvas { max-height: 500px; }
let introStarted = false;
function setView(mode) {
if (mode === 'mobile') {
document.documentElement.setAttribute('data-view', 'mobile');
} else {
document.documentElement.removeAttribute('data-view');
}
document.documentElement.setAttribute('data-view', mode);
sessionStorage.setItem('signalView', mode);
}

40
www/index.html
View File

@@ -1029,6 +1029,40 @@ html[data-view="mobile"] #exfilDeskCanvas { max-height: 500px; }
html[data-view="mobile"] #whatIsLabBtn { bottom: 8%; font-size: 1.4rem; padding: 1rem 3rem; }
html[data-view="mobile"] #s8BtnRow .btnNext { padding: 1rem 2rem; font-size: 1.4rem; }
html[data-view="mobile"] #s7BtnRow .btnNext { padding: 1rem 2rem; font-size: 1.4rem; }
/* Desktop view overrides */
html[data-view="desktop"] .scene { font-size: 1.4rem; padding: 3rem; }
html[data-view="desktop"] .scene4text,
html[data-view="desktop"] .scene5text,
html[data-view="desktop"] .scene7text,
html[data-view="desktop"] .scene8text,
html[data-view="desktop"] .s4visual,
html[data-view="desktop"] .s5visual,
html[data-view="desktop"] .s4tl { max-width: 60rem; }
html[data-view="desktop"] .comp-table { font-size: 1rem; max-width: 60rem; }
html[data-view="desktop"] .comp-table th,
html[data-view="desktop"] .comp-table td { padding: 0.6rem 1rem; }
html[data-view="desktop"] .scene4sub { padding: 3rem 3rem 7rem; }
html[data-view="desktop"] #scene3 { padding: 4rem 3rem; }
html[data-view="desktop"] #scene3Title { font-size: 3.5rem; top: 2.5rem; left: 2.5rem; }
html[data-view="desktop"] #scene3Text,
html[data-view="desktop"] #textContainer { max-width: 60rem; }
html[data-view="desktop"] #textContainer { font-size: 1.6rem; }
html[data-view="desktop"] .hub-title { font-size: 2.5rem; }
html[data-view="desktop"] .callout-box { font-size: 1.3rem; padding: 1.5rem 2rem; }
html[data-view="desktop"] #scene2Line1,
html[data-view="desktop"] #scene2Message2 { font-size: 1.4rem; }
html[data-view="desktop"] .scene3ChoiceBtn { font-size: 1.1rem; padding: 1.2rem 2.5rem; }
html[data-view="desktop"] #meshCanvas,
html[data-view="desktop"] #deskCanvas,
html[data-view="desktop"] #phoneCanvas,
html[data-view="desktop"] #exfilCanvas,
html[data-view="desktop"] #exfilDeskCanvas { max-height: 480px; }
html[data-view="desktop"] .punch-card { font-size: 0.95rem; padding: 1.2rem; }
html[data-view="desktop"] .punch-card .punch-icon { font-size: 1.8rem; }
html[data-view="desktop"] .scene3ChoiceBtn:hover,
html[data-view="desktop"] .btnNext:hover,
html[data-view="desktop"] .hub-btn:hover { box-shadow: 0 0 12px rgba(0,255,0,0.2); }
</style>
</head>
<body>
@@ -1613,11 +1647,7 @@ html[data-view="mobile"] #exfilDeskCanvas { max-height: 500px; }
let introStarted = false;
function setView(mode) {
if (mode === 'mobile') {
document.documentElement.setAttribute('data-view', 'mobile');
} else {
document.documentElement.removeAttribute('data-view');
}
document.documentElement.setAttribute('data-view', mode);
sessionStorage.setItem('signalView', mode);
}