Skip to content

Commit 87bbefe

Browse files
pusewiczpusewicz
committed
Redesign about section
1 parent 72071be commit 87bbefe

3 files changed

Lines changed: 408 additions & 14 deletions

File tree

‎_includes/redesign_nav.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
<li><a href="/downloads/"{% if page.url contains '/downloads/' %} aria-current="page"{% endif %}>Downloads</a></li>
1616
<li><a href="/docs/"{% if page.url contains '/docs/' %} aria-current="page"{% endif %}>Documentation</a></li>
1717
<li><a href="/libraries/"{% if page.url contains '/libraries/' %} aria-current="page"{% endif %}>Libraries</a></li>
18-
<li><a href="/about.html"{% if page.url == '/about.html' %} aria-current="page"{% endif %}>About</a></li>
18+
<li><a href="/about/"{% if page.url contains '/about/' %} aria-current="page"{% endif %}>About</a></li>
1919
<li><a href="/team.html"{% if page.url == '/team.html' %} aria-current="page"{% endif %}>Team</a></li>
2020
</ul>
2121
</div>

‎about/index.html‎

Lines changed: 82 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,92 @@
11
---
2-
layout: default
3-
title: mruby - about
2+
layout: redesign
3+
title: mruby — About
44
---
55

6-
<div id="home">
7-
<div>
8-
<h2>About mruby</h2>
9-
<p class="mruby-is">
10-
mruby is the lightweight implementation of the <a href="https://www.ruby-lang.org">Ruby language</a> complying to (part of) the <a href="http://www.iso.org/iso/iso_catalogue/catalogue_tc/catalogue_detail.htm?csnumber=59579">ISO standard</a>. mruby can be linked and embedded within your application. We provide the interpreter program "mruby" and the interactive mruby shell "mirb" as examples. You can also compile Ruby programs into compiled byte code using the mruby compiler "mrbc". All those tools reside in the "bin" directory. "mrbc" is also able to generate compiled byte code in a C source file, see the "mrbtest" program under the "test" directory for an example.
6+
<section class="about-header">
7+
<div class="about-header__inner">
8+
<div class="page-header__eyebrow">
9+
<span class="page-header__eyebrow-dot"></span>
10+
Project
11+
</div>
12+
<h1 class="about-heading">About mruby</h1>
13+
<p class="about-description">
14+
mruby is the lightweight implementation of the Ruby language complying to (part of)
15+
the ISO standard. It can be linked and embedded within your application. We provide the interpreter
16+
<span class="inline-code">mruby</span>, the interactive shell <span class="inline-code">mirb</span>,
17+
and the compiler <span class="inline-code">mrbc</span>
18+
which can also generate bytecode as a C source file.
1119
</p>
20+
</div>
21+
</section>
1222

13-
<p>
14-
This achievement was sponsored by the Regional Innovation Creation R&amp;D Programs of the Ministry of Economy, Trade and Industry of Japan.
15-
</p>
23+
<section class="about-features">
24+
<div class="about-features__inner">
25+
<div class="about-feature">
26+
<h2 class="about-feature__title">Lightweight</h2>
27+
<p class="about-feature__desc">Designed for constrained environments — microcontrollers, embedded systems, and any place where MRI Ruby is too heavy.</p>
28+
</div>
29+
<div class="about-feature">
30+
<h2 class="about-feature__title">Embeddable</h2>
31+
<p class="about-feature__desc">Link <span class="inline-code">libmruby</span> directly into your C or C++ application and call mruby from native code.</p>
32+
</div>
33+
<div class="about-feature">
34+
<h2 class="about-feature__title">ISO-compliant</h2>
35+
<p class="about-feature__desc">Conforms to a subset of the ISO/IEC 30170 Ruby specification, ensuring predictable, standards-based behaviour.</p>
36+
</div>
37+
<div class="about-feature">
38+
<h2 class="about-feature__title">Bytecode</h2>
39+
<p class="about-feature__desc">Compile Ruby to <span class="inline-code">.mrb</span> bytecode or embed it as a C array — ship programs without distributing source.</p>
40+
</div>
1641
</div>
42+
</section>
1743

18-
{% include _latest_news.html %}
44+
<div class="about-body">
45+
<div class="about-body__inner">
46+
<section class="about-releases">
47+
<p class="about-section-eyebrow">Release History</p>
48+
<div class="about-releases__list">
49+
{% assign release_posts = site.posts | where_exp: "post", "post.url contains '-released'" %}
50+
{% for post in release_posts %}
51+
<a href="{{ post.url }}" class="about-release-row">
52+
<span class="about-release-row__date">{{ post.date | date: "%d %b %Y" }}</span>
53+
<span class="about-release-row__title">{{ post.title }}</span>
54+
{% if forloop.first %}<span class="about-release-badge">Latest</span>{% endif %}
55+
</a>
56+
{% endfor %}
57+
</div>
58+
</section>
1959

20-
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/ZXbs9yuzv-E" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
60+
<aside class="about-sidebar">
61+
<div class="about-videos">
62+
<p class="about-section-eyebrow">Talks &amp; Videos</p>
63+
<div class="about-video-list">
64+
<div class="about-video-card">
65+
<div class="about-video-embed">
66+
<iframe src="https://www.youtube-nocookie.com/embed/ZXbs9yuzv-E" title="mruby 3.0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
67+
</div>
68+
<div class="about-video-info">
69+
<p class="about-video-title">mruby 3.0</p>
70+
<p class="about-video-subtitle">福岡県未来ITイニシアティブ</p>
71+
</div>
72+
</div>
73+
<div class="about-video-card">
74+
<div class="about-video-embed">
75+
<iframe src="https://www.youtube-nocookie.com/embed/Xa08hqK7ozs" title="An Introduction to mRuby" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
76+
</div>
77+
<div class="about-video-info">
78+
<p class="about-video-title">An Introduction to mRuby</p>
79+
<p class="about-video-subtitle">Yukihiro &ldquo;Matz&rdquo; Matsumoto &middot; DraperTV</p>
80+
</div>
81+
</div>
82+
</div>
83+
</div>
2184

22-
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/Xa08hqK7ozs" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
85+
<div class="about-ack">
86+
<p class="about-section-eyebrow">Acknowledgement</p>
87+
<p class="about-ack__text">Sponsored by the Regional Innovation Creation R&amp;D Programs of the Ministry of Economy, Trade and Industry of Japan.</p>
88+
<p class="about-ack__logo">mruby logo by <a href="https://github.com/h2so5">h2so5</a></p>
89+
</div>
90+
</aside>
91+
</div>
2392
</div>

0 commit comments

Comments
 (0)