changeset 5098355e20ea in www.tryton.org:default
details: https://hg.tryton.org/www.tryton.org?cmd=changeset;node=5098355e20ea
description:
Optimize size of large images per screen size
diffstat:
static/images/banner-contribute-400px.jpg | Bin
static/images/banner-contribute-800px.jpg | Bin
static/images/banner-donate-400px.jpg | Bin
static/images/banner-donate-800px.jpg | Bin
static/images/banner-download-400px.jpg | Bin
static/images/banner-download-800px.jpg | Bin
static/images/banner-forum-400px.jpg | Bin
static/images/banner-forum-800px.jpg | Bin
static/images/banner-foundation-400px.jpg | Bin
static/images/banner-foundation-800px.jpg | Bin
static/images/banner-presentations-400px.jpg | Bin
static/images/banner-presentations-800px.jpg | Bin
static/images/banner-service-providers-start-400px.jpg | Bin
static/images/banner-service-providers-start-800px.jpg | Bin
static/images/banner-success-stories-400px.jpg | Bin
static/images/banner-success-stories-800px.jpg | Bin
static/images/placeholder-large-400px.jpg | Bin
static/images/placeholder-large-800px.jpg | Bin
static/images/slide1-400px.jpg | Bin
static/images/slide1-800px.jpg | Bin
static/images/slide2-400px.jpg | Bin
static/images/slide2-800px.jpg | Bin
static/images/slide3-400px.jpg | Bin
static/images/slide3-800px.jpg | Bin
static/images/slide4-400px.jpg | Bin
static/images/slide4-800px.jpg | Bin
templates/contribute.html | 7 ++++++-
templates/donate.html | 7 ++++++-
templates/download.html | 7 ++++++-
templates/forum.html | 7 ++++++-
templates/foundation.html | 7 ++++++-
templates/index.html | 11 +++++++----
templates/layout.html | 2 +-
templates/presentations.html | 7 ++++++-
templates/service_providers_start.html | 4 +++-
templates/success_stories.html | 7 ++++++-
templates/utils.html | 17 +++++++++++++++++
37 files changed, 70 insertions(+), 13 deletions(-)
diffs (284 lines):
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-contribute-400px.jpg
Binary file static/images/banner-contribute-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-contribute-800px.jpg
Binary file static/images/banner-contribute-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-donate-400px.jpg
Binary file static/images/banner-donate-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-donate-800px.jpg
Binary file static/images/banner-donate-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-download-400px.jpg
Binary file static/images/banner-download-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-download-800px.jpg
Binary file static/images/banner-download-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-forum-400px.jpg
Binary file static/images/banner-forum-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-forum-800px.jpg
Binary file static/images/banner-forum-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-foundation-400px.jpg
Binary file static/images/banner-foundation-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/banner-foundation-800px.jpg
Binary file static/images/banner-foundation-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea
static/images/banner-presentations-400px.jpg
Binary file static/images/banner-presentations-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea
static/images/banner-presentations-800px.jpg
Binary file static/images/banner-presentations-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea
static/images/banner-service-providers-start-400px.jpg
Binary file static/images/banner-service-providers-start-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea
static/images/banner-service-providers-start-800px.jpg
Binary file static/images/banner-service-providers-start-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea
static/images/banner-success-stories-400px.jpg
Binary file static/images/banner-success-stories-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea
static/images/banner-success-stories-800px.jpg
Binary file static/images/banner-success-stories-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/placeholder-large-400px.jpg
Binary file static/images/placeholder-large-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/placeholder-large-800px.jpg
Binary file static/images/placeholder-large-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide1-400px.jpg
Binary file static/images/slide1-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide1-800px.jpg
Binary file static/images/slide1-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide2-400px.jpg
Binary file static/images/slide2-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide2-800px.jpg
Binary file static/images/slide2-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide3-400px.jpg
Binary file static/images/slide3-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide3-800px.jpg
Binary file static/images/slide3-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide4-400px.jpg
Binary file static/images/slide4-400px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea static/images/slide4-800px.jpg
Binary file static/images/slide4-800px.jpg has changed
diff -r b636a1de7aca -r 5098355e20ea templates/contribute.html
--- a/templates/contribute.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/contribute.html Fri Apr 12 15:56:53 2019 +0200
@@ -11,8 +11,13 @@
]
%}
{% extends "layout-toc.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-contribute') }}
+{% endblock %}
{% block content %}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-contribute.jpg') }});">
+<section class="section section-banner background-banner-contribute filter
filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/donate.html
--- a/templates/donate.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/donate.html Fri Apr 12 15:56:53 2019 +0200
@@ -11,8 +11,13 @@
]
%}
{% extends "layout-toc.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-donate') }}
+{% endblock %}
{% block content %}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-donate.jpg') }});">
+<section class="section section-banner background-banner-donate filter
filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ heart | safe }}
{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/download.html
--- a/templates/download.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/download.html Fri Apr 12 15:56:53 2019 +0200
@@ -11,8 +11,13 @@
]
%}
{% extends "layout-toc.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-download') }}
+{% endblock %}
{% block content %}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-download.jpg') }});">
+<section class="section section-banner background-banner-download filter
filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/forum.html
--- a/templates/forum.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/forum.html Fri Apr 12 15:56:53 2019 +0200
@@ -6,8 +6,13 @@
]
%}
{% extends "layout-toc.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-forum') }}
+{% endblock %}
{% block content %}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-forum.jpg') }});">
+<section class="section section-banner background-banner-forum filter
filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/foundation.html
--- a/templates/foundation.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/foundation.html Fri Apr 12 15:56:53 2019 +0200
@@ -1,9 +1,14 @@
{% set title = "Foundation" %}
{% set description = "The Tryton Foundation aims to protect, promote and
develop Tryton as Free Software" %}
{% extends "layout.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-foundation') }}
+{% endblock %}
{% block content %}
{{ super() }}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-foundation.jpg') }});">
+<section class="section section-banner background-banner-foundation filter
filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">Tryton
Foundation</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/index.html
--- a/templates/index.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/index.html Fri Apr 12 15:56:53 2019 +0200
@@ -1,6 +1,9 @@
{% set title = "Modularity, scalability & security for your business" %}
{% set description = "TRYTON is business software, ideal for companies of any
size, easy to use, complete and 100% Open Source." %}
{% extends "layout.html" %}
+{% macro slide_img(i, alt) %}
+<img class="d-block w-100 img-fluid" src="{{ url_for('static',
filename='images/slide%i.jpg' % i) }}" sizes="100vw" srcset="{{
url_for('static', filename='images/slide%i.jpg' % i) }} 1920w, {{
url_for('static', filename='images/slide%i-800px.jpg' % i) }} 800w, {{
url_for('static', filename='images/slide%i-400px.jpg' % i) }} 400w" alt="{{ alt
}}">
+{% endmacro %}
{% block header %}
{{ super() }}
<div id="carousel-header" class="carousel slide carousel-fade"
data-ride="carousel">
@@ -12,7 +15,7 @@
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
- <img class="d-block w-100 img-fluid" src="{{ url_for('static',
filename='images/slide1.jpg') }}" width="1920" height="500" alt="First slide">
+ {{ slide_img(1, "First slide") }}
<div class="carousel-caption">
<div class="container">
<h2>
@@ -26,7 +29,7 @@
</div>
</div>
<div class="carousel-item">
- <img class="d-block w-100 img-fluid" src="{{ url_for('static',
filename='images/slide2.jpg') }}" width="1920" height="500" alt="Second Slide">
+ {{ slide_img(2, "Second Slide") }}
<div class="carousel-caption">
<div class="container">
<h2>
@@ -40,7 +43,7 @@
</div>
</div>
<div class="carousel-item">
- <img class="d-block w-100 img-fluid" src="{{ url_for('static',
filename='images/slide3.jpg') }}" width="1920" height="500" alt="Third slide">
+ {{ slide_img(3, "Third slide") }}
<div class="carousel-caption">
<div class="container">
<h2>
@@ -54,7 +57,7 @@
</div>
</div>
<div class="carousel-item">
- <img class="d-block w-100 img-fluid" src="{{ url_for('static',
filename='images/slide4.jpg') }}" width="1920" height="500" alt="Forth slide">
+ {{ slide_img(4, "Forth slide") }}
<div class="carousel-caption">
<div class="container">
<h2>
diff -r b636a1de7aca -r 5098355e20ea templates/layout.html
--- a/templates/layout.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/layout.html Fri Apr 12 15:56:53 2019 +0200
@@ -75,7 +75,7 @@
<footer id="footer">
{% block footer %}
- <img class="img-fluid wow fadeIn" src="{{ url_for('static',
filename='images/placeholder-large.jpg') }}" width="1920" height="350"
alt="Placeholder Large"/>
+ <img class="img-fluid wow fadeIn" src="{{ url_for('static',
filename='images/placeholder-large.jpg') }}" sizes="100vw" srcset="{{
url_for('static', filename='images/placeholder-large.jpg') }} 1920w, {{
url_for('static', filename='images/placeholder-large-800px.jpg') }} 800w, {{
url_for('static', filename='images/placeholder-large-400px.jpg') }} 400w"
alt="Placeholder Large"/>
<section class="topfooter">
<div class="container">
<div class="row">
diff -r b636a1de7aca -r 5098355e20ea templates/presentations.html
--- a/templates/presentations.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/presentations.html Fri Apr 12 15:56:53 2019 +0200
@@ -14,8 +14,13 @@
]
%}
{% extends "layout-toc.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-presentations') }}
+{% endblock %}
{% block content %}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-presentations.jpg') }});">
+<section class="section section-banner background-banner-presentations filter
filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/service_providers_start.html
--- a/templates/service_providers_start.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/service_providers_start.html Fri Apr 12 15:56:53 2019 +0200
@@ -7,6 +7,7 @@
]
%}
{% extends "layout-toc.html" %}
+{% from "utils.html" import background %}
{% block style %}
{{ super() }}
<style>
@@ -18,9 +19,10 @@
content: counter(step) ". ";
}
</style>
+{{ background('banner-service-providers-start') }}
{% endblock style %}
{% block content %}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-service-providers-start.jpg') }});">
+<section class="section section-banner
background-banner-service-providers-start filter filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/success_stories.html
--- a/templates/success_stories.html Sat Apr 06 13:54:00 2019 +0200
+++ b/templates/success_stories.html Fri Apr 12 15:56:53 2019 +0200
@@ -1,8 +1,13 @@
{% set title = "Success Stories" %}
{% extends "layout.html" %}
+{% from "utils.html" import background %}
+{% block style %}
+{{ super() }}
+{{ background('banner-success-stories') }}
+{% endblock %}
{% block content %}
{{ super() }}
-<section class="section section-banner filter filter-primary text-center"
style="background-image:url({{ url_for('static',
filename='images/banner-success-stories.jpg') }});">
+<section class="section section-banner background-banner-success-stories
filter filter-primary text-center">
<div class="container">
<h1 class="mb-0 text-white position-relative z-1">{{ title }}</h1>
</div>
diff -r b636a1de7aca -r 5098355e20ea templates/utils.html
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/templates/utils.html Fri Apr 12 15:56:53 2019 +0200
@@ -0,0 +1,17 @@
+{% macro background(name) %}
+<style>
+.background-{{ name }} {
+ background-image: url({{ url_for('static', filename='images/%s.jpg' %
name) }});
+}
+@media (max-width: 800px) {
+ .background-{{ name }} {
+ background-image: url({{ url_for('static',
filename='images/%s-800px.jpg' % name) }});
+ }
+}
+@media (max-width: 400px) {
+ .background-{{ name }} {
+ background-image:url({{ url_for('static',
filename='images/%s-400px.jpg' % name) }});
+ }
+}
+</style>
+{% endmacro %}
