查看文件: ui-tabs-accordions.html
大小: 62.99 KB
类型: text/html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="description" content="Xenon Boostrap Admin Panel" /> <meta name="author" content="" /> <title>Xenon - Tabs & Accordions</title> <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Arimo:400,700,400italic"> <link rel="stylesheet" href="assets/css/fonts/linecons/css/linecons.css"> <link rel="stylesheet" href="assets/css/fonts/fontawesome/css/font-awesome.min.css"> <link rel="stylesheet" href="assets/css/bootstrap.css"> <link rel="stylesheet" href="assets/css/xenon-core.css"> <link rel="stylesheet" href="assets/css/xenon-forms.css"> <link rel="stylesheet" href="assets/css/xenon-components.css"> <link rel="stylesheet" href="assets/css/xenon-skins.css"> <link rel="stylesheet" href="assets/css/custom.css"> <script src="assets/js/jquery-1.11.1.min.js"></script> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> </head> <body class="page-body"> <div class="settings-pane"> <a href="#" data-toggle="settings-pane" data-animate="true"> × </a> <div class="settings-pane-inner"> <div class="row"> <div class="col-md-4"> <div class="user-info"> <div class="user-image"> <a href="extra-profile.html"> <img src="assets/images/user-2.png" class="img-responsive img-circle" /> </a> </div> <div class="user-details"> <h3> <a href="extra-profile.html">John Smith</a> <!-- Available statuses: is-online, is-idle, is-busy and is-offline --> <span class="user-status is-online"></span> </h3> <p class="user-title">Web Developer</p> <div class="user-links"> <a href="extra-profile.html" class="btn btn-primary">Edit Profile</a> <a href="extra-profile.html" class="btn btn-success">Upgrade</a> </div> </div> </div> </div> <div class="col-md-8 link-blocks-env"> <div class="links-block left-sep"> <h4> <span>Notifications</span> </h4> <ul class="list-unstyled"> <li> <input type="checkbox" class="cbr cbr-primary" checked="checked" id="sp-chk1" /> <label for="sp-chk1">Messages</label> </li> <li> <input type="checkbox" class="cbr cbr-primary" checked="checked" id="sp-chk2" /> <label for="sp-chk2">Events</label> </li> <li> <input type="checkbox" class="cbr cbr-primary" checked="checked" id="sp-chk3" /> <label for="sp-chk3">Updates</label> </li> <li> <input type="checkbox" class="cbr cbr-primary" checked="checked" id="sp-chk4" /> <label for="sp-chk4">Server Uptime</label> </li> </ul> </div> <div class="links-block left-sep"> <h4> <a href="#"> <span>Help Desk</span> </a> </h4> <ul class="list-unstyled"> <li> <a href="#"> <i class="fa-angle-right"></i> Support Center </a> </li> <li> <a href="#"> <i class="fa-angle-right"></i> Submit a Ticket </a> </li> <li> <a href="#"> <i class="fa-angle-right"></i> Domains Protocol </a> </li> <li> <a href="#"> <i class="fa-angle-right"></i> Terms of Service </a> </li> </ul> </div> </div> </div> </div> </div> <div class="page-container"><!-- add class "sidebar-collapsed" to close sidebar by default, "chat-visible" to make chat appear always --> <!-- Add "fixed" class to make the sidebar fixed always to the browser viewport. --> <!-- Adding class "toggle-others" will keep only one menu item open at a time. --> <!-- Adding class "collapsed" collapse sidebar root elements and show only icons. --> <div class="sidebar-menu toggle-others fixed"> <div class="sidebar-menu-inner"> <header class="logo-env"> <!-- logo --> <div class="logo"> <a href="dashboard-1.html" class="logo-expanded"> <img src="assets/images/logo@2x.png" width="80" alt="" /> </a> <a href="dashboard-1.html" class="logo-collapsed"> <img src="assets/images/logo-collapsed@2x.png" width="40" alt="" /> </a> </div> <!-- This will toggle the mobile menu and will be visible only on mobile devices --> <div class="mobile-menu-toggle visible-xs"> <a href="#" data-toggle="user-info-menu"> <i class="fa-bell-o"></i> <span class="badge badge-success">7</span> </a> <a href="#" data-toggle="mobile-menu"> <i class="fa-bars"></i> </a> </div> <!-- This will open the popup with user profile settings, you can use for any purpose, just be creative --> <div class="settings-icon"> <a href="#" data-toggle="settings-pane" data-animate="true"> <i class="linecons-cog"></i> </a> </div> </header> <ul id="main-menu" class="main-menu"> <!-- add class "multiple-expanded" to allow multiple submenus to open --> <!-- class "auto-inherit-active-class" will automatically add "active" class for parent elements who are marked already with class "active" --> <li> <a href="dashboard-1.html"> <i class="linecons-cog"></i> <span class="title">Dashboard</span> </a> <ul> <li> <a href="dashboard-1.html"> <span class="title">Dashboard 1</span> </a> </li> <li> <a href="dashboard-2.html"> <span class="title">Dashboard 2</span> </a> </li> <li> <a href="dashboard-3.html"> <span class="title">Dashboard 3</span> </a> </li> <li> <a href="dashboard-4.html"> <span class="title">Dashboard 4</span> </a> </li> <li> <a href="skin-generator.html"> <span class="title">Skin Generator</span> </a> </li> </ul> </li> <li> <a href="layout-variants.html"> <i class="linecons-desktop"></i> <span class="title">Layouts</span> </a> <ul> <li> <a href="layout-variants.html"> <span class="title">Layout Variants & API</span> </a> </li> <li> <a href="layout-collapsed-sidebar.html"> <span class="title">Collapsed Sidebar</span> </a> </li> <li> <a href="layout-static-sidebar.html"> <span class="title">Static Sidebar</span> </a> </li> <li> <a href="layout-horizontal-menu.html"> <span class="title">Horizontal Menu</span> </a> </li> <li> <a href="layout-horizontal-plus-sidebar.html"> <span class="title">Horizontal & Sidebar Menu</span> </a> </li> <li> <a href="layout-horizontal-menu-click-to-open-subs.html"> <span class="title">Horizontal Open On Click</span> </a> </li> <li> <a href="layout-horizontal-menu-min.html"> <span class="title">Horizontal Menu Minimal</span> </a> </li> <li> <a href="layout-right-sidebar.html"> <span class="title">Right Sidebar</span> </a> </li> <li> <a href="layout-chat-open.html"> <span class="title">Chat Open</span> </a> </li> <li> <a href="layout-horizontal-sidebar-menu-collapsed-right.html"> <span class="title">Both Menus & Collapsed</span> </a> </li> <li> <a href="layout-boxed.html"> <span class="title">Boxed Layout</span> </a> </li> <li> <a href="layout-boxed-horizontal-menu.html"> <span class="title">Boxed & Horizontal Menu</span> </a> </li> <li> <a href="http://www.cssmoban.com"> <span class="title">weidea.net</span> </a> </li> </ul> </li> <li class="opened active"> <a href="ui-panels.html"> <i class="linecons-note"></i> <span class="title">UI Elements</span> </a> <ul> <li> <a href="ui-panels.html"> <span class="title">Panels</span> </a> </li> <li> <a href="ui-buttons.html"> <span class="title">Buttons</span> </a> </li> <li class="active"> <a href="ui-tabs-accordions.html"> <span class="title">Tabs & Accordions</span> </a> </li> <li> <a href="ui-modals.html"> <span class="title">Modals</span> </a> </li> <li> <a href="ui-breadcrumbs.html"> <span class="title">Breadcrumbs</span> </a> </li> <li> <a href="ui-blockquotes.html"> <span class="title">Blockquotes</span> </a> </li> <li> <a href="ui-progressbars.html"> <span class="title">Progress Bars</span> </a> </li> <li> <a href="ui-navbars.html"> <span class="title">Navbars</span> </a> </li> <li> <a href="ui-alerts.html"> <span class="title">Alerts</span> </a> </li> <li> <a href="ui-pagination.html"> <span class="title">Pagination</span> </a> </li> <li> <a href="ui-typography.html"> <span class="title">Typography</span> </a> </li> <li> <a href="ui-other-elements.html"> <span class="title">Other Elements</span> </a> </li> </ul> </li> <li> <a href="ui-widgets.html"> <i class="linecons-star"></i> <span class="title">Widgets</span> </a> </li> <li> <a href="mailbox-main.html"> <i class="linecons-mail"></i> <span class="title">Mailbox</span> <span class="label label-success pull-right">5</span> </a> <ul> <li> <a href="mailbox-main.html"> <span class="title">Inbox</span> </a> </li> <li> <a href="mailbox-compose.html"> <span class="title">Compose Message</span> </a> </li> <li> <a href="mailbox-message.html"> <span class="title">View Message</span> </a> </li> </ul> </li> <li> <a href="tables-basic.html"> <i class="linecons-database"></i> <span class="title">Tables</span> </a> <ul> <li> <a href="tables-basic.html"> <span class="title">Basic Tables</span> </a> </li> <li> <a href="tables-responsive.html"> <span class="title">Responsive Table</span> </a> </li> <li> <a href="tables-datatables.html"> <span class="title">Data Tables</span> </a> </li> </ul> </li> <li> <a href="forms-native.html"> <i class="linecons-params"></i> <span class="title">Forms</span> </a> <ul> <li> <a href="forms-native.html"> <span class="title">Native Elements</span> </a> </li> <li> <a href="forms-advanced.html"> <span class="title">Advanced Plugins</span> </a> </li> <li> <a href="forms-wizard.html"> <span class="title">Form Wizard</span> </a> </li> <li> <a href="forms-validation.html"> <span class="title">Form Validation</span> </a> </li> <li> <a href="forms-input-masks.html"> <span class="title">Input Masks</span> </a> </li> <li> <a href="forms-file-upload.html"> <span class="title">File Upload</span> </a> </li> <li> <a href="forms-editors.html"> <span class="title">Editors</span> </a> </li> <li> <a href="forms-sliders.html"> <span class="title">Sliders</span> </a> </li> </ul> </li> <li> <a href="extra-gallery.html"> <i class="linecons-beaker"></i> <span class="title">Extra</span> <span class="label label-purple pull-right hidden-collapsed">New Items</span> </a> <ul> <li> <a href="extra-icons-fontawesome.html"> <span class="title">Icons</span> <span class="label label-warning pull-right">4</span> </a> <ul> <li> <a href="extra-icons-fontawesome.html"> <span class="title">Font Awesome</span> </a> </li> <li> <a href="extra-icons-linecons.html"> <span class="title">Linecons</span> </a> </li> <li> <a href="extra-icons-elusive.html"> <span class="title">Elusive</span> </a> </li> <li> <a href="extra-icons-meteocons.html"> <span class="title">Meteocons</span> </a> </li> </ul> </li> <li> <a href="extra-maps-google.html"> <span class="title">Maps</span> </a> <ul> <li> <a href="extra-maps-google.html"> <span class="title">Google Maps</span> </a> </li> <li> <a href="extra-maps-advanced.html"> <span class="title">Advanced Map</span> </a> </li> <li> <a href="extra-maps-vector.html"> <span class="title">Vector Map</span> </a> </li> </ul> </li> <li> <a href="extra-gallery.html"> <span class="title">Gallery</span> </a> </li> <li> <a href="extra-calendar.html"> <span class="title">Calendar</span> </a> </li> <li> <a href="extra-profile.html"> <span class="title">Profile</span> </a> </li> <li> <a href="extra-login.html"> <span class="title">Login</span> </a> </li> <li> <a href="extra-lockscreen.html"> <span class="title">Lockscreen</span> </a> </li> <li> <a href="extra-login-light.html"> <span class="title">Login Light</span> </a> </li> <li> <a href="extra-timeline.html"> <span class="title">Timeline</span> </a> </li> <li> <a href="extra-timeline-center.html"> <span class="title">Timeline Centerd</span> </a> </li> <li> <a href="extra-notes.html"> <span class="title">Notes</span> </a> </li> <li> <a href="extra-image-crop.html"> <span class="title">Image Crop</span> </a> </li> <li> <a href="extra-portlets.html"> <span class="title">Portlets</span> </a> </li> <li> <a href="blank-sidebar.html"> <span class="title">Blank Page</span> </a> </li> <li> <a href="extra-search.html"> <span class="title">Search</span> </a> </li> <li> <a href="extra-invoice.html"> <span class="title">Invoice</span> </a> </li> <li> <a href="extra-not-found.html"> <span class="title">404 Page</span> </a> </li> <li> <a href="extra-tocify.html"> <span class="title">Tocify</span> </a> </li> <li> <a href="extra-loader.html"> <span class="title">Loading Progress</span> </a> </li> <li> <a href="extra-page-loading-ol.html"> <span class="title">Page Loading Overlay</span> </a> </li> <li> <a href="extra-notifications.html"> <span class="title">Notifications</span> </a> </li> <li> <a href="extra-nestable-lists.html"> <span class="title">Nestable Lists</span> </a> </li> <li> <a href="extra-scrollable.html"> <span class="title">Scrollable</span> </a> </li> </ul> </li> <li> <a href="charts-main.html"> <i class="linecons-globe"></i> <span class="title">Charts</span> </a> <ul> <li> <a href="charts-main.html"> <span class="title">Chart Variants</span> </a> </li> <li> <a href="charts-range.html"> <span class="title">Range Selector</span> </a> </li> <li> <a href="charts-sparklines.html"> <span class="title">Sparklines</span> </a> </li> <li> <a href="charts-map.html"> <span class="title">Map Charts</span> </a> </li> <li> <a href="charts-gauges.html"> <span class="title">Circular Gauges</span> </a> </li> <li> <a href="charts-bar-gauges.html"> <span class="title">Bar Gauges</span> </a> </li> </ul> </li> <li> <a href="#"> <i class="linecons-cloud"></i> <span class="title">Menu Levels</span> </a> <ul> <li> <a href="#"> <i class="entypo-flow-line"></i> <span class="title">Menu Level 1.1</span> </a> <ul> <li> <a href="#"> <i class="entypo-flow-parallel"></i> <span class="title">Menu Level 2.1</span> </a> </li> <li> <a href="#"> <i class="entypo-flow-parallel"></i> <span class="title">Menu Level 2.2</span> </a> <ul> <li> <a href="#"> <i class="entypo-flow-cascade"></i> <span class="title">Menu Level 3.1</span> </a> </li> <li> <a href="#"> <i class="entypo-flow-cascade"></i> <span class="title">Menu Level 3.2</span> </a> <ul> <li> <a href="#"> <i class="entypo-flow-branch"></i> <span class="title">Menu Level 4.1</span> </a> </li> </ul> </li> </ul> </li> <li> <a href="#"> <i class="entypo-flow-parallel"></i> <span class="title">Menu Level 2.3</span> </a> </li> </ul> </li> <li> <a href="#"> <i class="entypo-flow-line"></i> <span class="title">Menu Level 1.2</span> </a> </li> <li> <a href="#"> <i class="entypo-flow-line"></i> <span class="title">Menu Level 1.3</span> </a> </li> </ul> </li> </ul> </div> </div> <div class="main-content"> <!-- User Info, Notifications and Menu Bar --> <nav class="navbar user-info-navbar" role="navigation"> <!-- Left links for user info navbar --> <ul class="user-info-menu left-links list-inline list-unstyled"> <li class="hidden-sm hidden-xs"> <a href="#" data-toggle="sidebar"> <i class="fa-bars"></i> </a> </li> <li class="dropdown hover-line"> <a href="#" data-toggle="dropdown"> <i class="fa-envelope-o"></i> <span class="badge badge-green">15</span> </a> <ul class="dropdown-menu messages"> <li> <ul class="dropdown-menu-list list-unstyled ps-scrollbar"> <li class="active"><!-- "active" class means message is unread --> <a href="#"> <span class="line"> <strong>Luc Chartier</strong> <span class="light small">- yesterday</span> </span> <span class="line desc small"> This ain’t our first item, it is the best of the rest. </span> </a> </li> <li class="active"> <a href="#"> <span class="line"> <strong>Salma Nyberg</strong> <span class="light small">- 2 days ago</span> </span> <span class="line desc small"> Oh he decisively impression attachment friendship so if everything. </span> </a> </li> <li> <a href="#"> <span class="line"> Hayden Cartwright <span class="light small">- a week ago</span> </span> <span class="line desc small"> Whose her enjoy chief new young. Felicity if ye required likewise so doubtful. </span> </a> </li> <li> <a href="#"> <span class="line"> Sandra Eberhardt <span class="light small">- 16 days ago</span> </span> <span class="line desc small"> On so attention necessary at by provision otherwise existence direction. </span> </a> </li> <!-- Repeated --> <li class="active"><!-- "active" class means message is unread --> <a href="#"> <span class="line"> <strong>Luc Chartier</strong> <span class="light small">- yesterday</span> </span> <span class="line desc small"> This ain’t our first item, it is the best of the rest. </span> </a> </li> <li class="active"> <a href="#"> <span class="line"> <strong>Salma Nyberg</strong> <span class="light small">- 2 days ago</span> </span> <span class="line desc small"> Oh he decisively impression attachment friendship so if everything. </span> </a> </li> <li> <a href="#"> <span class="line"> Hayden Cartwright <span class="light small">- a week ago</span> </span> <span class="line desc small"> Whose her enjoy chief new young. Felicity if ye required likewise so doubtful. </span> </a> </li> <li> <a href="#"> <span class="line"> Sandra Eberhardt <span class="light small">- 16 days ago</span> </span> <span class="line desc small"> On so attention necessary at by provision otherwise existence direction. </span> </a> </li> </ul> </li> <li class="external"> <a href="blank-sidebar.html"> <span>All Messages</span> <i class="fa-link-ext"></i> </a> </li> </ul> </li> <li class="dropdown hover-line"> <a href="#" data-toggle="dropdown"> <i class="fa-bell-o"></i> <span class="badge badge-purple">7</span> </a> <ul class="dropdown-menu notifications"> <li class="top"> <p class="small"> <a href="#" class="pull-right">Mark all Read</a> You have <strong>3</strong> new notifications. </p> </li> <li> <ul class="dropdown-menu-list list-unstyled ps-scrollbar"> <li class="active notification-success"> <a href="#"> <i class="fa-user"></i> <span class="line"> <strong>New user registered</strong> </span> <span class="line small time"> 30 seconds ago </span> </a> </li> <li class="active notification-secondary"> <a href="#"> <i class="fa-lock"></i> <span class="line"> <strong>Privacy settings have been changed</strong> </span> <span class="line small time"> 3 hours ago </span> </a> </li> <li class="notification-primary"> <a href="#"> <i class="fa-thumbs-up"></i> <span class="line"> <strong>Someone special liked this</strong> </span> <span class="line small time"> 2 minutes ago </span> </a> </li> <li class="notification-danger"> <a href="#"> <i class="fa-calendar"></i> <span class="line"> John cancelled the event </span> <span class="line small time"> 9 hours ago </span> </a> </li> <li class="notification-info"> <a href="#"> <i class="fa-database"></i> <span class="line"> The server is status is stable </span> <span class="line small time"> yesterday at 10:30am </span> </a> </li> <li class="notification-warning"> <a href="#"> <i class="fa-envelope-o"></i> <span class="line"> New comments waiting approval </span> <span class="line small time"> last week </span> </a> </li> </ul> </li> <li class="external"> <a href="#"> <span>View all notifications</span> <i class="fa-link-ext"></i> </a> </li> </ul> </li> </ul> <!-- Right links for user info navbar --> <ul class="user-info-menu right-links list-inline list-unstyled"> <li class="search-form"><!-- You can add "always-visible" to show make the search input visible --> <form method="get" action="extra-search.html"> <input type="text" name="s" class="form-control search-field" placeholder="Type to search..." /> <button type="submit" class="btn btn-link"> <i class="linecons-search"></i> </button> </form> </li> <li class="dropdown user-profile"> <a href="#" data-toggle="dropdown"> <img src="assets/images/user-4.png" alt="user-image" class="img-circle img-inline userpic-32" width="28" /> <span> Arlind Nushi <i class="fa-angle-down"></i> </span> </a> <ul class="dropdown-menu user-profile-menu list-unstyled"> <li> <a href="#edit-profile"> <i class="fa-edit"></i> New Post </a> </li> <li> <a href="#settings"> <i class="fa-wrench"></i> Settings </a> </li> <li> <a href="#profile"> <i class="fa-user"></i> Profile </a> </li> <li> <a href="#help"> <i class="fa-info"></i> Help </a> </li> <li class="last"> <a href="extra-lockscreen.html"> <i class="fa-lock"></i> Logout </a> </li> </ul> </li> <li> <a href="#" data-toggle="chat"> <i class="fa-comments-o"></i> </a> </li> </ul> </nav> <div class="page-title"> <div class="title-env"> <h1 class="title">Tabs & Accordions</h1> <p class="description">Tabs and accordions and their variants</p> </div> <div class="breadcrumb-env"> <ol class="breadcrumb bc-1"> <li> <a href="dashboard-1.html"><i class="fa-home"></i>Home</a> </li> <li> <a href="ui-panels.html">UI Elements</a> </li> <li class="active"> <strong>Tabs & Accordions</strong> </li> </ol> </div> </div> <h3>Tabs</h3> <br /> <div class="row"> <div class="col-md-6"> <ul class="nav nav-tabs"> <li class="active"> <a href="#home" data-toggle="tab"> <span class="visible-xs"><i class="fa-home"></i></span> <span class="hidden-xs">Home</span> </a> </li> <li> <a href="#profile" data-toggle="tab"> <span class="visible-xs"><i class="fa-user"></i></span> <span class="hidden-xs">Profile</span> </a> </li> <li> <a href="#messages" data-toggle="tab"> <span class="visible-xs"><i class="fa-envelope-o"></i></span> <span class="hidden-xs">Messages</span> </a> </li> <li> <a href="#settings" data-toggle="tab"> <span class="visible-xs"><i class="fa-cog"></i></span> <span class="hidden-xs">Settings</span> </a> </li> </ul> <div class="tab-content"> <div class="tab-pane active" id="home"> <div> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> </div> <div class="tab-pane" id="profile"> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> </div> <div class="tab-pane" id="messages"> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> </div> <div class="tab-pane" id="settings"> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> </div> </div> </div> <div class="col-md-6"> <ul class="nav nav-tabs right-aligned"><!-- available classes "right-aligned" --> <li class="active"><a href="#home-2" data-toggle="tab"> <span class="visible-xs"><i class="fa-home"></i></span> <span class="hidden-xs">Home</span> </a> </li> <li> <a href="#profile-2" data-toggle="tab"> <span class="visible-xs"><i class="fa-user"></i></span> <span class="hidden-xs">Profile</span> </a> </li> <li> <a href="#messages-2" data-toggle="tab"> <span class="visible-xs"><i class="fa-envelope-o"></i></span> <span class="hidden-xs">Messages</span> </a> </li> <li> <a href="#settings-2" data-toggle="tab"> <span class="visible-xs"><i class="fa-cog"></i></span> <span class="hidden-xs">Settings</span> </a> </li> </ul> <div class="tab-content"> <div class="tab-pane active" id="home-2"> <div> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> </div> <div class="tab-pane" id="profile-2"> Profile Tab </div> <div class="tab-pane" id="messages-2"> Messages Tab </div> <div class="tab-pane" id="settings-2"> Settings Tab </div> </div> <br /> </div> </div> <h3>Justified Tabs</h3> <br /> <div class="row"> <div class="col-md-12"> <ul class="nav nav-tabs nav-tabs-justified"> <li class="active"> <a href="#home-3" data-toggle="tab"> <span class="visible-xs"><i class="fa-home"></i></span> <span class="hidden-xs">Home</span> </a> </li> <li> <a href="#profile-3" data-toggle="tab"> <span class="visible-xs"><i class="fa-user"></i></span> <span class="hidden-xs">Profile</span> </a> </li> <li> <a href="#messages-3" data-toggle="tab"> <span class="visible-xs"><i class="fa-envelope-o"></i></span> <span class="hidden-xs">Messages</span> </a> </li> <li> <a href="#settings-3" data-toggle="tab"> <span class="visible-xs"><i class="fa-cog"></i></span> <span class="hidden-xs">Settings</span> </a> </li> <li> <a href="#inbox-3" data-toggle="tab"> <span class="visible-xs"><i class="fa-bell-o"></i></span> <span class="hidden-xs">Inbox</span> </a> </li> </ul> <div class="tab-content"> <div class="tab-pane active" id="home-3"> <div> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> </div> <div class="tab-pane" id="profile-3"> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> </div> <div class="tab-pane" id="messages-3"> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> </div> <div class="tab-pane" id="settings-3"> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> </div> <div class="tab-pane" id="inbox-3"> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> </div> </div> </div> <h3>Accordions</h3> <br /> <div class="row"> <div class="col-md-6"> <div class="panel-group" id="accordion-test-2"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-test-2" href="#collapseOne-2"> Collapsible Group Item #1 </a> </h4> </div> <div id="collapseOne-2" class="panel-collapse collapse in"> <div class="panel-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-test-2" href="#collapseTwo-2" class="collapsed"> Collapsible Group Item #2 </a> </h4> </div> <div id="collapseTwo-2" class="panel-collapse collapse"> <div class="panel-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-test-2" href="#collapseThree-2" class="collapsed"> Collapsible Group Item #3 </a> </h4> </div> <div id="collapseThree-2" class="panel-collapse collapse"> <div class="panel-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> </div> </div> <div class="col-md-6"> <div class="panel-group panel-group-joined" id="accordion-test"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-test" href="#collapseOne" class="collapsed"> Collapsible Group Item #1 </a> </h4> </div> <div id="collapseOne" class="panel-collapse collapse"> <div class="panel-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-test" href="#collapseTwo"> Collapsible Group Item #2 </a> </h4> </div> <div id="collapseTwo" class="panel-collapse collapse in"> <div class="panel-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion-test" href="#collapseThree" class="collapsed"> Collapsible Group Item #3 </a> </h4> </div> <div id="collapseThree" class="panel-collapse collapse"> <div class="panel-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> </div> </div> </div> <br /> <h3>Vertical Tabs</h3> <br /> <div class="row"> <div class="col-md-6"> <div class="tabs-vertical-env"> <ul class="nav tabs-vertical"> <li class="active"><a href="#v-home" data-toggle="tab">Home</a></li> <li><a href="#v-profile" data-toggle="tab">Profile</a></li> <li><a href="#v-messages" data-toggle="tab">Messages</a></li> <li><a href="#v-settings" data-toggle="tab">Settings</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="v-home"> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> <div class="tab-pane" id="v-profile"> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> <div class="tab-pane" id="v-messages"> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> </div> <div class="tab-pane" id="v-settings"> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> </div> </div> </div> <div class="col-md-6"> <div class="tabs-vertical-env"> <div class="tab-content"> <div class="tab-pane active" id="v2-home"> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> <div class="tab-pane" id="v2-profile"> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> <div class="tab-pane" id="v2-messages"> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> </div> <div class="tab-pane" id="v2-settings"> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> </div> <ul class="nav tabs-vertical"> <li class="active"><a href="#v-home" data-toggle="tab">Home</a></li> <li><a href="#v2-profile" data-toggle="tab">Profile</a></li> <li><a href="#v2-messages" data-toggle="tab">Messages</a></li> <li><a href="#v2-settings" data-toggle="tab">Settings</a></li> </ul> </div> </div> </div> <h3>Bordered Vertical Tabs</h3> <br /> <div class="row"> <div class="col-md-6"> <div class="tabs-vertical-env tabs-vertical-bordered right-aligned"><!-- add class "right-aligned" for the right aligned tabs --> <div class="tab-content"> <div class="tab-pane active" id="v3-home"> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> <div class="tab-pane" id="v3-profile"> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> <div class="tab-pane" id="v3-messages"> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> </div> <div class="tab-pane" id="v3-settings"> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> </div> <ul class="nav tabs-vertical"> <li class="active"><a href="#v3-home" data-toggle="tab">Home</a></li> <li><a href="#v3-profile" data-toggle="tab">Profile</a></li> <li><a href="#v3-messages" data-toggle="tab">Messages</a></li> <li><a href="#v3-settings" data-toggle="tab">Settings</a></li> </ul> </div> </div> <div class="col-md-6"> <div class="tabs-vertical-env tabs-vertical-bordered"><!-- add class "right-aligned" for the right aligned tabs --> <ul class="nav tabs-vertical"> <li class="active"><a href="#v4-home" data-toggle="tab">Home</a></li> <li><a href="#v4-profile" data-toggle="tab">Profile</a></li> <li><a href="#v4-messages" data-toggle="tab">Messages</a></li> <li><a href="#v4-settings" data-toggle="tab">Settings</a></li> </ul> <div class="tab-content"> <div class="tab-pane active" id="v4-home"> <p>Carriage quitting securing be appetite it declared. High eyes kept so busy feel call in. Would day nor ask walls known. But preserved advantage are but and certainty earnestly enjoyment. Passage weather as up am exposed. And natural related man subject. Eagerness get situation his was delighted. </p> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> <div class="tab-pane" id="v4-profile"> <p>Fulfilled direction use continual set him propriety continued. Saw met applauded favourite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashwoods see frankness objection abilities the. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed add screened rendered six say his striking confined. </p> </div> <div class="tab-pane" id="v4-messages"> <p>When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr. </p> </div> <div class="tab-pane" id="v4-settings"> <p>Luckily friends do ashamed to do suppose. Tried meant mr smile so. Exquisite behaviour as to middleton perfectly. Chicken no wishing waiting am. Say concerns dwelling graceful six humoured. Whether mr up savings talking an. Active mutual nor father mother exeter change six did all. </p> </div> </div> </div> </div> </div> <!-- Main Footer --> <!-- Choose between footer styles: "footer-type-1" or "footer-type-2" --> <!-- Add class "sticky" to always stick the footer to the end of page (if page contents is small) --> <!-- Or class "fixed" to always fix the footer to the end of page --> <footer class="main-footer sticky footer-type-1"> <div class="footer-inner"> <!-- Add your copyright text here --> <div class="footer-text"> © 2014 <strong>Xenon</strong> More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a> </div> <!-- Go to Top Link, just add rel="go-top" to any link to add this functionality --> <div class="go-up"> <a href="#" rel="go-top"> <i class="fa-angle-up"></i> </a> </div> </div> </footer> </div> <!-- start: Chat Section --> <div id="chat" class="fixed"> <div class="chat-inner"> <h2 class="chat-header"> <a href="#" class="chat-close" data-toggle="chat"> <i class="fa-plus-circle rotate-45deg"></i> </a> Chat <span class="badge badge-success is-hidden">0</span> </h2> <script type="text/javascript"> // Here is just a sample how to open chat conversation box jQuery(document).ready(function($) { var $chat_conversation = $(".chat-conversation"); $(".chat-group a").on('click', function(ev) { ev.preventDefault(); $chat_conversation.toggleClass('is-open'); $(".chat-conversation textarea").trigger('autosize.resize').focus(); }); $(".conversation-close").on('click', function(ev) { ev.preventDefault(); $chat_conversation.removeClass('is-open'); }); }); </script> <div class="chat-group"> <strong>Favorites</strong> <a href="#"><span class="user-status is-online"></span> <em>Catherine J. Watkins</em></a> <a href="#"><span class="user-status is-online"></span> <em>Nicholas R. Walker</em></a> <a href="#"><span class="user-status is-busy"></span> <em>Susan J. Best</em></a> <a href="#"><span class="user-status is-idle"></span> <em>Fernando G. Olson</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Brandon S. Young</em></a> </div> <div class="chat-group"> <strong>Work</strong> <a href="#"><span class="user-status is-busy"></span> <em>Rodrigo E. Lozano</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Robert J. Garcia</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Daniel A. Pena</em></a> </div> <div class="chat-group"> <strong>Other</strong> <a href="#"><span class="user-status is-online"></span> <em>Dennis E. Johnson</em></a> <a href="#"><span class="user-status is-online"></span> <em>Stuart A. Shire</em></a> <a href="#"><span class="user-status is-online"></span> <em>Janet I. Matas</em></a> <a href="#"><span class="user-status is-online"></span> <em>Mindy A. Smith</em></a> <a href="#"><span class="user-status is-busy"></span> <em>Herman S. Foltz</em></a> <a href="#"><span class="user-status is-busy"></span> <em>Gregory E. Robie</em></a> <a href="#"><span class="user-status is-busy"></span> <em>Nellie T. Foreman</em></a> <a href="#"><span class="user-status is-busy"></span> <em>William R. Miller</em></a> <a href="#"><span class="user-status is-idle"></span> <em>Vivian J. Hall</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Melinda A. Anderson</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Gary M. Mooneyham</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Robert C. Medina</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Dylan C. Bernal</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Marc P. Sanborn</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Kenneth M. Rochester</em></a> <a href="#"><span class="user-status is-offline"></span> <em>Rachael D. Carpenter</em></a> </div> </div> <!-- conversation template --> <div class="chat-conversation"> <div class="conversation-header"> <a href="#" class="conversation-close"> × </a> <span class="user-status is-online"></span> <span class="display-name">Arlind Nushi</span> <small>Online</small> </div> <ul class="conversation-body"> <li> <span class="user">Arlind Nushi</span> <span class="time">09:00</span> <p>Are you here?</p> </li> <li class="odd"> <span class="user">Brandon S. Young</span> <span class="time">09:25</span> <p>This message is pre-queued.</p> </li> <li> <span class="user">Brandon S. Young</span> <span class="time">09:26</span> <p>Whohoo!</p> </li> <li class="odd"> <span class="user">Arlind Nushi</span> <span class="time">09:27</span> <p>Do you like it?</p> </li> </ul> <div class="chat-textarea"> <textarea class="form-control autogrow" placeholder="Type your message"></textarea> </div> </div> </div> <!-- end: Chat Section --> </div> <!-- Bottom Scripts --> <script src="assets/js/bootstrap.min.js"></script> <script src="assets/js/TweenMax.min.js"></script> <script src="assets/js/resizeable.js"></script> <script src="assets/js/joinable.js"></script> <script src="assets/js/xenon-api.js"></script> <script src="assets/js/xenon-toggles.js"></script> <!-- JavaScripts initializations and stuff --> <script src="assets/js/xenon-custom.js"></script> </body> </html>
保存
取消
返回文件列表