Added random image card placeholder illustrations

no refs.
- three random illustrations loop as image placeholder illustrations
- increased padding of clickable area for better happy-go-clicky

app/styles/spirit/_koenig.css

@@ -649,7 +649,7 @@
   opacity: 1.0;
 }
 
-.kg-placeholder-image-summer {
+.kg-placeholder-image {
     width: 152px;
     height: 122px;
 }

lib/koenig-editor/addon/components/koenig-card-image.js

@@ -131,6 +131,9 @@ export default Component.extend({
     didReceiveAttrs() {
         this._super(...arguments);
 
+        let placeholders = ['summer', 'mountains', 'ufo-attack'];
+        this.placeholder = placeholders[Math.floor(Math.random() * placeholders.length)];
+
         // `payload.files` can be set if we have an externaly set image that
         // should be uploaded. Typical example would be from a paste or drag/drop
         if (!isEmpty(this.payload.files)) {

lib/koenig-editor/addon/templates/components/koenig-card-image.hbs

@@ -50,8 +50,8 @@
                     {{else if uploader.isUploading}}
                         {{uploader.progressBar}}
                     {{else if (not previewSrc payload.src)}}
-                        <button class="flex flex-column items-center center sans-serif fw4 f7 middarkgrey pa8 pt6 pb6 kg-image-button" onclick={{action "triggerFileDialog"}}>
-                            {{svg-jar "summer" class="kg-placeholder-image-summer"}}
+                        <button class="flex flex-column items-center center sans-serif fw4 f7 middarkgrey pa16 pt14 pb14 kg-image-button" onclick={{action "triggerFileDialog"}}>
+                            {{svg-jar this.placeholder class="kg-placeholder-image"}}
                             <span class="mt2 midgrey">Click to select an image</span>
                         </button>
                     {{/if}}