skins: elegir el aspecto en el movil con tarjetas de un toque

En Ajustes del movil, Tema y Flujos de trabajo dejan de ser desplegables:
cada skin es una tarjeta con su miniatura y cada workflow un boton grande,
y se aplican al tocarlos. Solo se ofrecen los skins que tienen maqueta de
movil (Acampada y Oasis Mobile); el servidor rechaza un tema de escritorio,
que dejaba la app sin maqueta. La bienvenida tambien ofrece elegir skin.

Aplicar un workflow ya no cambia el skin: se queda el que haya elegido cada
cual.

OasisMobile.css se carga con su propio <link> versionado antes de
Acampada.css, en vez de con @import: el @import sin ?v= se quedaba en la
cache del WebView y tras actualizar se veia la maqueta vieja.
This commit is contained in:
oasis-bot 2026-10-19 02:17:12 +02:00
parent ac921c9d56
commit 0baf85faa9
9 changed files with 103 additions and 17 deletions

View file

@ -1258,3 +1258,24 @@ body:has(.oasis-nav-side-toggle) { padding-top: 84px !important; }
align-items: center !important;
justify-content: center !important;
}
/* Skins y workflows en Ajustes (views/settings_view.js): tarjetas de un toque */
.skin-pick { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; }
.skin-card {
display: flex !important; flex-direction: column; align-items: stretch; gap: 8px;
width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 8px !important;
background: #1c1c1c !important; color: #e6e6e6 !important;
border: 1px solid #444 !important; border-radius: 16px !important; cursor: pointer;
}
.skin-card .skin-shot { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; border-radius: 10px; display: block; }
.skin-card .skin-name { font-size: 17px; font-weight: 700; text-align: center; }
.skin-card.is-current { border: 2px solid #FFD700 !important; background: #2a2412 !important; }
.skin-card.is-current .skin-name::after { content: " \2713"; }
.workflow-pick { display: flex !important; flex-direction: column; gap: 10px; margin: 0; }
.workflow-card {
width: 100% !important; min-height: 56px !important; margin: 0 !important; padding: 10px 16px !important;
font-size: 18px !important; text-align: left !important;
background: #1c1c1c !important; color: #e6e6e6 !important; border: 1px solid #444 !important; border-radius: 14px !important;
}
.workflow-card.is-current { border: 2px solid #FFD700 !important; background: #2a2412 !important; color: #FFD700 !important; }
.workflow-card.is-current::after { content: " \2713"; }