JSFiddle - React, Tailwind, and code Playground
CSS
/* For sample only: Apply fixed 1080p body sizing/scaling */
body {
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 3. Set up main view |
// +---------------------------+
// source/views.js ========================================================
var kind = require('enyo/kind'),
Panels = require('moonstone/Panels');
var MainView = kind({
name: 'MainView',
classes: 'moon enyo-fit',
components: [
{kind: Panels, classes: 'enyo-fit', pattern: 'alwaysviewing', popOnBack: true, components: [
{title: 'Config'}
]}
]
});
// source/app.js =========================================================
require('enyo/options').accessibility = true;
var
ready = require('enyo/ready');
ready(function () {
new MainView().renderInto(document.body);
});