Skip to content

Commit

Permalink
Merge pull request #3579 from davidfischer/homepage-rework
Browse files Browse the repository at this point in the history 
Rework homepage
  • Loading branch information
@ericholscher
ericholscher authored Feb 9, 2018
2 parents ee81f28 + ad6ce6e commit 483a7a5
Show file tree
Hide file tree
Showing 5 changed files with 186 additions and 133 deletions.
39 changes: 39 additions & 0 deletions media/css/core.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -297,6 +297,45 @@ div.menu-user div.menu-dropdown.menu-dropped {
.home-header-links .login { font-weight: bold; color: #e3e3e3; text-shadow: 0px 1px 0 rgba(0, 0, 0, 0.5); }
.home-header-links .login:hover { text-align: center; color: #fff; }

section {
margin-bottom: 60px;
}
.home .lead {
font-size: 20px;
line-height: 30px;
}
.home .feature {
float: left;
width: 48%;
margin-left: 1%;
margin-right: 1%;
}

a.cta-btn {
/* Make this link look like a button */
width: 300px;
font-weight: bold;
text-align: center;
display: inline-block;
margin: .3em 0em;
font-size: 1.1em;
color: #fff;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
background: #e6e6e6 url(../images/gradient.png) repeat-x bottom left;
background-color: #8ECC4C;
border: 1px solid #bfbfbf;
border-color: #6B9939;
border-bottom-color: #50732B;
padding: 8px 15px;
border-radius: 3px;
text-decoration: none;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.5) inset;
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.5) inset;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.5) inset;
}
a.cta-btn:hover, a.cta-btn:active {
color: #fff;
}

/* wide search bar */

Expand Down
14 changes: 1 addition & 13 deletions readthedocs/core/views/__init__.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,20 +39,8 @@ class HomepageView(TemplateView):
def get_context_data(self, **kwargs):
"""Add latest builds and featured projects."""
context = super(HomepageView, self).get_context_data(**kwargs)
latest = []
latest_builds = (
Build.objects
.filter(
project__privacy_level=constants.PUBLIC,
success=True,
)
.order_by('-date')
)[:100] # yapf: disable
for build in latest_builds:
if (build.project not in latest and len(latest) < 10):
latest.append(build.project)
context['project_list'] = latest
context['featured_list'] = Project.objects.filter(featured=True)
context['projects_count'] = Project.objects.count()
return context


Expand Down
36 changes: 17 additions & 19 deletions readthedocs/templates/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,15 @@

<!-- meta -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
{% block extra_metas %}{% endblock extra_metas %}

<link rel="icon" type="image/png" href="{{ MEDIA_URL }}images/favicon.png">

<!-- title -->
<title>{% block title %}{% endblock %}{% block head_title %}{% endblock %} | {% block branding %}Read the Docs {% endblock %}</title>

<!-- Google Analytics -->
<script type="text/javascript">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
Expand All @@ -37,31 +39,27 @@
{% block extra_links %}{% endblock %}

<!-- jquery -->
<script type="text/javascript" src="{% static 'vendor/jquery.js' %}"></script>
<script type="text/javascript" src="{% static 'vendor/jquery-migrate.js' %}"></script>
<script type="text/javascript" src="{% static 'vendor/jquery-ui.js' %}"></script>
<script type="text/javascript">
<script src="{% static 'vendor/jquery.js' %}"></script>
<script src="{% static 'vendor/jquery-migrate.js' %}"></script>
<script src="{% static 'vendor/jquery-ui.js' %}"></script>
<script >
require('jquery');
</script>

<script type="text/javascript" src="{{ MEDIA_URL }}javascript/instantsearch.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}javascript/base.js"></script>
<script type="text/javascript" src="{% static 'core/js/site.js' %}"></script>
<script type="text/javascript">
<script src="{{ MEDIA_URL }}javascript/instantsearch.js"></script>
<script src="{{ MEDIA_URL }}javascript/base.js"></script>
<script src="{% static 'core/js/site.js' %}"></script>
<script>
var site = require('core/site');
site.handle_notification_dismiss();
</script>

{% block extra_scripts %}{% endblock %}

<!-- typekit -->
<!-- Old typekit
<script type="text/javascript" src="//use.typekit.com/xgl8ypn.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
-->

