Skip to content

Commit 4775878

Browse files
bennypowersbennypowers
committed
wip: improve home page
1 parent 4b9c8df commit 4775878

File tree

2 files changed

+118
-31
lines changed

2 files changed

+118
-31
lines changed

‎docs/_includes/home.njk‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
{% extends 'layout.njk' %}
2+
3+
{% block bodyTag %}
4+
<body layout="home" home-layout="{{rocketLaunch.homeLayout}}">
5+
{% endblock bodyTag %}
6+
7+
{% block sidebar %}
8+
<rocket-drawer id="sidebar">
9+
<nav slot="content" id="sidebar-nav">
10+
{% include 'partials/logoLink.njk' %}
11+
<rocket-navigation>
12+
<ul>
13+
{%- for entry in collections.header %}
14+
<li>
15+
<a href="{{ entry.url | url }}" class="
16+
{% if entry.url == page.url %} current {% endif %}
17+
{% if (page.url.search(entry.url) !== -1) and (page.url !== '/') %} active {% endif %}
18+
">{{ entry.data.eleventyNavigation.key }}</a>
19+
</li>
20+
{%- endfor %}
21+
</ul>
22+
{% include 'partials/mobile-sidebar-bottom.njk' %}
23+
</rocket-navigation>
24+
</nav>
25+
</rocket-drawer>
26+
{% endblock sidebar %}
27+
28+
{% block main %}
29+
<main class="markdown-body">
30+
<img class="page-logo" src="{{ '_assets/logo.svg' | asset | url }}" alt="{{ site.title }} Logo"/>
31+
32+
{% if rocketLaunch.homeLayout === 'background' %}
33+
<img class="page-background" src="{{ '_assets/home-background.svg' | asset | url }}" role="presentation"/>
34+
{% endif %}
35+
36+
<h1 class="page-title">{{ title }}</h1>
37+
38+
<p class="page-slogan">{{slogan}}</p>
39+
40+
<div class="call-to-action-list" role="list">
41+
{% for callToAction in callToActionItems %}
42+
<a class="call-to-action" href="{{ callToAction.href | url }}" role="listitem">{{ callToAction.text | safe }}</a>
43+
{% endfor %}
44+
</div>
45+
46+
<h2 class="reason-header">{{ reasonHeader }}</h2>
47+
48+
<section id="features">
49+
{% for feature in features %}
50+
<article>
51+
<h3>{{ feature.name }}</h3>
52+
{% markdown %}{{ feature.text | safe }}{% endmarkdown %}
53+
<a class="screenshot" href="/api/{{ feature.slug }}/">
54+
<img src="{{ ('_assets/images/screenshot-' + feature.slug + '.png') | asset | url }}" alt="Screenshot of {{ feature.name }} feature"/>
55+
</a>
56+
</article>
57+
{% endfor %}
58+
</section>
59+
60+
{{ content | safe }}
61+
{% include 'partials/previousNext.njk' %}
62+
</main>
63+
{% endblock main %}

‎docs/index.md‎

