JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://cdn.sencha.com/ext/gpl/5.1.0/build/packages/ext-theme-classic/build/resources/ext-theme-classic-all.css">
<script src="http://cdn.sencha.com/ext/gpl/5.1.0/build/ext-all.js"></script>
<script src="http://cdn.sencha.com/ext/gpl/5.1.0/build/packages/ext-theme-classic/build/ext-theme-classic.js"></script>
JavaScript
Ext.onReady(function() {
var Viewport = Ext.create("Ext.container.Viewport", {
id: "Viewport",
layout: "border",
style: 'background: #fff; text-align:left;',
frame: true,
items: [
{
xtype: "toolbar",
height: 35,
region: "north",
frame: true,
},
{
xtype: "toolbar",
height: 28,
region: 'south',
html: "<center>ExtJs 5.1</center>",
},
{
xtype: "panel",
height: 500,
region: "west",
split: true,
collapsible: true,
autoScroll: true,
layout: 'accordion',
items: [{ xtype: "panel", title: "Панель №1" }, { xtype: "panel", title: "Панель №12121212" }, { xtype: "panel", title: "Панель №3" }]
},
{
xtype: "panel",
id: "center_panel",
region: 'center',
autoScroll: true,
items: [{
xtype: 'window',
title: "Window №1",
width: 350, height: 250,
maximizable: true,
resizable: true,
border: false,
layout: 'border',
autoShow: true,
constrain: true,
x: 0,
y: 0
}]
}
]
});
});