mane homepage currator a bit smarter and easier to update

3 files changed, 14 insertions, 9 deletions

diff --git a/design/sass/_writing_details.scss b/design/sass/_writing_details.scss
index 8acc70b..82f1376 100644
--- a/design/sass/_writing_details.scss
+++ b/design/sass/_writing_details.scss
@@ -246,8 +246,8 @@ img.picwide {
     }
     @include breakpoint(delta) {
         margin-left: -245px;
-        width: 1170px;
-        max-width: 1170px;
+        width: 1140px;
+        max-width: 1140px;
     }
 }
 .picwide figcaption {
@@ -257,17 +257,17 @@ img.picwide {
     @include generic_sans;
     @include breakpoint(gamma) {
         text-align: right;
-        margin-left: -140px;
         width: 960px;
         max-width: 960px;
     }
     @include breakpoint(delta) {
-        margin-left: -245px;
-        margin-top: -10px;
         width: 1170px;
         max-width: 1170px;
     }
 }
+figure.picwide > img.picwide {
+    margin: auto !important;
+}
 .picwide960 {
     clear: both;
     margin: 1em 0;
diff --git a/design/templates/admin/jrnl/change_form.html b/design/templates/admin/jrnl/change_form.html
index 13d3790..880e9c9 100644
--- a/design/templates/admin/jrnl/change_form.html
+++ b/design/templates/admin/jrnl/change_form.html
@@ -12,6 +12,11 @@ $(function(){
     $('#id_body_markdown').each(function(){
         $(this).after('<iframe frameborder="0" style="border: #dddddd 1px solid;margin-left: 20px;width:330px; height:720px;" src="/luximages/insert/?textarea='+this.id+'"></iframe>');
     });
+    $('#id_images').css('width', '500px').css('height', '400px');
+    $('#id_images option').each(function(){
+        $(this).attr('style', 'background: url('+$(this).text().split("qq")[1]+') no-repeat; background-size: 120px 80px; height: 80px; padding-left: 125px; line-height: 80px; margin-bottom: 4px; padding-bottom: 5px;border-bottom: #eee 1px solid;');
+        $(this).html($(this).text().split("qq")[0] + ' &ndash; <a href="/admin/photos/luximage/'+ $(this).text().split("qq")[2]+'/change/">edit</a>')
+    });
 });
 </script>
 
diff --git a/design/templates/archives/homepage.html b/design/templates/archives/homepage.html
index 98d9937..1a1a406 100644
--- a/design/templates/archives/homepage.html
+++ b/design/templates/archives/homepage.html
@@ -1,4 +1,5 @@
 {% extends 'base.html' %}
+{% load get_image_by_size %}
 {% load typogrify_tags %}
 {%block htmlclass%}class="black"{%endblock%}
 {% block sitename %}
@@ -11,11 +12,10 @@
         <article class="h-entry hentry" itemscope itemType="http://schema.org/Article">
             <div class="post--image">
                 <a href="{{object.get_absolute_url}}" title="{{object.title}}">
+                    {%for image in homepage.images.all%}
                     <img class="u-photo post-image homepage--hero"  itemprop="image" sizes="(max-width: 960px) 100vw"
-                                                                                     srcset="{{IMAGES_URL}}{% now "Y"%}/{{homepage.image_base_url}}-640.jpg 640w,
-                                {{IMAGES_URL}}{% now "Y"%}/{{homepage.image_base_url}}.jpg 1140w,
-                                {{IMAGES_URL}}{% now "Y"%}/{{homepage.image_base_url}}-2280.jpg 2280w"
-                                                                                     src="{{IMAGES_URL}}{% now "Y"%}/{{homepage.image_base_url}}.jpg" alt="{{homepage.alt_text}}">
+srcset="{% for size in image.sizes.all%}{% get_image_by_size image size %} {{size}}w{% if forloop.last%}"{%else%}, {%endif%}{%endfor%}
+                                                                                     {% for size in image.sizes.all%}{%if not forloop.first and not forloop.last%}src="{% get_image_by_size image size %}"{%endif%}{%endfor%} alt="{{image.alt}} photographed by {% if image.photo_credit_source %}{{image.photo_credit_source}}{%else%}luxagraf{%endif%}">{%endfor%}
                 </a>
             </div>
             <div class="hero--wrapper">