Lines changed: 55 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,79 @@
11
---
2+
title: Atom Community
23
layout: home.njk
34
slogan: Community Maintained Packages for Atom
45
callToActionItems:
56
- text: Get Started
67
href: /getting-started/
78
- text: API
89
href: /api/
9-
---
10-
11-
# Atom Community
12-
13-
## Objective
14-
15-
The original objective of the Facebook [Nuclide](https://nuclide.io) / [Atom-IDE](https://ide.atom.io) project has been to provide extension packages for the [Atom Editor](https://www.atom.io) to interact with custom Language Servers via the [Language Server Protocol](https://langserver.org) to enable IDE like functionality in our beloved editor.
10+
features:
1611

17-
The original package was made of various "subpackages" that provide the overall functionality and were always build and released in a monolithic extension (aka atom-ide-ui).
18-
19-
The objective of this project is to take over the concepts and ideas in the original atom-ide-ui package, but provide individual extensions that can be developed, released and installed independently.
20-
21-
We will start with the most important features, and iterate on them quickly to come on par with the functionality available in the atom-ide-ui package.
12+
- name: AutoComplete
13+
slug: autocomplete
14+
text: Once you have installed an IDE language package, this should work right away.
2215

16+
- name: Linter
17+
slug: linter
18+
text: "[linter](https://atom.io/packages/linter) and [linter-ui](https://atom.io/packages/linter-ui-default) work with ide packages, letting you know what's wrong in your file."
2319

24-
## Atom IDE Community Packages
20+
- name: Signature Help
21+
slug: sig-help
22+
text: "No more looking up API docs: automatically get function signature docs in your editor."
2523

26-
### AutoComplete
24+
- name: DataTip
25+
slug: datatip
26+
text: "The docs you need, when you need them. Hover or cursor to a name to show floating data tips."
2727

28-
Once you have installed an IDE language package, this should work right away.
28+
- name: Outline
29+
slug: outline
30+
text: Browse the structure of your code at a glance.
2931

30-
![screenshot of autocomplete feature]({{ '/_assets/images/screenshot-autocomplete.png' | asset | url }})
32+
- name: Go to Definition
33+
slug: definitions
34+
text: Jump to a name's definition. Navigate large codebases with ease.
3135

32-
### [Signature Help](https://atom.io/packages/atom-ide-signature-help)
33-
34-
A replacement of the signature help functionality from atom-ide-ui. When you're calling a function, it can help you understand the parameters or information about the function you’re calling. [More details](https://github.com/atom-ide-community/atom-ide-signature-help#atom-ide-signature-help)
35-
36-
![screenshot of sig-help feature]({{ '/_assets/images/screenshot-sig-help.png' | asset | url }})
37-
38-
### [Go to Definition](https://atom.io/packages/atom-ide-definitions)
39-
40-
A replacement of the go to definition functionality from atom-ide-ui. [More details](https://github.com/atom-ide-community/atom-ide-definitions#atom-ide-definitions-package)
36+
---
4137

42-
### Linter / Linter-UI
38+
<style data-helmet>
39+
40+
#features {
41+
--feature-image-size: 180px;
42+
43+
display: grid;
44+
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
45+
column-gap: 100px;
46+
row-gap: 40px;
47+
color: var(--text-color);
48+
}
49+
50+
#features article,
51+
#features .screenshot {
52+
display: grid;
53+
}
54+
55+
#features .screenshot {
56+
align-content: center;
57+
width: var(--feature-image-size);
58+
height: var(--feature-image-size);
59+
overflow: hidden;
60+
border-radius: 100%;
61+
place-self: center;
62+
}
63+
64+
#features .screenshot img {
65+
height: var(--feature-image-size);
66+
}
67+
</style>
4368

44-
There is an existing [linter](https://atom.io/packages/linter) and [linter-ui](https://atom.io/packages/linter-ui-default) that is known to work with the existing ide-packages. It can be configured to only show linting errors per file, or for the whole project in its settings.
69+
The original objective of the Facebook [Nuclide](https://nuclide.io) / [Atom-IDE](https://ide.atom.io) project has been to provide extension packages for the [Atom Editor](https://www.atom.io) to interact with custom Language Servers via the [Language Server Protocol](https://langserver.org) to enable IDE like functionality in our beloved editor.
4570

46-
![screenshot of linter feature]({{ '/_assets/images/screenshot-linter.png' | asset | url }})
71+
The original package was made of various "subpackages" that provide the overall functionality and were always build and released in a monolithic extension (aka atom-ide-ui).
4772

48-
### [Outline](https://atom.io/packages/atom-ide-outline)
73+
The objective of this project is to take over the concepts and ideas in the original atom-ide-ui package, but provide individual extensions that can be developed, released and installed independently.
4974

50-
A replacement of the outline functionality from atom-ide-ui. Presents symbols of an active text editor in a tree view. [More details](https://github.com/atom-ide-community/atom-ide-outline)
75+
We will start with the most important features, and iterate on them quickly to come on par with the functionality available in the atom-ide-ui package.
5176

52-
![screenshot of outline feature]({{ '/_assets/images/screenshot-outline.png' | asset | url }})
5377

5478
## Roadmap
5579

0 commit comments

Comments
 (0)