New responsive UI for mobile devices
Some checks failed
/ build (push) Has been cancelled
/ deploy (push) Has been cancelled

This commit is contained in:
Gu://em_ 2026-03-16 17:31:19 +01:00
parent ed03be8bde
commit e9ae13e69c
3 changed files with 230 additions and 27 deletions

View file

@ -1,6 +1,7 @@
---
import "../styles/common.css";
import data from "../data/op-public.json";
import "../styles/mobile.css";
import data from "../data/content.json";
const { cards, website_title, website_logo } = data;
---
@ -19,31 +20,28 @@ const { cards, website_title, website_logo } = data;
<body>
<div class="halo"></div>
<a href="https://status.oblic-parallels.fr"
><img class="logo" src={website_logo} /></a
></body
>
<div>
<!--Titles-->
<div>
<h2>Welcome to</h2>
</div>
<div>
<h1>Oblic Parallels</h1>
</div>
</div>
<div class="card-container">
<!-- Cards -->
{
cards.map((card) => (
<a class="card" href={card.link}>
<img src={card.icon} />
<div class="card-title">{card.title}</div>
<div class="card-desc">{card.description}</div>
<header class="site-header">
<div class="header-row">
<a href="https://status.oblic-parallels.fr">
<img class="logo" src={website_logo} />
</a>
))
}
</div>
<h1 class="site-title">{website_title}</h1>
</div>
<div class="welcome-title">
<h2>Welcome to</h2>
</div>
</header>
<div class="card-container">
{
cards.map((card) => (
<a class="card" href={card.link}>
<img src={card.icon} />
<div class="card-title">{card.title}</div>
<div class="card-desc">{card.description}</div>
</a>
))
}
</div>
</body>
</html>