<script type="text/javascript" src="//use.typekit.net/haq4xtp.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<script src="//use.typekit.net/haq4xtp.js"></script>
<script>try{Typekit.load();}catch(e){}</script>

</head>

Expand Down Expand Up @@ -204,10 +202,10 @@ <h4>{% trans "Read the Docs" %}</h4>
</div>
<!-- END footer-->

</body>
<script>
{% block footerjs %}{% endblock %}
</script>

<script type="text/javascript">
{% block footerjs %}{% endblock %}
</script>
</body>

</html>
2 changes: 1 addition & 1 deletion readthedocs/templates/core/widesearchbar.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ <h3>{% trans "Search all the docs" %}</h3>

<form action="{% url "search" %}" method="GET">
<div class="text-input-wrapper">
<input type="text" name="q" value="{{ term }}" id="id_site_search">
<input type="text" name="q" value="{{ term }}" id="id_site_search" placeholder="{% trans 'Search Read the Docs' %}">
</div>
<div class="submit-input-wrapper">
{% comment %} Translators: This is about starting a search {% endcomment %}
Expand Down
228 changes: 128 additions & 100 deletions readthedocs/templates/homepage.html
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
{% extends "base.html" %}

{% load i18n %}

{% load humanize %}
{% load pagination_tags %}

{% block extra_metas %}
<meta name="description" content="{% trans "Read the Docs simplifies technical documentation by automating building, versioning, and hosting for you. Build up-to-date documentation for the web, print, and offline use on every version control push automatically." %}">
{% endblock extra_metas %}

{% block title %}{% trans "Home" %}{% endblock %}

{% block body_class %}home {% if not request.user.is_authenticated %}splash{% endif %}{% endblock %}
Expand Down Expand Up @@ -36,105 +40,129 @@

{% block content %}

<div class="module">
<div class="module-wrapper">

<div class="module-header">
<h3>{% trans "What is this place?" %}</h3>
<p>
{% blocktrans %}
Read the Docs hosts documentation, making it fully searchable and easy to find.
You can import your docs using any major version control system, including Mercurial, Git, Subversion, and Bazaar.
We support <a href="http://docs.readthedocs.io/en/latest/webhooks.html">webhooks</a> so your docs get built when you commit code.
There's also support for <a href="http://docs.readthedocs.io/en/latest/versions.html">versioning</a> so you can build docs from tags and branches of your code in your repository.
{% endblocktrans %}
</p>
<p>
{% blocktrans %}
Hosting documentation is free and simple,
<a href="https://docs.readthedocs.io/en/latest/getting_started.html">read our guide</a>
to get started!
{% endblocktrans %}
<p>
<p>
{% blocktrans %}
Read the Docs is <b>community supported</b>.
It depends on users like you to contribute to development,
support,
and operations.
You can learn more about how to <a href="https://docs.readthedocs.io/en/latest/contribute.html">contribute</a> in our docs.
Thanks so much to our wonderful <a href="https://docs.readthedocs.io/en/latest/team.html">community team</a> who helps us run the site.
Read the Docs wouldn't be possible without them.
Please consider joining today,
as we always need more contributors to the project.
{% endblocktrans %}
</p>
</div>

</div>
</div>

{% include "core/widesearchbar.html" %}

{% if featured_list %}
<!-- BEGIN projects list -->
<div class="module">
<div class="module-wrapper">

<div class="module-header">
<h3>{% trans "Featured Projects" %}</h3>
</div>

<div class="module-list">
<div class="module-list-wrapper">
<ul>
{% include "core/project_list_featured.html" %}
</ul>
</div>
</div>

</div>
</div>
<!-- END projects list -->
{% endif %}

<!-- BEGIN projects list -->
<div class="module">
<div class="module-wrapper">

<div class="module-header">
<h3>{% trans "Recently updated projects" %}</h3>
</div>

<div class="module-list">
<div class="module-list-wrapper">
<ul>
{% include "core/project_list_detailed.html" %}
</ul>
</div>
</div>

</div>
</div>
<!-- END projects list -->

<div>
<h3>{% trans "Read the Docs is funded by the community" %}</h3>
<p>
{% url "advertising" as advertising_url %}
{% url "donate" as sponsors_url %}
{% url "gold_detail" as gold_detail %}

