<afx-app-window data-id = "blogger-win" apptitle="Blogger" width="600" height="500">
    <afx-hbox >
        <afx-tab-container data-id = "tabcontainer" dir = "row" tabbarwidth= "22">
            
            <afx-hbox data-id="user-container" data-height="100%" iconclass="fa fa-user-circle">
                <afx-vbox>
                    <afx-hbox data-height = "30">
                        <afx-label data-width= "70" text = "__(Full name)"></afx-label>
                        <input type = "text" name="fullname" input-class = "user-input"/>
                    </afx-hbox>
                    <afx-hbox data-height = "30">
                        <afx-label text = "__(Address)" data-width= "70"></afx-label>
                        <input type = "text" name="address" input-class = "user-input"/>
                    </afx-hbox>
                    <afx-hbox data-height = "30">
                        <afx-label text = "__(Phone)" data-width= "70"></afx-label>
                        <input type = "text" name="Phone" input-class = "user-input"/>
                    </afx-hbox>
                    <afx-hbox data-height = "30">
                        <afx-label text = "__(Email)" data-width= "70"></afx-label>
                        <input type = "text" name="email" input-class = "user-input"/>
                    </afx-hbox>
                    <afx-hbox data-height = "30">
                        <afx-label text = "__(Url)" data-width= "70"></afx-label>
                        <input type = "text" name="url" input-class = "user-input"/>
                    </afx-hbox>
                    <afx-hbox data-height = "30">
                        <afx-label text = "__(Photo)" data-width= "70"></afx-label>
                        <input type = "text" name="photo" data-id="photo" readonly="readonly" input-class = "user-input"/>
                    </afx-hbox>
                    <afx-label data-height = "30" text = "__(Short biblio)"></afx-label>
                    <textarea name="shortbiblio" input-class = "user-input"></textarea>
                    <afx-hbox data-height = "35">
                        <div></div>
                        <afx-button iconclass = "fa fa-save" data-id = "bt-user-save" data-width="60" text = "__(Save)"></afx-button>
                    </afx-hbox>
                </afx-vbox>
            </afx-hbox>
            
            <afx-hbox data-id="cv-container" data-height="100%" iconclass="fa fa-info-circle">
                <div data-width="5"></div>
                <afx-vbox data-width="150" min-width="100">
                        <afx-label class="lbl-header" data-height = "23" text = "__(Categories)" iconclass = "fa fa-bars"></afx-label>
                        <afx-tree-view data-id = "cv-list" ></afx-tree-view>
                        <afx-hbox data-height="30" class = "cv-side-bar-btn">
                            <afx-button data-id = "cv-cat-add" data-width = "25" text = "" iconclass = "fa fa-plus-circle"></afx-button>
                            <afx-button data-id = "cv-cat-del" data-width = "25" text = "" iconclass = "fa fa-minus-circle"></afx-button>
                            <afx-button data-id = "cv-cat-edit" data-width = "25" text = "" iconclass = "fa fa-pencil-square-o"></afx-button>
                        </afx-hbox>
                </afx-vbox>
                <afx-resizer data-width = "2"></afx-resizer>
                <afx-vbox>
                    <afx-list-view data-id = "cv-sec-list" ></afx-list-view>
                    <afx-hbox data-height="30" class = "cv-side-bar-btn">
                        <afx-label data-id = "cv-sec-status"></afx-label>
                        <afx-button data-id = "cv-sec-add" data-width = "25" text = "" iconclass = "fa fa-plus-circle"></afx-button>
                        <afx-button data-id = "cv-sec-edit" data-width = "25" text = "" iconclass = "fa fa-pencil-square-o"></afx-button>
                        <afx-button data-id = "cv-sec-move" data-width = "25" text = "" iconclass = "fa fa-exchange"></afx-button>
                    </afx-hbox>
                </afx-vbox>
                <div data-width="5"></div>
            </afx-hbox>
            
            
            <afx-hbox data-id = "blog-container" data-height="100%" iconclass="fa fa-book">
                <afx-list-view data-id = "blog-list" min-width="100" data-width="200"></afx-list-view>
                <afx-resizer data-width = "3"></afx-resizer>
                <afx-vbox>
                    <div data-id = "editor-container">
                        <textarea data-id="markarea" ></textarea>
                    </div>
                    <afx-label text = "__(Tags)" style="font-weight:bold;" data-height="25" ></afx-label>
                    <afx-hbox data-height="25">
                        <input type = "text" data-id = "input-tags" />
                        <div data-width="5"></div>
                        <afx-switch data data-id = "blog-publish" data-width="30"></afx-switch>
                        <div data-width="5"></div>
                    </afx-hbox>
                    
                    <div data-height="5"></div>
                </afx-vbox>
            </afx-hbox>
            
        </afx-tab-container>
    </afx-hbox>
</afx-app-window>