-
Notifications
You must be signed in to change notification settings - Fork 32
/
index.html
127 lines (124 loc) · 7.82 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
---
layout: simple
section: home
title: MyBB - Free and Open Source Forum Software
meta_description: The official homepage for MyBB, a free and open source PHP forum software.
---
<article class="main main--home">
<header class="main-feature">
<div class="wrapper">
<h1 class="main-feature__page-title">Host your community with ease and style.</h1>
<div class="main-feature__screenshots">
<span class="main-feature__screenshots__nav main-feature__screenshots__nav--previous">{% include icon.html icon='chevron-left' %}</span>
<span class="main-feature__screenshots__nav main-feature__screenshots__nav--next">{% include icon.html icon='chevron-right' %}</span>
<div class="main-feature__screenshots__carousel owl-carousel">
<div class="main-feature__screenshots__item">
<a href="{{ site.baseurl }}/assets/images/home/sharee.png" data-featherlight="image" class="main-feature__screenshots__item__link">
<img src="{{ site.baseurl }}/assets/images/home/thumbs/sharee.png" class="main-feature__screenshots__item__image" />
</a>
</div>
<div class="main-feature__screenshots__item">
<a href="{{ site.baseurl }}/assets/images/home/rctgo.png" data-featherlight="image" class="main-feature__screenshots__item__link">
<img src="{{ site.baseurl }}/assets/images/home/thumbs/rctgo.png" class="main-feature__screenshots__item__image" />
</a>
</div>
<div class="main-feature__screenshots__item">
<a href="{{ site.baseurl }}/assets/images/home/storymunch.png" data-featherlight="image" class="main-feature__screenshots__item__link">
<img src="{{ site.baseurl }}/assets/images/home/thumbs/storymunch.png" class="main-feature__screenshots__item__image" />
</a>
</div>
<div class="main-feature__screenshots__item">
<a href="{{ site.baseurl }}/assets/images/home/mybboost.png" data-featherlight="image" class="main-feature__screenshots__item__link">
<img src="{{ site.baseurl }}/assets/images/home/thumbs/mybboost.png" class="main-feature__screenshots__item__image" />
</a>
</div>
<div class="main-feature__screenshots__item">
<a href="{{ site.baseurl }}/assets/images/home/damnfineshave.png" data-featherlight="image" class="main-feature__screenshots__item__link">
<img src="{{ site.baseurl }}/assets/images/home/thumbs/damnfineshave.png" class="main-feature__screenshots__item__image" />
</a>
</div>
</div>
</div>
<p class="main-feature__description">MyBB is the <strong>free and open source</strong> forum software powering thousands of engaging, vibrant, and unique communities across the internet.</p>
<div class="main-feature__buttons">
<a href="{{ site.baseurl }}/download" class="button button--big button--invert">{% include icon.html icon='download' %}Download now</a>
<a href="#features" class="button button--big button--secondary">{% include icon.html icon='rocket' %}Take the feature tour</a>
</div>
</div>
</header>
<section class="home-block home-block--why">
<div class="wrapper">
<h1 class="home-block__title">Why MyBB?</h1>
<h2 class="home-block__subtitle">There are plenty of reasons to use MyBB, but these are some of our favorites.</h2>
<div class="action-cards action-cards--four">
<div class="action-cards__card">
<a href="https://community.mybb.com" class="action-cards__card__link">
<span class="action-cards__card__icon">{% include icon.html icon='comments' %}</span>
<h3 class="action-cards__card__title">Rad Community</h3>
<p class="action-cards__card__description">MyBB's friendly community will help you get <em>your</em> community started.</p>
<p class="action-cards__card__action"><span>Visit MyBB Community</span> {% include icon.html icon='arrow-right' %}</p>
</a>
</div>
<div class="action-cards__card">
<a href="https://community.mybb.com/mods.php" class="action-cards__card__link">
<span class="action-cards__card__icon">{% include icon.html icon='puzzle-piece' %}</span>
<h3 class="action-cards__card__title">Extendable</h3>
<p class="action-cards__card__description">Hundreds of plugins and themes make adding new features or a new look easy.</p>
<p class="action-cards__card__action"><span>Browse extensions</span> {% include icon.html icon='arrow-right' %}</p>
</a>
</div>
<div class="action-cards__card">
<a href="#features" class="action-cards__card__link">
<span class="action-cards__card__icon">{% include icon.html icon='magic' %}</span>
<h3 class="action-cards__card__title">Simple to Use</h3>
<p class="action-cards__card__description">MyBB offers an extensive range of features in an intuitive interface.</p>
<p class="action-cards__card__action"><span>Take the feature tour</span> {% include icon.html icon='arrow-right' %}</p>
</a>
</div>
<div class="action-cards__card">
<a href="https://community.mybb.com/mods.php?action=browse&category=19" class="action-cards__card__link">
<span class="action-cards__card__icon">{% include icon.html icon='language' %}</span>
<h3 class="action-cards__card__title">Multilingual</h3>
<p class="action-cards__card__description">Community-maintained translations are available for more than 30 languages.</p>
<p class="action-cards__card__action"><span>Browse translations</span> {% include icon.html icon='arrow-right' %}</p>
</a>
</div>
</div>
</div>
</section>
<section class="home-block home-block--get-involved">
<div class="wrapper">
<h1 class="home-block__title">Get Involved</h1>
<h2 class="home-block__subtitle home-block--get-involved__subtitle">We're a free and open source project run by volunteers, so contributions from the community keep us going!</h2>
<div class="home-block__buttons">
<a href="{{ site.baseurl }}/get-involved" class="button button--medium">{% include icon.html icon='users' %} Contribute to MyBB</a>
<a href="{{ site.baseurl }}/about/donations" class="button button--medium button--secondary">{% include icon.html icon='dollar-sign' %} Donate to MyBB</a>
<a href="{{ site.baseurl }}/about" class="button button--medium button--secondary">{% include icon.html icon='info-circle' %} About the MyBB Project</a>
</div>
</section>
<section class="home-block home-block--features" id="features">
<div class="wrapper">
<h1 class="home-block__title">Even more to offer</h1>
<h2 class="home-block__subtitle">Don't miss any of the great features you can get with MyBB!</h2>
<div class="feature-tour__footer__list">
{% for item in site.data.features %}
{% assign item_url = item | prepend:"/features/" | append:"/" %}
{% assign p = site.features | where:"url", item_url | first %}
<div class="feature-tour__footer__list__item">
{% include icon.html icon=p.icon %}
<h2 class="feature-tour__footer__list__item__title"><a href="{{ site.baseurl }}{{ item_url }}" class="feature-tour__footer__list__item__link">{{ p.title }}</a></h2>
<p class="feature-tour__footer__list__item__description">{{ p.meta_description }}</p>
</div>
{% endfor %}
</div>
</div>
</section>
<section class="home-block home-block--download">
<div class="wrapper">
<h1 class="home-block__title">Ready to get started?</h1>
<h2 class="home-block__subtitle">If you're curious about what MyBB has to offer, check out our <a href="#features" class="home-block__subtitle__link">Feature Tour</a> or have a look at the <a href="https://docs.mybb.com" class="home-block__subtitle__link">Docs</a>.</h2>
<div class="home-block__buttons">
<a href="{{ site.baseurl }}/download" class="button button--big button--secondary button--primary-border">{% include icon.html icon='download' %}Download now</a>
</div>
</section>
</article>