Skip to content

Commit e5454c8

Browse files
committed
[all] Makes all pages (but plugins) responsive
1 parent dcd00e2 commit e5454c8

14 files changed

Lines changed: 324 additions & 194 deletions

File tree

src/components/UnderConstructionPage.astro

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ const { title } = Astro.props;
99
---
1010

1111
<Layout>
12-
<header class="banner py-5">
13-
<section class="container my-5 py-4 w-100">
12+
<header class="banner">
13+
<section class="container">
1414
<div class="d-flex gap-3 fs-1 w-100">
1515
<Icon name="ph:barricade" />
1616
<Icon name="ph:shovel" />

src/layouts/Layout.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -143,7 +143,7 @@ const appPages = [
143143

144144
<slot />
145145

146-
<footer class="container py-5 mb-5 border-top">
146+
<footer class="container py-5 mb-md-5 border-top">
147147
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-5">
148148
<div class="col d-flex flex-column align-items-start gap-2">
149149
<a href="/" class="d-flex align-items-center mb-3 link-body-emphasis text-decoration-none">

src/pages/404.astro

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ import Layout from "../layouts/Layout.astro";
44
---
55

66
<Layout>
7-
<header class="banner py-5">
8-
<section class="container my-5 py-4">
7+
<header class="banner">
8+
<section class="container">
99
<h1><Icon name="ph:link-break" /> Something about Gephi could not be found!</h1>
1010
</section>
1111
</header>

src/pages/about/index.astro

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,8 @@ const TEAM: TeamMember[] = [
2020
---
2121

2222
<Layout pageId="about">
23-
<header class="banner py-5">
24-
<section class="container my-5 py-4">
23+
<header class="banner">
24+
<section class="container">
2525
<h1>About Gephi</h1>
2626
</section>
2727
</header>

src/pages/desktop/index.astro

Lines changed: 45 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,10 @@ import Layout from "../../layouts/Layout.astro";
1414
--bs-link-color-rgb: var(--bs-gephi-desktop-logo-rgb);
1515
}
1616
</style>
17-
<header class="banner py-5">
18-
<section class="container my-5 py-4">
19-
<div class="row align-items-center">
20-
<div class="col-7 d-flex flex-column gap-4">
17+
<header class="banner">
18+
<section class="container">
19+
<div class="banner-contents">
20+
<div class="banner-texts">
2121
<div>
2222
<h1 class="gephi-font">Gephi</h1>
2323
</div>
@@ -28,14 +28,8 @@ import Layout from "../../layouts/Layout.astro";
2828

2929
<DownloadGephiDesktop withAlternativeLinks />
3030
</div>
31-
<div class="col-5 text-end">
32-
<Image
33-
src="/icons/gephi-desktop-logo-inverted.svg"
34-
class="mb-3 mb-md-0"
35-
alt="Gephi logo"
36-
width="400"
37-
height="400"
38-
/>
31+
<div class="banner-image">
32+
<Image src="/icons/gephi-desktop-logo-inverted.svg" alt="Gephi logo" width="400" height="400" />
3933
</div>
4034
</div>
4135
</section>
@@ -46,7 +40,7 @@ import Layout from "../../layouts/Layout.astro";
4640
<LangSwitcher fromPath={Astro.originPathname} />
4741
</section>
4842

49-
<section class="container pb-5">
43+
<section class="feature-container pb-5">
5044
<section class="feature feature-flat">
5145
<section class="feature-headline">
5246
<div class="feature-text">
@@ -69,7 +63,8 @@ import Layout from "../../layouts/Layout.astro";
6963
</section>
7064

7165
<section class="feature">
72-
<div class="feature-background" style="opacity: 0.1; background-image: url(/desktop/Divided-they-blog.png);"></div>
66+
<div class="feature-background" style="opacity: 0.1; background-image: url(/desktop/Divided-they-blog.png);">
67+
</div>
7368
<section class="feature-headline">
7469
<div class="feature-text">
7570
<h2>
@@ -83,9 +78,8 @@ import Layout from "../../layouts/Layout.astro";
8378
<p>
8479
Gephi helps data analysts
8580
<strong>explore networks, test hypotheses, and discover meaningful patterns</strong>
86-
in complex relational data.
87-
By enabling <strong>visual thinking</strong> through interactive interfaces,
88-
it complements traditional statistical methods and enhances analytical reasoning.
81+
in complex relational data. By enabling <strong>visual thinking</strong> through interactive interfaces, it
82+
complements traditional statistical methods and enhances analytical reasoning.
8983
</p>
9084
<p>
9185
Built for <a href="https://en.wikipedia.org/wiki/Exploratory_data_analysis">Exploratory Data Analysis</a>,
@@ -97,7 +91,12 @@ import Layout from "../../layouts/Layout.astro";
9791

9892
<section class="feature-arguments">
9993
<figure class="figure">
100-
<img src="/public/desktop/Gephi Desktop Screenshot DtB.png" style="height: 315px"class="border figure-img img-fluid" alt="" />
94+
<img
95+
src="/public/desktop/Gephi Desktop Screenshot DtB.png"
96+
style="height: 315px"
97+
class="border figure-img img-fluid"
98+
alt=""
99+
/>
101100
<figcaption class="figure-caption text-muted text-center">Visual user interface</figcaption>
102101
</figure>
103102
<figure class="figure">
@@ -123,14 +122,14 @@ import Layout from "../../layouts/Layout.astro";
123122
<Icon name="ph:cursor-click" class="text-primary" />
124123
<span>Real-time visualization</span>
125124
</h2>
126-
125+
127126
<p>
128127
Experience the fastest <strong>graph visualization engine</strong>
129128
to accelerate understanding and pattern discovery in large networks.
130129
</p>
131130
<p>
132-
Powered by a <strong>custom OpenGL engine</strong>,
133-
Gephi delivers unmatched performance for interactive network exploration.
131+
Powered by a <strong>custom OpenGL engine</strong>, Gephi delivers unmatched performance for interactive
132+
network exploration.
134133
</p>
135134
<ul>
136135
<li>Handle networks with up to <strong>100,000 nodes</strong> and <strong>1,000,000 edges</strong></li>
@@ -154,7 +153,8 @@ import Layout from "../../layouts/Layout.astro";
154153
</section>
155154

156155
<section class="feature">
157-
<div class="feature-background" style="opacity: 0.1; background-image: url(/desktop/layout-clusters.png);"></div>
156+
<div class="feature-background" style="opacity: 0.1; background-image: url(/desktop/layout-clusters.png);">
157+
</div>
158158
<section class="feature-headline">
159159
<div class="feature-text">
160160
<h2>
@@ -163,13 +163,14 @@ import Layout from "../../layouts/Layout.astro";
163163
</h2>
164164

165165
<p>
166-
Layout algorithms define the visual structure of your graph.
167-
Gephi offers <strong>state-of-the-art network layout algorithms</strong>
166+
Layout algorithms define the visual structure of your graph. Gephi offers <strong
167+
>state-of-the-art network layout algorithms</strong
168+
>
168169
that balance both efficiency and quality.
169170
</p>
170171
<p>
171-
The <strong>Layout module</strong> enables real-time adjustment of layout settings,
172-
dramatically enhancing user feedback and experience.
172+
The <strong>Layout module</strong> enables real-time adjustment of layout settings, dramatically enhancing
173+
user feedback and experience.
173174
</p>
174175
<ul>
175176
<li><strong>Force-driven algorithms</strong> for natural node positioning</li>
@@ -355,25 +356,34 @@ import Layout from "../../layouts/Layout.astro";
355356
<Icon name="ph:road-horizon" class="text-primary" />
356357
<span>Roadmap to Gephi Desktop 1.0</span>
357358
</h2>
358-
359+
359360
<p>
360-
Gephi Desktop has been a “beta” version for more than a decade. This just means that the team does not consider the tool to be complete yet. We aim to implement the following features before getting “version 1.0”:
361+
Gephi Desktop has been a “beta” version for more than a decade. This just means that the team does not
362+
consider the tool to be complete yet. We aim to implement the following features before getting “version
363+
1.0”:
361364
</p>
362365

363366
<ul class="fs-4 ps-md-0 mt-0">
364-
<li><strong>Undo feature</strong>, limited to the “GEXF scope”: network data, metadata, positions, sizes, colors…</li>
367+
<li>
368+
<strong>Undo feature</strong>, limited to the “GEXF scope”: network data, metadata, positions, sizes,
369+
colors…
370+
</li>
365371
<li><strong>More readable UI</strong> with clearer icons.</li>
366372
<li><strong>Activity log</strong>, possibly coordinated to undo, possibly stored in the GEXF.</li>
367-
<li><strong>Parallel edges.</strong> The GraphStore (Gephi’s internal engine) supports them but they are not currently visualized or accessible from the user interface.</li>
373+
<li>
374+
<strong>Parallel edges.</strong> The GraphStore (Gephi’s internal engine) supports them but they are not currently
375+
visualized or accessible from the user interface.
376+
</li>
368377
<li><strong>Improved timeline</strong> for dynamic graphs.</li>
369-
<li><strong>New GPU visualization engine.</strong> We aim for comfortably visualizing 200K nodes and 1M edges on an average consumer laptop. Might be ready soon!</li>
378+
<li>
379+
<strong>New GPU visualization engine.</strong> We aim for comfortably visualizing 200K nodes and 1M edges on
380+
an average consumer laptop. Might be ready soon!
381+
</li>
370382
<li><strong>Legend generator</strong> (note: available in Gephi Lite)</li>
371383
</ul>
372384

373-
<p>
374-
We are also considering the following features, but for a more distant future:
375-
</p>
376-
385+
<p>We are also considering the following features, but for a more distant future:</p>
386+
377387
<ul class="fs-4 ps-md-0 mt-0">
378388
<li>Local exploration, i.e. at least a quick overview of a subgraph.</li>
379389
<li>Integrate other visualization (treemap, scatter plots...)</li>

src/pages/desktop/plugins/index.astro

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ const pluginsData: Plugin[] | null = pluginsDataRequest.ok
1515
---
1616

1717
<Layout pageId="desktop-plugins">
18-
<header class="banner py-5">
19-
<section class="container my-5 py-4">
18+
<header class="banner">
19+
<section class="container">
2020
<h1>Gephi plugins</h1>
2121
</section>
2222
</header>

src/pages/faq/index.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -288,7 +288,7 @@ const QUESTIONS: Group<Question | Group<Question>>[] = [
288288
---
289289

290290
<Layout class="faq-page" pageId="faq">
291-
<header class="banner py-5">
291+
<header class="banner">
292292
<section class="container my-5 py-4">
293293
<h1>Frequently Asked Questions</h1>
294294
<p class="fs-5 mb-1">

src/pages/index.astro

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ import Layout from "../layouts/Layout.astro";
77
---
88

99
<Layout>
10-
<header class="banner py-5">
11-
<section class="container my-5 py-4">
10+
<header class="banner">
11+
<section class="container">
1212
<div class="row align-items-center">
1313
<div class="col-lg-8 mb-5">
1414
<h1 class="gephi-font">Gephi</h1>
@@ -20,7 +20,7 @@ import Layout from "../layouts/Layout.astro";
2020
</div>
2121

2222
<div class="d-flex gap-5 flex-wrap flex-xl-nowrap">
23-
<div class="p-5 bg-gephi-desktop-bg text-dark d-flex flex-row gap-5 flex-grow-1 flex-wrap">
23+
<div class="p-3 p-md-5 bg-gephi-desktop-bg text-dark d-flex flex-row gap-5 flex-grow-1 flex-wrap">
2424
<a href="/desktop">
2525
<Image src="/icons/gephi-desktop-logo.svg" alt="Gephi logo" class="h-100" width="130" height="130" />
2626
</a>
@@ -35,7 +35,7 @@ import Layout from "../layouts/Layout.astro";
3535
<DownloadGephiDesktop buttonClass="btn btn-dark fs-4 me-1 fw-bold" />
3636
</div>
3737
</div>
38-
<div class="p-5 bg-gephi-lite-bg text-lite d-flex flex-row gap-5 flex-grow-1 flex-wrap">
38+
<div class="p-3 p-md-5 bg-gephi-lite-bg text-lite d-flex flex-row gap-5 flex-grow-1 flex-wrap">
3939
<a href="/lite">
4040
<Image
4141
src="/icons/gephi-lite-logo-inverted.svg"
@@ -73,7 +73,7 @@ import Layout from "../layouts/Layout.astro";
7373
</section>
7474
</header>
7575

76-
<main class="container py-5">
76+
<main class="feature-container py-5">
7777
<section class="feature feature-network-analysis">
7878
<div class="feature-background" style="background-image: url(/homepage/network-analysis.png);"></div>
7979
<section class="feature-headline">

src/pages/lite/index.astro

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@ import Layout from "../../layouts/Layout.astro";
1313
--bs-link-color-rgb: var(--bs-gephi-lite-bg-rgb);
1414
}
1515
</style>
16-
<header class="banner py-5 bg-gephi-lite-bg-dark">
17-
<section class="container my-5 py-4">
18-
<div class="row align-items-center">
19-
<div class="col-7 d-flex flex-column gap-4">
16+
<header class="banner bg-gephi-lite-bg-dark">
17+
<section class="container">
18+
<div class="banner-contents">
19+
<div class="banner-texts">
2020
<div>
2121
<h1 class="gephi-font">Gephi Lite</h1>
2222
</div>
@@ -34,14 +34,8 @@ import Layout from "../../layouts/Layout.astro";
3434
<div class="fs-5 pt-2">Works on desktop, tablets and mobiles</div>
3535
</div>
3636
</div>
37-
<div class="col-5 text-end">
38-
<Image
39-
src="/icons/gephi-lite-logo-inverted.svg"
40-
class="mb-3 mb-md-0"
41-
alt="Gephi logo"
42-
width="400"
43-
height="400"
44-
/>
37+
<div class="banner-image">
38+
<Image src="/icons/gephi-lite-logo-inverted.svg" alt="Gephi logo" width="400" height="400" />
4539
</div>
4640
</div>
4741
</section>
@@ -52,7 +46,7 @@ import Layout from "../../layouts/Layout.astro";
5246
<LangSwitcher fromPath={Astro.originPathname} />
5347
</section>
5448

55-
<section class="container pb-5">
49+
<section class="feature-container pb-5">
5650
<section class="feature">
5751
<div class="feature-background" style="opacity: 0.1; background-image: url(/lite/graph.png);"></div>
5852
<section class="feature-headline">

src/pages/quickstart/index.astro

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ import Layout from "../../layouts/Layout.astro";
77
---
88

99
<Layout class="no-sticky-nav" pageId="quickstart">
10-
<header class="banner py-5">
11-
<section class="container my-5 py-4">
10+
<header class="banner">
11+
<section class="container">
1212
<h1>Quickstart</h1>
1313
</section>
1414
</header>

0 commit comments

Comments
 (0)