From: XhmikosR <xhmikosr@gmail.com>
Date: Thu, 15 Nov 2018 06:22:10 +0000 (+0200)
Subject: homepage: use srcset.
X-Git-Tag: v4.2.0~60
X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=d5279bf18cfd66fa3ab9d989d6b18c9bb272a74d;p=thirdparty%2Fbootstrap.git

homepage: use srcset.

This should reduce the amount of bytes for non-2x displays.
---

diff --git a/site/docs/4.1/assets/img/bootstrap-stack.png b/site/docs/4.1/assets/img/bootstrap-stack.png
index 7cae17fe2e..b6c7ed8d0f 100644
Binary files a/site/docs/4.1/assets/img/bootstrap-stack.png and b/site/docs/4.1/assets/img/bootstrap-stack.png differ
diff --git a/site/docs/4.1/assets/img/bootstrap-stack@2x.png b/site/docs/4.1/assets/img/bootstrap-stack@2x.png
new file mode 100644
index 0000000000..7cae17fe2e
Binary files /dev/null and b/site/docs/4.1/assets/img/bootstrap-stack@2x.png differ
diff --git a/site/docs/4.1/assets/img/bootstrap-themes.png b/site/docs/4.1/assets/img/bootstrap-themes.png
index 3876a18ee3..15f33f3f7b 100644
Binary files a/site/docs/4.1/assets/img/bootstrap-themes.png and b/site/docs/4.1/assets/img/bootstrap-themes.png differ
diff --git a/site/docs/4.1/assets/img/bootstrap-themes@2x.png b/site/docs/4.1/assets/img/bootstrap-themes@2x.png
new file mode 100644
index 0000000000..3876a18ee3
Binary files /dev/null and b/site/docs/4.1/assets/img/bootstrap-themes@2x.png differ
diff --git a/site/index.html b/site/index.html
index ebe84841fc..2348f7ce8f 100644
--- a/site/index.html
+++ b/site/index.html
@@ -6,7 +6,9 @@ layout: home
   <div class="container">
     <div class="row align-items-center">
       <div class="col-6 mx-auto col-md-6 order-md-2">
-        <img class="img-fluid mb-3 mb-md-0" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-stack.png" alt="" width="1024" height="860">
+        <img class="img-fluid mb-3 mb-md-0" srcset="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-stack.png,
+                                                    {{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-stack@2x.png 2x"
+                                            src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-stack.png" alt="" width="512" height="430">
       </div>
       <div class="col-md-6 order-md-1 text-center text-md-left pr-md-5">
         <h1 class="mb-3 bd-text-purple-bright">Bootstrap</h1>
@@ -80,7 +82,9 @@ gem install bootstrap -v {{ site.current_ruby_version }}
     <p>
       Take Bootstrap 4 to the next level with official premium themes—toolkits built on Bootstrap with new components and plugins, docs, and build tools.
     </p>
-    <img class="img-fluid mt-3 mx-auto" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-themes.png" alt="Bootstrap Themes" width="1024" height="388">
+    <img class="img-fluid mt-3 mx-auto" srcset="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-themes.png,
+                                                {{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-themes@2x.png 2x"
+                                        src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/img/bootstrap-themes.png" alt="Bootstrap Themes" width="500" height="200">
     <hr class="half-rule">
     <a href="{{ site.themes }}/" class="btn btn-outline-primary">Browse themes</a>
   </div>