storytold/spark
2
0
Fork 0
mirror of https://github.com/storytold/spark.git synced 2026-10-18 07:40:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Tweak mobile styles

Browse Source
This commit is contained in:
Diego Marcos Segura
2025-06-02 04:52:03 -07:00
parent 3a31f7428c
commit d2c09cef20
3 changed files with 42 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/index.md
+2 -5
View File
@@ -8,11 +8,8 @@ hide:
<div class="hero"> <div class="hero">
<h1><img src="/assets/images/logo-hero.png"/></h1> <h1><img src="/assets/images/logo-hero.png"/></h1>
<h2>An advanced 3D Gaussian Splatting renderer for THREE.js</h2> <h2>An advanced 3D Gaussian Splatting renderer for THREE.js</h2>
<div class="feature-grid"> <div class="feature-list">
<li class="feature-item">Integrates with THREE.js scenes</li> Integrate in your scene with other meshes and splats, fast rendering on all devices, programmable dynamic splat effects, wide format support (ply, spz, splat, ksplat)
<li class="feature-item">Fast rendering on all devices via WebGL2</li>
<li class="feature-item">Combine multiple splat objects</li>
<li class="feature-item">Programmable GPU-driven dynamic splat effects</li>
</div> </div>
<a href="/docs/" class="md-button md-button--primary">Get started →</a> <a href="/docs/" class="md-button md-button--primary">Get started →</a>
<iframe class="hero-image" src="/examples/hello-world/carousel.html"></iframe> <iframe class="hero-image" src="/examples/hello-world/carousel.html"></iframe>
docs/overrides/main.html
+1 -1
View File
@@ -36,7 +36,7 @@
@media screen and (max-width: 60em) { @media screen and (max-width: 60em) {
.hero img { .hero img {
max-width: 400px; max-width: 320px;
margin:auto; margin:auto;
} }
.hero h2 { .hero h2 {
docs/stylesheets/forge.css
+38 -8
View File
@@ -125,14 +125,44 @@
color: white; color: white;
} }
.feature-grid { .feature-list {
display: grid; font-size: 1rem;
grid-template-columns: 1fr 1fr; margin: auto;
gap: 0.5rem; margin-bottom: 30px;
max-width: 800px; max-width: 600px;
margin: 1.5rem auto;
} }
.feature-item { @media screen and (max-width: 60em) {
list-style: none; .feature-list {
font-size: 0.8rem;
}
.md-custom-header-right {
margin-left: 0;
margin-right: 0;
}
.icon-discord,
.icon-github {
margin-right: 15px;
}
.icon-discord {
width: 25px;
height: 25px;
}
.icon-github {
width: 20px;
height: 20px;
}
.md-header__button {
margin-left: 0;
}
[dir=ltr] .md-header__title {
margin-left: 0;
margin-right: 0;
}
} }