EbookFoundation
/
regluit
mirror of https://github.com/EbookFoundation/regluit.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Tweak download options a bit more

foundation/download
nicholas antonov 2018-04-26 02:41:32 -04:00
parent cd249b667f
commit ef5d0e6bd5
3 changed files with 65 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/templates/base.html
View File

@ -143,14 +143,6 @@
{% block content %}{% endblock %}
{% block footer %}
<div class="footer hide utilityheaders">
<ul>
<li><a href="{% url 'about' %}">Team</a></li>
<li><a href="https://blog.unglue.it">Blog</a></li>
<li><a href="{% url 'terms' %}">Terms of Use</a></li>
<li><a href="{% url 'faq' %}">General FAQ</a></li>
</ul>
</div>
<div class="footer utilityheaders">
<div class="column">
<span>About Unglue.it</span>

20
frontend/templates/download.html
View File

@ -121,8 +121,16 @@
<div class="ebook_download">
{% for ebook in other_ebooks %}
<div class="download_option flexible card">
<span class="ebook_format_label h4">{{ebook.format}}:<img class="hide-for-small-only" src="/static/images/{{ ebook.format }}32.png" height="32" alt="{{ ebook.format }} at {{ebook.provider}}" title="{{ ebook.format }} at {{ebook.provider}}" /></span>
<a href="{% url 'download_ebook' ebook.id %}">
<a href="{% url 'download_ebook' ebook.id %}" class="download-label h4">
<span class="hide-for-medium" >
{{ebook.format}}:
</span>
<img class="hide-for-small-only" src="/static/images/{{ ebook.format }}32.png" height="32" alt="{{ ebook.format }} at {{ebook.provider}}" title="{{ ebook.format }} at {{ebook.provider}}" />
<span class="hide-for-small-only" >
{{ ebook.format }} {% if ebook.version_label %} ({{ ebook.version_label }}) {% endif %} at {{ ebook.provider }}
</span>
</a>
<a href="{% url 'download_ebook' ebook.id %}" class="hide-for-medium">
<i class="fa fa-download fa-2x" title="Download {{ebook.format}}"></i>
</a>
{% if ebook.is_direct %}
@ -422,10 +430,14 @@
<p><a href="{% url 'feedback' %}?page={{request.build_absolute_uri|urlencode:""}}">Ask us a question!</a></p>
<div>
<a href="http://www.defectivebydesign.org/drm-free"><img src="/static/images/DRM-free150.png" alt="DefectiveByDesign.org" border="0" align="middle" /></a> All downloads from Unglue.it are DRM free. Hooray!
<a href="https://www.defectivebydesign.org/drm-free">
<img src="/static/images/DRM-free150.png" alt="DefectiveByDesign.org" border="0" align="middle" />
</a>
<span>
All downloads from Unglue.it are DRM free. Hooray!
</span>
</div>
</div>
{% else %}
{% endif %}
{% endif %}
</div>

87
static/scss/download.scss
View File

@ -102,43 +102,54 @@
margin: 0px 10px;
}
@supports (grid-template-rows: auto) {
@include breakpoint (medium) {
.download_container {
width: 75%;
margin: auto;
}
#download_content {
display: flex;
flex-direction: row;
flex-wrap: wrap;
.rh_ask, #askblock {
padding: 15px;
flex: 1 0 50%;
}
}
.ebook_download {
flex-direction: row;
flex-wrap: wrap;
}
.download_option.flexible {
flex: 1 0 40%;
flex-direction: column;;
& > * {
margin: 0px;
padding: 6px 0px;
}
i {
padding: 10px;
}
}
@include breakpoint (small down) {
.download_option > * {
flex: 1 1 0;
display: flex;
justify-content: center;
}
}
@include breakpoint (medium) {
.download_container {
width: 75%;
margin: auto;
}
#download_content {
display: flex;
flex-direction: row;
flex-wrap: wrap;
.rh_ask, #askblock {
padding: 15px;
flex: 1 0 50%;
}
}
.ebook_download {
flex-direction: row;
flex-wrap: wrap;
}
.download_option.flexible {
flex: 1 0 40%;
flex-direction: column;
& > * {
margin: 0px;
padding: 6px 0px;
}
i {
padding: 10px;
}
}
.download-label {
display: flex;
flex-direction: row;
align-items: center;
}
}