math-pixel/upload-gltf
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: move glb guidance into upload notice

Browse Source
This commit is contained in:
Tom Boullay
2026-05-17 16:50:02 +02:00
parent 83b2b405b4
commit 72e12a6e3d
2 changed files with 34 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/page.tsx
+2 -8
View File
@@ -8,14 +8,8 @@ export default function Home() {
Upload GLTF Upload GLTF
</h1> </h1>
<p className="text-gray-400 text-base leading-relaxed"> <p className="text-gray-400 text-base leading-relaxed">
Envoyer genere un GLB quand possible : plus performant, ideal pour la deco Deposez vos fichiers 3D, ils seront archives sur le Drive
et les modeles simples. avec versioning, puis envoyes aux devs via Git
<br />
Envoyer en GLTF garde des fichiers separes, moins optimises mais plus
pratiques pour inspecter et bidouiller les noeuds.
<br />
A privilegier pour les packs de relance, ebikes, pylones et modeles
que les devs doivent ajuster.
</p> </p>
</div> </div>
components/UploadZone.tsx
+32 -18
View File
@@ -12,6 +12,7 @@ import ActionButtons from './upload/ActionButtons'
import OverwriteConfirmModal from './upload/OverwriteConfirmModal' import OverwriteConfirmModal from './upload/OverwriteConfirmModal'
import NoChangesModal from './upload/NoChangesModal' import NoChangesModal from './upload/NoChangesModal'
import DriveErrorModal from './upload/DriveErrorModal' import DriveErrorModal from './upload/DriveErrorModal'
import { WarningIcon } from './ui/icons'
export default function UploadZone() { export default function UploadZone() {
const { const {
@@ -75,25 +76,38 @@ export default function UploadZone() {
const hasPendingOrErrors = entries.some((f) => f.status === 'pending' || f.status === 'error') const hasPendingOrErrors = entries.some((f) => f.status === 'pending' || f.status === 'error')
return ( return (
<div className="w-full max-w-2xl space-y-4"> <div className="w-full max-w-3xl space-y-4">
{entries.length === 0 && ( {entries.length === 0 && (
<p className="rounded-2xl border border-white/20 bg-black-800 px-4 py-3 text-xs text-gray-400 leading-relaxed text-center mb-3"> <>
Deposez un dossier complet contenant votre modele 3D nomme <p className="rounded-2xl border border-white/20 bg-black-800 px-4 py-3 text-xs text-gray-400 leading-relaxed text-center mb-3">
{' '}<span className="font-mono text-gray-200">model.gltf</span> Deposez un dossier complet contenant votre modele 3D nomme
{' '}ainsi que toutes les textures et fichiers binaires necessaires. {' '}<span className="font-mono text-gray-200">model.gltf</span>
{' '}Les fichiers associes peuvent etre en {' '}ainsi que toutes les textures et fichiers binaires necessaires.
{' '}<span className="font-mono text-gray-200">.png</span>, {' '}Les fichiers associes peuvent etre en
{' '}<span className="font-mono text-gray-200">.jpg</span> {' '}<span className="font-mono text-gray-200">.png</span>,
{' '}<span className="font-mono text-gray-200">.webp</span> {' '}<span className="font-mono text-gray-200">.jpg</span>
{' '}ou <span className="font-mono text-gray-200">.bin</span>. {' '}<span className="font-mono text-gray-200">.webp</span>
{' '}Utilisez un nom simple si la texture s&apos;applique au modele entier, et un nom detaille si elle correspond a une partie precise du modele, {' '}ou <span className="font-mono text-gray-200">.bin</span>.
{' '}par exemple <span className="font-mono text-gray-200">color_porte.jpg</span>, {' '}Utilisez un nom simple si la texture s&apos;applique au modele entier, et un nom detaille si elle correspond a une partie precise du modele,
{' '}<span className="font-mono text-gray-200">roughness_tuyaux.png</span>, {' '}par exemple <span className="font-mono text-gray-200">color_porte.jpg</span>,
{' '}<span className="font-mono text-gray-200">normal_dashboard.webp</span> {' '}<span className="font-mono text-gray-200">roughness_tuyaux.png</span>,
{' '}ou <span className="font-mono text-gray-200">opacity_fenetre.png</span>. {' '}<span className="font-mono text-gray-200">normal_dashboard.webp</span>
{' '}Les exports classiques comme <span className="font-mono text-gray-200">porte_baseColor.png</span> {' '}ou <span className="font-mono text-gray-200">opacity_fenetre.png</span>.
{' '}ou <span className="font-mono text-gray-200">porte_normal_opengl.png</span> sont normalises automatiquement pour Git. {' '}Les exports classiques comme <span className="font-mono text-gray-200">porte_baseColor.png</span>
</p> {' '}ou <span className="font-mono text-gray-200">porte_normal_opengl.png</span> sont normalises automatiquement pour Git.
</p>
<div className="mb-3 flex items-start gap-2 rounded-2xl border border-yellow-500/25 bg-yellow-500/10 px-4 py-3 text-xs leading-relaxed text-yellow-200">
<WarningIcon className="mt-0.5 h-4 w-4 shrink-0 text-yellow-300" />
<p>
<span className="font-semibold text-yellow-100">Attention :</span>
{' '}<span className="font-semibold text-yellow-100">Envoyer</span>
{' '}genere un GLB quand possible, plus performant pour la deco et les modeles simples.
{' '}<span className="font-semibold text-yellow-100">Envoyer en GLTF</span>
{' '}garde des fichiers separes, moins optimises mais plus pratiques pour inspecter et ajuster les noeuds.
{' '}A privilegier pour les packs de relance, ebikes, pylones et modeles que les devs doivent modifier.
</p>
</div>
</>
)} )}
{entries.length > 0 && ( {entries.length > 0 && (