Read the Docs is a huge resource that millions of developers rely on
for software documentation. It would not be possible without the
support of our
<a href="{{ sponsors_url | default:'https://readthedocs.org/sustainability/' }}">sponsors</a>,
<a href="{{ advertising_url | default:'https://readthedocs.org/sustainability/advertising/' }}">advertisers</a>,
and <a href="{{ gold_detail }}">readers like you</a>.
</p>
<p>
Hosting for the project is graciously provided by <a href="http://www.rackspace.com/cloud/">Rackspace</a>.
</p>
<!-- Lead -->
<section>
<h2>{% trans "Technical documentation lives here" %}</h2>
<p class="lead">
{% blocktrans %}
Read the Docs simplifies software documentation by automating building,
versioning, and hosting of your docs for you.
{% endblocktrans %}
</p>
</section>


<section>
<div class="feature">
<h3>Free docs hosting</h3>
<p>
{% with projects_count_intcomma=projects_count|intcomma %}
{% blocktrans %}
We will host your documentation for free forever.
There are no tricks. We help {{ projects_count_intcomma }} open source projects
share their docs.
{% endblocktrans %}
{% endwith %}
</p>
</div>
<div class="feature">
<h3>Webhooks</h3>
<p>
{% blocktrans %}
Whenever you push code to your favorite version control system,
whether that is Git, Mercurial, Bazaar, or Subversion, we will
automatically build your docs so your code and documentation are
never out of sync.
{% endblocktrans %}
</p>
</div>
<div class="clearfix"></div>
</section>

<section>
<div class="feature">
<h3>Multiple formats</h3>
<p>
{% blocktrans %}
Of course we build and host your docs for the web, but they are
also vieweable as PDFs, as single page HTML, and for eReaders.
No additional configuration is required.
{% endblocktrans %}
</p>
</div>
<div class="feature">
<h3>Multiple versions</h3>
<p>
{% blocktrans %}
We can host and build multiple versions of your docs so having a
1.0 version of your docs and a 2.0 version of your docs is as easy
as having a separate branch or tag in your version control system.
{% endblocktrans %}
</p>
</div>
<div class="clearfix"></div>
</section>

<!-- Call to action -->
<section>
<p style="text-align: center">
<a href="https://docs.readthedocs.io/en/latest/getting_started.html" class="cta-btn">{% trans 'Getting started guide' %}</a>
</p>
</section>

<!-- Search -->
<section>
{% include "core/widesearchbar.html" %}
<section>

{% if featured_list %}
<!-- BEGIN projects list -->
<section>
<h3>{% trans "Featured Projects" %}</h3>
<div class="module-list">
<div class="module-list-wrapper">
<ul style="margin-bottom: 0">
{% include "core/project_list_featured.html" %}
</ul>
</div>
</div>
</section>
<!-- END projects list -->
{% endif %}

<!-- Funding and Contributing -->
<section>
<h2>{% trans "Read the Docs is funded by the community" %}</h2>
<p>

{% url "advertising" as advertising_url %}
{% url "donate" as sponsors_url %}
{% url "gold_detail" as gold_detail %}

{% blocktrans %}
Read the Docs is a huge resource that millions of developers rely on
for software documentation. It would not be possible without the
support of our
<a href="{{ sponsors_url }}">sponsors</a>,
<a href="{{ advertising_url }}">advertisers</a>,
and <a href="{{ gold_detail }}">readers like you</a>.
{% endblocktrans %}
</p>

<p>
{% blocktrans %}
Read the Docs is <strong>community supported</strong>.
It depends on users like you to contribute to development, support, and operations.
You can learn more about how to <a href="https://docs.readthedocs.io/en/latest/contribute.html">contribute</a> in our docs.
Thanks so much to our wonderful <a href="https://docs.readthedocs.io/en/latest/team.html">community team</a> who helps us run the site.
Read the Docs wouldn't be possible without them.
{% endblocktrans %}
</p>

<p>
{% blocktrans %}
Hosting for the project is graciously provided by <a href="http://www.rackspace.com/cloud/">Rackspace</a>.
{% endblocktrans %}
</p>
</section>
{% endblock %}

0 comments on commit 483a7a5

Please sign in to comment.