JSFiddle - React, Tailwind, and code Playground

CSS

/* For sample only: Apply fixed 1080p body sizing/scaling */
body {
    overflow: visible !important;
    width: 1920px !important;
    height: 1080px !important;
    transform: scale3d(0.3, 0.3, 1);
    transform-origin: 0 0;
    -webkit-transform: scale3d(0.3, 0.3, 1);
    -webkit-transform-origin: 0 0;
    -moz-transform: scale3d(0.3, 0.3, 1);
    -moz-transform-origin: 0 0;
    -ms-transform: scale3d(0.3, 0.3, 1);
    -ms-transform-origin: 0 0;
    -o-transform: scale3d(0.3, 0.3, 1);
    -o-transform-origin: 0 0;
}

JavaScript

// +-------------------------------------------------------------+
// | Step 16. Fetch and bind detailed image data to detail panel |
// +-------------------------------------------------------------+

// source/views/views.js ========================================================

var kind = require('enyo/kind'),
    Panels = require('moonstone/Panels'),
		Panel = require('moonstone/Panel'),    
    DataGridList = require('moonstone/DataGridList'),
    GridListImageItem = require('moonstone/GridListImageItem'),
    Collection = require('enyo/Collection'),
    Spinner = require('moonstone/Spinner'),
    Image = require('moonstone/Image'),  
    FittableLayout = require('layout/FittableLayout'),
    FittableColumnsLayout = FittableLayout.Columns,
    ImageView = require('layout/ImageView'),
    Button = require('moonstone/Button');

var SearchPanel = kind({
  name: 'SearchPanel',
  kind: Panel,
  title: 'Search Flickr',
  titleBelow: 'Enter search term above',
  headerOptions: {inputMode: true, dismissOnEnter: true},
  headerComponents: [
    {kind: Spinner, content: 'Loading...', name: 'spinner'}
  ],
  handlers: {
    onInputHeaderChange: 'search'
  },
  events: {
    onRequestPushPanel: ''
  },
  components: [
    {kind: DataGridList, fit: true, name: 'resultList', ontap: 'itemSelected', minWidth: 250, minHeight: 300, components: [
      {kind: GridListImageItem, imageSizing: 'cover', useSubCaption: false, centered: false, bindings: [
        {from: 'model.title', to: 'caption'},
        {from: 'model.thumbnail', to: 'source'}
      ]}
    ]}
  ],
  bindings: [
  	{from: 'photos', to: '$.resultList.collection'},
    {from: 'photos.status', to:'$.spinner.showing', transform: function(value) {
      return this.photos.isBusy();
    }}
  ],
  create: function() {
    this.inherited(arguments);
    this.set('photos', new SearchCollection());
  },
  search: function(sender, ev) {  	
    this.$.resultList.collection.set('searchText', ev.originator.get('value'));
 ...